2018. 05. 12.Videó | Kép élénkítése Photoshop-ban
2018. 05. 05.ColorCop színlopó program
2018. 04. 30.Coppermine | Kép és fájlméret megadása az indexképek alatt
2018. 04. 24.Coppermine | Thumbnails képek méretének változtatása egyszerűen
2018. 04. 18.Videó | PNG készítése Photoshop-ban
Coppermine Gallery themes

Coppermine Gallery themes
316 napja
721 néző

WordPress themes

WordPress themes
317 napja
206 néző

G-Portál themes

G-Portál themes
317 napja
117 néző

Tumblr themes

Tumblr themes
317 napja
169 néző

Oldalsávban eltérő modulszínek

Még jó múltkorában írtam meg az egyedi BlogPlusz kinézetéről szóló cikket és kódot, ahol azt is említettem, hogy azzal a technikával akár a G-Portálon minden egyes modul más-más színű és kinézetű lehet. Leírást még nem hoztam eddig róla, így ma leírom, hogyan tudjátok megcsinálni, hogy pl. a szélső modulban minden második modul más-más színű. Akár az összes modul lehet eltérő színű, de én most csak kettesével váltogattam a színeket. Így néznek ki nekem most a szélső modulok:

 

 

Minden egyes modulhoz tartozik egy ID számsor, amiről itt is írtam már. Nekünk most azok a számsorok kellenek. Alapértelmezetten nálam a CSS kódban a bézs szín van beállítva a szélső moduloknak, de én azt szerettem volna, hogy minden második modul kék legyen. Ezt úgy lehet megcsinálni, hogy kijelölitek a kiválasztott modulban a modulcímet, majd jobb egérgombbal rá kell kattintani.

 

 

 

  • Ha Mozilla Firefoxban dolgoztok, akkor jobb egérgomb után az elem vizsgálata opciót kell választani
  • Google Chrome-ban pedig simán csak vizsgálat a neve.

 

Azt keressétek meg, ahol a modulcímetek neve alatt kiadja az id=”module_ocimg_36918865″ részt. Innen kell nekünk csak a számsor, amit a CSS kódba fogunk bemásolni.

 

 

A CSS kód pedig így néz ki
Az egyenlőségjel után az én számsorom helyére kell másolni a ti számsorotokat. Ez mindenkinek más.

 

table[module_id*="36918941"]
.modtitle { /* kiválasztott modulcím kinézete */
background: #637AAB !important;
color: #ffffff !important;
}
table[module_id*="36918941"]
.modbody { /* kiválasztott tartalmi rész kinézete */
background: #D2D9E6 !important;
color: #8093BB !important;

 

Elvileg elég csak a háttérszínt és a betűszínt módosítani, mert az alap szélső modul kódban minden más meg van adva. Az !important szócska kötelező!

 

Ez az alap kód ugye itt lent, és ezen felül készítettük el azt, ami csak bizonyos modulokra hat. Így amin nem szeretnétek változtatni, azt nem kell beleírni a számsoros CSS kódba.

 

.column_side_td .module .modtitle {
background: #B5AB77;
font-family: Century Gothic;
text-align: left;
font-size: 14px;
color: #ffffff;
letter-spacing: 1px;
text-transform: uppercase;
font-style: normal;
font-weight: normal;
padding: 10px;
}
.column_side_td .module .modbody {
background: #F1EFE4;
font-family: Arial;
font-size: 13px !important;
color: #B5AB77;
line-height: 20px;
letter-spacing: 0px;
text-align: justify;
text-shadow: 1px 1px 1px #ffffff;
padding: 10px;
}

 

A teljes téma innen tölthető le: megnézemletöltöm


845 megtekintés

Hozzászólások