A magyar lokalizáció fejlesztése és támogatása jelenleg meghatározatlan ideig fel van függesztve, így ezen a fórumon kicsi a valószínűsége annak, hogy valaki segíteni fog. Gyorsabb segítséghez próbáld meg feltenni a kérdésedet az angol fórumon (ajánlott) vagy a uCoz Facebook oldalán.
A fórum moderátora: KovJonas  
uCoz közösség » Webmester-részleg » A honlap külalakjának testreszabása » Külalak vezérlése
Külalak vezérlése
Nomad
Üzenetek: 4
Hírnév: 0

Üzenet # 46 | 18:06
Mind a 6-é kellene... mert több oldalam van, de az 1-est és a 4-est használom eddig, de ez az 5-ös is tettszik... biggrin
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 47 | 18:38


CSS-be:
Kód
/* --- DOWNLOAD --- */
.sfdl2 { width:165px;height:38px;padding:0;position:relative;font:bold 12px !important; border:1px solid #aaa;display:inline;float:left;text-decoration:none;-moz-box-shadow:rgba(255, 255, 255, 0.6) 0 1px 0 0;-webkit-box-shadow:rgba(255, 255, 255, 0.6) 0 1px 0 0;-o-box-shadow:rgba(255, 255, 255, 0.6) 0 1px 0 0;box-shadow:rgba(255, 255, 255, 0.6) 0 1px 0 0;-moz-border-radius:4px;-webkit-border-radius:4px;-o-border-radius:4px;-ms-border-radius:4px;-khtml-border-radius:4px;border-radius:4px;background:#e5e5e5;background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #fff), color-stop(100%, #ccc));background-image:-moz-linear-gradient(top, #fff 0%, #ccc 100%);background-image:linear-gradient(top, #fff 0%, #ccc 100%);text-shadow:#fff 0 1px;margin:0 10px 7px 0;overflow:hidden;color:#555 !important;}
   .sfdl2:hover { cursor:pointer !important;text-decoration:none;background:#eee !important;background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(0%, #fff), color-stop(100%, #eee));background-image:-moz-linear-gradient(top, #fff 0%, #eee 100%);background-image:linear-gradient(top, #fff 0%, #eee 100%);}
   .sfdl2 span { border-radius:6px;-moz-border-radius:6px;-webkit-border-radius:6px;height:29px;line-height:13px;margin:3px;padding:4px 0 0 4px;text-align:left;text-shadow:none;width:123px;float:right;margin-left:20px;color:#FFF;background:#363;background-image:-moz-linear-gradient(center top, #393 0%, #373 100%);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0, #393),color-stop(1, #373));}
   .sfdl2 small { background:no-repeat url(http://ucoztaska.ucoz.hu/favicon.ico);background-size:16px;color:#ADC2AD; font-weight:normal;height:34px;left:9px;padding:9px 0 0 30px;position:absolute;top:12px;width:120px;white-space:nowrap;overflow:hidden;font-size:90%;}   
/* --- -------- --- */


Az anyag és hozzászólásainak oldala sablonban ahol a gombot látni szeretnénk:
Kód
<a href="$FILE_URL$" class="sfdl2">      
      <span>      
      Letöltés<br/>      
      <small>$FILE_SIZE$</small>      
      </span>      
      </a>




Forrás: MaxRom

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 48 | 18:40

(Descarca = Letöltés; Size = Méret; Descarcari = Letöltések (száma / hányan töltötték le))
CSS-be:
Kód
/* Adaptations by coffee aka mozila aka ololowka */     
     .mknop {     
     display: inline-block;     
     margin: 10px 0px;     
     height: 30px;     
     border: 1px solid #419DB8;     
     border-radius: 5px;     
     box-shadow: inset 0px 1px 0px #7ACBE3, 0px 1px 0px 0px #fff, 0px 2px 4px 0px #90C9D8;     
     background: #58bedc;     
     background: -moz-linear-gradient(top, #58bedc 11%, #3097b5 100%);     
     background: -webkit-gradient(linear, left top, left bottom, color-stop(11%,#58bedc), color-stop(100%,#3097b5));     
     background: -webkit-linear-gradient(top, #58bedc 11%,#3097b5 100%);     
     background: -o-linear-gradient(top, #58bedc 11%,#3097b5 100%);     
     background: -ms-linear-gradient(top, #58bedc 11%,#3097b5 100%);     
     background: linear-gradient(to bottom, #58bedc 11%,#3097b5 100%);     
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58bedc', endColorstr='#3097b5',GradientType=0 );     
     }     
     
     .mknop:hover {     
     display: inline-block;     
     margin: 10px 0px;     
     height: 30px;     
     border: 1px solid #419DB8;     
     border-radius: 5px;     
     box-shadow: inset 0px 1px 0px #7ACBE3, 0px 1px 0px 0px #fff, 0px 2px 4px 0px #2186A2;     
     background: #58bedc;     
     background: -moz-linear-gradient(top, #58bedc 11%, #21819D 100%);     
     background: -webkit-gradient(linear, left top, left bottom, color-stop(11%,#58bedc), color-stop(100%,#21819D));     
     background: -webkit-linear-gradient(top, #58bedc 11%,#21819D 100%);     
     background: -o-linear-gradient(top, #58bedc 11%,#21819D 100%);     
     background: -ms-linear-gradient(top, #58bedc 11%,#21819D 100%);     
     background: linear-gradient(to bottom, #58bedc 11%,#21819D 100%);     
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58bedc', endColorstr='#21819D',GradientType=0 );     
     }     
     
     .mknoplink {     
     padding: 2px 8px;     
     display: inline-block;     
     background: #efefef;     
     background: -moz-linear-gradient(top, #efefef 0%, #dbdbdb 100%);     
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#dbdbdb));     
     background: -webkit-linear-gradient(top, #efefef 0%,#dbdbdb 100%);     
     background: -o-linear-gradient(top, #efefef 0%,#dbdbdb 100%);     
     background: -ms-linear-gradient(top, #efefef 0%,#dbdbdb 100%);     
     background: linear-gradient(to bottom, #efefef 0%,#dbdbdb 100%);     
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#dbdbdb',GradientType=0 );     
     box-shadow: inset 0px 1px 0px #fff,0px 1px 0px #E5E5E5;     
     border-radius: 3px;     
     
     text-shadow: 0px 1px 0px #fff;     
     margin: 4px 10px 0px 5px;     
     color: #15586A;     
     font: 14px Arial;     
     }     
     
     .mknopsize {     
     margin: 0px 10px 0px 7px;     
     display: inline-block;     
     padding: 2px 5px;     
     background: #1A6479;     
     box-shadow: inset 0px 1px 2px #0A4352, 0px 1px 0px #48C1E3;     
     border-radius: 3px;     
     color: #C9F5FF;     
     text-shadow: 0px -1px 0px #0D3E4B;     
     
     }     
     
     .mknopdownload {     
     display: inline-block;     
     color: #D6F7FF;     
     text-shadow: 0px -1px 0px #1A6479;     
     }     
     
     .mknopcifr {     
     margin: 0px 5px 0px 5px;     
     display: inline-block;     
     padding: 2px 5px;     
     background: #1A6479;     
     box-shadow: inset 0px 1px 2px #0A4352, 0px 1px 0px #48C1E3;     
     border-radius: 3px;     
     color: #C9F5FF;     
     text-shadow: 0px -1px 0px #0D3E4B;     
     }     
     .mknorazt {     
     display: inline-block;     
     color: #D6F7FF;     
     text-shadow: 0px -1px 0px #1A6479;     
     }     
     /* ------ */


Az anyag és hozzászólásainak oldala sablonba, ahol a gombot szeretnénk látni:
Kód
<?if($FILE_URL$)?><a href="$FILE_URL$"><div class="mknop"><div class="mknoplink">Letöltés</div><?if($FILE_SIZE$)?><div class="mknorazt">Méret:</div><div class="mknopsize">$FILE_SIZE$</div><?endif?><div class="mknopdownload">Letöltések: <div class="mknopcifr">$LOADS$</div></div></div></a><?endif?>     
     <?if($RFILE_URL$)?><a href="$RFILE_URL$"><div class="mknop"><div class="mknoplink">Letöltés</div><?if($FILE_SIZE$)?><div class="mknorazt">Méret:</div><div class="mknopsize">$FILE_SIZE$</div><?endif?><div class="mknopdownload">Letöltések: <div class="mknopcifr">$LOADS$</div></div></div></a><?endif?>


Forrás: Webo4ka

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 49 | 18:41

(Descarca fisieru = Fájl letöltése; Marime = Méret)

Az anyag és hozzászólásainak oldala sablonban, a és tagek közé:
Kód
<?if($USER_AGENT$='opera')?>       
   <link type="text/css" rel="StyleSheet" href="http://maxrom.ucoz.com/css/1/btndesc/fixed_opera.css" />       
   <?else?>       
   <link type="text/css" rel="StyleSheet" href="http://maxrom.ucoz.com/css/1/btndesc/btn.css" />       
   <?endif?>


Ugyanebben a sablonban, ahol a gombot látni szeretnéd:
Kód
<div class="download-btn" style="margin:15px;">       
    <a href="<?if($FILE_URL$)?>$FILE_URL$<?else?>$RFILE_URL$<?endif?>" class="download-btn" title="$ENTRY_TITLE$ letöltése">       
    <span class="title">Fájl letöltése</span><br>       
    <span class="size">Méret: <?if($FILE_SIZE$)?>$FILE_SIZE$<?else?>$RFILE_SIZE$<?endif?></span>       
    </a>       
    </div>



Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 50 | 18:42


CSS-be:
Kód
a.download-link{display:block;padding:5px 0 0 0;margin-bottom:0.1em;text-decoration:none;color:#eeeeee;width:249px;background:url(http://portableapps.com/sites/all/themes/portableappsnew/images/download-portableapps.png) 0 0 no-repeat;text-align:left;line-height:145%;}
a.download-link span{display:block;min-height:37px;padding:10px;}* html a.download-link span{height:37px;}
a.download-link span{background:url(http://portableapps.com/sites/all/themes/portableappsnew/images/download-portableapps.png) 0 100% no-repeat;}
a.download-link strong{font-size:1.6em;text-decoration:none;font-weight:bold;color:#eeeeee;}
a.download-link em{font-style:normal;font-weight:normal;color:#eeeeee;letter-spacing:0;display:block;padding-top:3px;font-size:1em;}
a.download-link:hover,a.download-link:hover span,a.download-link:hover strong{color:white;cursor:pointer;background-position:100% 0;}
a.download-link:hover span{background-position:100% 100%;}


Az anyag és hozzászólásainak oldala sablonban, ahol a gombot látni szeretnénk:
Kód
<a href="$FILE_URL$" class="download-link" title="$ENTRY_TITLE$ letöltése">
        <span>
          <strong>Letöltés</strong>      
            <em>Fájlméret: $FILE_SIZE$</em>
         </span></a>


Forrás: MaxRom
Fordítás és módosítás: TorrentGame.uCoz.com

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 51 | 18:43


CSS-be:
Kód
.button {     
     width: 200px;     
     margin: 50px auto;     
     }     
     
     .button a {     
     display: block;     
     height: 50px;     
     width: 200px;     
          
     /*ТИП*/     
     color: white;     
     font: 17px/50px Helvetica, Verdana, sans-serif;     
     text-decoration: none;     
     text-align: center;     
     text-transform: uppercase;     
          
     /*ГРАДИЕНТ*/     
     background: #299a0b; /* Old browsers */     
     background: -moz-linear-gradient(top, #299a0b 0%, #299a0b 100%); /* FF3.6+ */     
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#299a0b), color-stop(100%,#299a0b)); /* Chrome,Safari4+ */     
     background: -webkit-linear-gradient(top, #299a0b 0%,#299a0b 100%); /* Chrome10+,Safari5.1+ */     
     background: -o-linear-gradient(top, #299a0b 0%,#299a0b 100%); /* Opera 11.10+ */     
     background: -ms-linear-gradient(top, #299a0b 0%,#299a0b 100%); /* IE10+ */     
     background: linear-gradient(top, #299a0b 0%,#299a0b 100%); /* W3C */     
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#299a0b', endColorstr='#299a0b',GradientType=0 ); /* IE6-9 */     
     }     
     
     .button a, p {     
     -webkit-border-radius: 10px;     
     -moz-border-radius: 10px;     
     border-radius: 10px;     
          
     -webkit-box-shadow: 2px 2px 8px rgba(0,0,0,0.2);     
     -moz-box-shadow: 2px 2px 8px rgba(0,0,0,0.2);     
     box-shadow: 2px 2px 8px rgba(0,0,0,0.2);     
     }     
     
     p {     
     background: #222;     
     display: block;     
     height: 40px;     
     width: 180px;     
     margin: -50px 0 0 10px;     
          
     /*ТИП*/     
     text-align: center;     
     font: 12px/45px Helvetica, Verdana, sans-serif;     
     color: #fff;     
          
     /*ПОЛОЖЕНИЕ*/     
     position: absolute;     
     z-index: -1;     
          
     /*ПЕРЕХОД*/     
     -webkit-transition: margin 0.5s ease;     
     -moz-transition: margin 0.5s ease;     
     -o-transition: margin 0.5s ease;     
     -ms-transition: margin 0.5s ease;     
     transition: margin 0.5s ease;     
     }     
     
     /*HOVER*/     
     .button:hover .bottom {     
     margin: -10px 0 0 10px;     
     }     
     
     .button:hover .top {     
     margin: -80px 0 0 10px;     
     line-height: 35px;     
     }     
     
     /*ACTIVE*/     
     .button a:active {     
     background: #00b7ea; /* Old browsers */     
     background: -moz-linear-gradient(top, #00b7ea 36%, #009ec3 100%); /* FF3.6+ */     
     background: -webkit-gradient(linear, left top, left bottom, color-stop(36%,#00b7ea), color-stop(100%,#009ec3)); /* Chrome,Safari4+ */     
     background: -webkit-linear-gradient(top, #00b7ea 36%,#009ec3 100%); /* Chrome10+,Safari5.1+ */     
     background: -o-linear-gradient(top, #00b7ea 36%,#009ec3 100%); /* Opera 11.10+ */     
     background: -ms-linear-gradient(top, #00b7ea 36%,#009ec3 100%); /* IE10+ */     
     background: linear-gradient(top, #00b7ea 36%,#009ec3 100%); /* W3C */     
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 ); /* IE6-9 */     
     
     }     
     
     .button:active .bottom {     
     margin: -20px 0 0 10px;     
     }     
     
     .button:active .top {     
     margin: -70px 0 0 10px;     
     }


Az anyag és hozzászólásainak oldala sablonba, ahol a gombot látni szeretnénk:
Kód
<div class="button">    
    <a href="$FILE_URL$">Letöltés</a>    
    <p class="top">$ENTRY_TITLE$</p>    
    <p class="bottom">$FILE_SIZE$</p>    
    </div>


Forrás: uCoz Baze

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 52 | 18:44


CSS-be:
Kód
.letoltogomb {position:relative;width:222px;height:61px;display:inline-block;background:url('http://i.imgur.com/MaMqDyI.png');}
.letoltogomb .overlay {background:#000;opacity:.8;position:absolute;top:0;left:0;right:0; bottom:0;display:none;color:#fff;overflow:hidden;width:222px !important;height:61px !important;border-radius:20px;}
.letoltogomb:hover .overlay {display:inline;}
.letoltogomb span {font-size: 8pt;font-family: Arial;padding-top: 25px;display: block;text-align: center;}


Az anyag és hozzászólásainak oldala sablonba ahova akarjuk:
Kód
<?if($FILE_URL$ or $RFILE_URL$)?><?if($FILE_URL$)?><a href="$FILE_URL$"><?else?><?if($RFILE_URL$)?><a href="$RFILE_URL$"><?endif?><?endif?><div class="letoltogomb">
         <div class="overlay"><span>Méret: <?if($FILE_URL$)?>$FILE_SIZE$<?else?><?if($RFILE_URL$)?><?if($RFILE_SIZE$)?>$RFILE_SIZE$<?endif?><?endif?><?endif?></span></div>
</div></a><?endif?>

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 53 | 21:42
Apchris kérdése:

Az oldal felső részén egymás mellett vannak a közösségi hálózatok gombjai.
Kérdés, hogy ezeket el tudom-e úgy tüntetni, hogy csak a facebook maradjon, illetve hogy a facebook ikon alá hogyan tudom bevarászolni a saját facebook oldalamat?

Az #1101-es számú sablont használom.


A válasz:

A Honlap felső része sablonban van a következő kód, ahol megadhatod, mely közösségi hálózati oldalakra irányítsanak a gombok:

Kód
<div id="soc-box">  
   <a href="http://vk.com/" class="soc-vk" target="_blank"></a>  
   <a href="https://www.facebook.com/" class="soc-fc" target="_blank"></a>  
   <a href="https://vimeo.com/" class="soc-vi" target="_blank"></a>  
   <a href="https://twitter.com/" class="soc-tw" target="_blank"></a>  
   <a href="http://www.flickr.com/" class="soc-fl" target="_blank"></a>   
   </div>


Ha neked csak a Facebook kell, akkor a fent említett kódot cseréld erre:

Kód
<div id="soc-box">  
   <a href="FACEBOOK LINK" class="soc-fc" target="_blank"></a>  
   </div>


Ahol a FACEBOOK LINK szöveget a Facebook oldalad linkjére cserélsz.

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
Dorcsyh99
Üzenetek: 14
Hírnév: 0

Üzenet # 54 | 11:32
Sziasztok!

Egy kis segítséget kérnék! Nem nagyon vagyok otthon MÉG ebben a html, css kódú szereksztésben, úgyhogy egy admin rendzsres segítségét nagyon megköszönném. Főbb problémáim: hogyan kell megváltoztatni a hátteret egy képpé, színek beállításai. Igazsgá szerint, meg tudnám csinálni nagyjűból, csak nem értem hogy hol kell.

Előre is köszi a válaszokat, segítséget,, amit akár pm-ben is küldhettek !

Ancsi
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 55 | 11:41
Dorcsyh99, üdvözlünk! A honlap stílusát a Stílusok táblázata (CSS) sablonban szerkesztheted.

A háttér képpé változtatásához keresd meg a sablonban a
Kód
body { ..... }

elemet, majd azon belül a background vagy background-image tulajdonságot. Itt a kettőspont (:) és a pontosvessző (;) között kell megadnod a következő kódsort (behelyettesítve az alap tartalmat):
Kód
url('KÉPURL')

ahol a KÉPURL szöveget lecseréled a kép teljes URL-címére.

A betűszín megváltoztatásának attribútuma a color. Ezt különböző osztályoknál (.class), standard elemeknél (nav) vagy ID-knál (#id) adhatod meg. Itt a kettőspont (:) és a pontosvessző (;) között kell megadnod egy színkódot:
Kód
#F32F32

vagy alapszínt:
Kód
blue


Persze lehet HTML kódokkal is színt beállítani, ehhez csak a következő kódot kell használni:

Kód
<span style="color: #F32F32;">SZÖVEG</span>


ahol az #F32F32 színkódot a kívánt színre, a SZÖVEG-et pedig a tartalomra, amelyre a színt szeretnéd beállítani.

Ha valami nem érthető, vagy más kérdéseid is lennének, tedd fel azt nyugodtan wink

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
Dorcsyh99
Üzenetek: 14
Hírnév: 0

Üzenet # 56 | 11:54
Bigblog!

Köszönöm, szépen a segítséget!
Úgy tudom, kép beállításánál meg lehet adni a mérteket is. Ezeket milyen kódok és közé kell beszúrni?

Hozzáadva (28.03.2015, 10:54)
---------------------------------------------
Valamint, fejlécnek beírtam a következőt, de nem akarja kicserélni az eredetiről erre:

Idézet
<div id="background-image"url=('http://farkaslegendak.ucoz.hu/flszerk.jpg')></div>
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 57 | 12:00
Dorcsyh99, ezt a pontosvessző után, a következő kódok megadásával valósíthatod meg:
Kód
background-size: 150px 100px;


ahol a 150px értéket lecseréled a kívánt szélességre, a 100px-t pedig a kívánt magasságra. Használhatsz százalékos értékeket is, tehát:
Kód
background-size: 50% 80%;

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 58 | 12:01
Idézet Dorcsyh99 ()
Valamint, fejlécnek beírtam a következőt, de nem akarja kicserélni az eredetiről erre


A helyes kód:

Kód
<div id="background-image: url('http://farkaslegendak.ucoz.hu/flszerk.jpg');></div>

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
Dorcsyh99
Üzenetek: 14
Hírnév: 0

Üzenet # 59 | 12:11
Bigblog,

így sem cserélte ki sad Az alap sablon száma:835, nem lehet, hogy valami kódót még be kell írni mellé?
bigblog
Üzenetek: 1664
Hírnév: 47

Üzenet # 60 | 12:17
Dorcsyh99, bocsi, elírtam valamit biggrin Ez a helyes kód:
Kód
<div style="background-image: url('http://farkaslegendak.ucoz.hu/flszerk.jpg');></div>

Ingyenes erőforrások uCoz-os honlapodra!

uCoz csapattag, 2013. október - 2017. szeptember.
uCoz közösség » Webmester-részleg » A honlap külalakjának testreszabása » Külalak vezérlése
Keresés: