Adaugarea unei iconite sau culoare unui simplu utilizator

Vezi subiectul anterior Vezi subiectul urmator In jos

Tutorial Adaugarea unei iconite sau culoare unui simplu utilizator

Mesaj Scris de Cassius Dio la data de Dum 27 Ian - 12:00

Adaugarea unei iconite sau culoare unui simplu utilizator


Definitie:

Cu acest tutorial putem aplica o culoare si/sau o iconita pentru unul sau mai multi utilizatori fara a fi nevoiti sa cream grupuri speciale.
In continuare va trebui sa urmati doar una dintre variantele de mai jos, care vi se pare mai accesibila.

Exclamare Functioneaza pe orice versiune.

Varianta 1: Codul JavaScript:

Panoul de administrare Module HTML & JavaScript Gestiunea codurilor JavaScript Creati un nou cod JavaScript.

Amplasare: Toate paginile.

Cod JavaScript *:
- pentru iconita:
Cod:
jQuery(document).ready(function(){
    jQuery("a:contains('Utilizator 1')").append(jQuery('<img src="Link catre imagine">'));
    jQuery("a:contains('Utilizator 2')").append(jQuery('<img src="Link catre imagine">'));
});
- pentru culoare:
Cod:
jQuery(document).ready(function(){
    jQuery("a:contains('Utilizator 1')").css('color','Cod culoare');
    jQuery("a:contains('Utilizator 2')").css('color','Cod culoare');
});

Inlocuim dintre ghilimele Utilizator 1 si Utilizator 2 cu numele utilizatorilor carora dorim sa le adaugam culoare sau iconita; Link catre imagine cu link-ul catre iconita; iar Cod culoare cu o culoare valida.

Desigur ca putem sa aplicam efectele pentru mai multi utilizatori sau sa stergem culorile sau iconitele pentru acestia, editand codul de mai sus. sunny

Daca un membru face deja parte dintr-un anumit grup, inlocuim acest fragment de cod:
Cod:
jQuery("a:contains('Nick1')").append(jQuery('<img src="LINK-IMAGINE">'));
cu cel ce urmeaza:
Cod:
jQuery("a span:contains('Nick1')").append(jQuery('<img src="LINK-IMAGINE">'));

Varianta 2: Modificarea Foii de stil CSS:

Panou de administrare Afisare Imagini si culori Culori Foaie de stil CSS.

Adaugam urmatorul cod:
Cod:
a[href="/LINK-UTILIZATOR"] {
    color: Cod culoare;
    padding-right: 21px;
    background: transparent url('Link catre imagine') no-repeat center right;
    text-shadow: 0px 0px 4px #B7A0E5;
}

a[href="/LINK-UTILIZATOR"] {
    color: Cod culoare;
    padding-right: 21px;
    background: transparent url('Link catre imagine') no-repeat center right;
    text-shadow: 0px 0px 4px #DDA0DD;
}

In caz ca dorim sa facem acest lucru pentru mai multi utilizatori, trebuie doar sa adaugam aceast fragment de cod din nou:
Cod:
a[href="/LINK-UTILIZATOR"] {
    color: Cod culoare;
    padding-right: 21px;
    background: transparent url('Link catre imagine') no-repeat center right;
    text-shadow: 0px 0px 4px #B7A0E5;
}
In loc de LINK-UTILIZATOR, adaugam link catre profilul utilizatorului carui dorim sa-i adaugam o iconita sau o culoare; in loc de Cod culoare - o culoare valida; iar in loc de Link catre imagine - link catre iconita.

Previzualizare
Daca ati aplicat corect pasii din varianta aleasa mai sus, veti obtine:





Felicitari! Noroc

Daca aveti intrebari nu ezitati sa apelati la categoria de suport.

Tutorial scris de Dana Domirani, tradus de Bourne.

Copyright ˆ Forumgratuit.ro Nici o parte a acestui tutorial nu poate fi reprodusa, transmisa sau stocata in orice forma fara acordul scris al detinatorului dreptului de autor, in conformitate cu articolul L122-1 apartinand ICC.
avatar
Cassius Dio
Membru onorific
Membru onorific

masculin

Mesaje : 11025
Varsta : 19
Localizare : Strawberry Fields
Data înscrierii : 13/07/2012
Multumiri : 82
Niciun avertisment

http://beatles.forummo.com/

Sus In jos

Vezi subiectul anterior Vezi subiectul urmator Sus

- Subiecte similare

Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum