Personalizarea legendei grupurilor: efect sclipire, icon si stralucire

Vezi subiectul anterior Vezi subiectul urmator In jos

Tutorial Personalizarea legendei grupurilor: efect sclipire, icon si stralucire

Mesaj Scris de Cosmin. la data de Dum 29 Apr - 22:29

Personalizarea legendei grupurilor: efect sclipire,
icon si stralucire

Disponibil pentru toate versiunile de forum !
Doriti sa va personalizati legenda grupurilor? Ei bine, tutorialul acesta va ofera 3 moduri diferite de a o personaliza!

Pasul #1 - link-ul grupului
Ca prim pas in tutorialul nostru, intram pe pagina grupului dorit sa fie personalizat (de exemplu http://help.forumgratuit.ro/g13-administratori ), si din bara de adrese, copiem doar terminatia link-ului, in acest exemplu /g13-administratori


Pasul #2 - personalizarea
Navigam in foaia de stil CSS...
Panou de administrare Afisare Imagini si culori Culori Foaie de stil CSS
.... si adaugam codul efectului dorit, completand cu terminatia link-ului obtinuta de mai sus:
Efectul #1 - sclipire
Exemplu:
Legenda : [Administratori]
Cod CSS:
Cod:
a[href="TERMINATIE LINK GRUP"] {
    background: url("http://i45.servimg.com/u/f45/15/95/60/34/glitte10.gif");
}
Puteti inlocui imaginea aceasta http://i45.servimg.com/u/f45/15/95/60/34/glitte10.gif cu orice alta imagine .gif (animata) cu diferite efecte de sclipire.

Efectul #2 - icon in dreptul grupului
Exemplu:
Legenda : [Administratori]
Cod CSS:
Cod:
a[href="TERMINATIE LINK GRUP"] {
    background: url("http://illiweb.com/fa/admin/couronne.png") no-repeat;
    padding-left: 19px;
    padding-top: 2px;
}
Puteti inlocui imaginea aceasta http://illiweb.com/fa/admin/couronne.png cu orice mini-icon de maxim 18x18px.

Efectul #3 - stralucire
Exemplu:
Legenda : [Administratori]
Daca nu aveti experienta in CSS, si nu stiti cum sa creati o umbra, puteti folosi generatorul de aici: http://www.css3maker.com/text-shadow.html
Acesta va va furniza un cod (in coloana dreapta, sus) de genul acesta:
Cod:
text-shadow:0px 2px 13px #f5a911;
Dumneavoastra o sa trebuiasca doar sa adaugati codul generat intre acolade:
Cod CSS:
Cod:
a[href="TERMINATIE LINK GRUP"] {
    AICI TRECETI CODUL LUAT DIN GENERATOR
}
Exemplu:

Cod:
a[href="TERMINATIE LINK GRUP"] {
    text-shadow:0px 2px 13px #f5a911;
}

ATENTIE:


Succes!  Noroc

Tutorial realizat de Nera.,
Tradus din limba engleza de Cosmin.
Ultima actualizare: 27.01.2013~Ina

Reproducerea acestui tutorial nu este posibila fara acordul nostru, in conformitate cu articolul L122-1 apartinand ICC.
Forumurile ce vor copia sau reproduce aceste tutoriale vor fi sterse fara preaviz!
avatar
Cosmin.
Vizitator


Sus In jos

Vezi subiectul anterior Vezi subiectul urmator Sus

- Subiecte similare

Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum