Cikkajánló
A változatosság kedvéért hoztam egy újabb Photoshop fejlécet. Úgy szeretem ezt a színésznőt, így gondoltam készítek vele egy fejlécet. Lehet a hétvégén készítek hozzá egy G-Portálos témát is, mert
Eddig nem igazán volt nyilvános, hogy készítek rendelésre design-t, de mivel mostanában elég sokat rendeltetek, így nyilvánossá is teszem. Szóval lehet rendelni design-t. Az oldalsávban el is készült a
Először is mindenkinek nagyon boldog új évet kívánok :), mivel idén még nem tudtam frisst hozni :( Sok rendelés jött össze és azokat kellett megcsinálnom. Még van pár rendelés,
Sosugary Gallery | Jennifer Lawrence téma Szövegdoboz | Kattintásra kijelöli és másolja a szöveget Ingyenes téma | Coppermine Gallery free theme Prémium téma | Sophie Turner WordPress theme WordPress | Letöltés számláló
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

lindadesign Hozzászólások
696 megtekintés

Hozzászólások