Bine a-ti venit pe fraNNNta-Design


Imagine de fundal pentru mesajele staf..
Braga Catalin OnlineOffline
Rank: Membru
Braga Catalin
Respect : 100%
Mesaje : 585
Inscris : 18/12/2012
Acest tutorial vă prezintă cum puteţi adăuga o imagine de fundal pentru mesajele staff-ului, pentru un grup anume, exact cum este aici, pe forumul de suport.

Pentru început, trebuie să edităm fiecare rang şi să îl ajustăm pentru a fi recunoscut în cadrul codului şi pentru ca imaginea să se seteze automat la întâlnirea acestuia:

Panou de administrare Imagine de fundal pentru mesajele staf.. Arrow10Utilizatori si grupuri Imagine de fundal pentru mesajele staf.. Arrow10Ranguri Imagine de fundal pentru mesajele staf.. Arrow10Administrarea rangurilor

Facem click pe butonul Imagine de fundal pentru mesajele staf.. 1625916392 sau "Adauga un nou rang".
In rubrica "Titlul rangului:" inseram acest cod:

Cod:
<span class="Administrator">Administrator</span>

Imagine de fundal pentru mesajele staf.. 09615175912Dvs. puteti modifica numele clasei , din "Administrator" in "Moderator" s.a.m.d, iar apoi, desigur va trebui sa faceti modificarile de rigoare in codurile din cadrul acestui tutorial, inlocuind vechile clase cu cele noi.

Imagine de fundal pentru mesajele staf.. 09615175912Pentru a asocia imaginea unui grup complet trebuie sa va asigurati ca rang-ul este setat tuturor membrilor din el.

Dupa acestea, vom insera un cod Javascript pentru afisarea imaginii de fundal. Urmati pasii de mai jos pentru a ajunge in zona unde vom efectua aceste modificari:

Panou de AdministrareImagine de fundal pentru mesajele staf.. Arrow10 Module Imagine de fundal pentru mesajele staf.. Arrow10HTML si JAVASCRIPT Imagine de fundal pentru mesajele staf.. Arrow10Gestiunea codurilor Javascript

Imagine de fundal pentru mesajele staf.. 09615175912Inainte de a crea un nou cod Javascript, tebuie sa ne asiguram ca optiunea "Activeaza gestiunea codurilor JavaScript :" este setata pe "Da".

In final, facem click pe butonul Imagine de fundal pentru mesajele staf.. 1311314484 " Creati un nou cod Javascript"
In zona "Titlu", puteti pune spre exemplu "Imagine post-uri Administratori".
La zona "Amplasare :" setam pe "Topicuri".
In cele din urma, la "Cod JavaScript", adaugam urmatorul cod:
Cod:
    $(function() {
        $('.Administrator').parent().parent().parent().addClass('ImagineAdministrator');
        });

Apasam pe "Valideaza".

Imagine de fundal pentru mesajele staf.. 09615175912Puteti adauga mai multe linii in codul Javascript, astfel sa faceti efectul si pentru alte rang-uri/grupe, spre exemplu:

Cod:
$(function() {
        $('.Administrator').parent().parent().parent().addClass('ImagineAdministrator');
        $('.Moderator').parent().parent().parent().addClass('ImagineModerator');
        $('.Designer').parent().parent().parent().addClass('ImagineDesigner');
        });

Am ajuns si la ultima etapa, adaugarea codului CSS pentru afisarea imaginii de fundal.
Mergem catre:
Panou de Administrare Imagine de fundal pentru mesajele staf.. Arrow10 Afisare Imagine de fundal pentru mesajele staf.. Arrow10 Imagini si culori Imagine de fundal pentru mesajele staf.. Arrow10 Culori Imagine de fundal pentru mesajele staf.. Arrow10 Foaie de stil CSS

Adaugam acest cod in casuta cea mare:
Cod:
  .ImagineAdministrator td.row1 {
        background-image: url('Lien du dégradé') !important;
        background-position: bottom;
        background-repeat: repeat-x;
        }
        .ImagineAdministrator td.row2 {
        background-image: url('Lien du dégradé') !important;
        background-position: bottom;
        background-repeat: repeat-x;
        }

Imagine de fundal pentru mesajele staf.. 09615175912Daca ati modificat codul Javascript, punand-ul pe cel cu mai multe linii, acum, in loc de acest cod CSS, veti avea:

Cod:
 .ImagineAdministrator td.row1 {
        background-image: url('Lien du dégradé 1') !important;
        background-position: bottom;
        background-repeat: repeat-x;
        }
        .ImagineAdministrator td.row2 {
        background-image: url('Lien du dégradé 1') !important;
        background-position: bottom;
        background-repeat: repeat-x;
        }
       
        .ImagineModerator td.row1 {
        background-image: url('Lien du dégradé 2') !important;
        background-position: bottom;
        background-repeat: repeat-x;
        }
        .ImagineModerator td.row2 {
        background-image: url('Lien du dégradé 2') !important;
        background-position: bottom;
        background-repeat: repeat-x;
        }
       
        .ImagineDesigner td.row1 {
        background-image: url('Lien du dégradé 3') !important;
        background-position: bottom;
        background-repeat: repeat-x;
        }
        .ImagineDesigner td.row2 {
        background-image: url('Lien du dégradé 3') !important;
        background-position: bottom;
        background-repeat: repeat-x;
        }

In cod, zona "bottom right" indica faptul ca situarea codului va fi in partea dreapta jos, adica in coltul postarii.
Inlocuiti "imaginea de fundal" cu url-ul imaginii voastre, care doriti sa se afiseze. Imaginea trebuie sa aiba marimea de 1428*461 pixelis pentru a se afisa corect.
Daca doriti sa modificati numele clasei din CSS, o puteti face, modificand aceasta zona din codul Javascript:
Cod:
.addClass('ImagineAdministrator');

Imagine de fundal pentru mesajele staf.. 09615175912Forumgratuit va pune la dispozitie o gama variata de imagini pentru mesajele staff-ului, disponibile aici.

Sursa: ForumGratuit.Ro
Tutorial scris de Keir.


Cu stima, Braga Catalin ~> fraNNNta - Design


Re: Imagine de fundal pentru mesajele staf..
just.m1ky OnlineOffline
Rank: Membru
just.m1ky
Respect : 100%
Mesaje : 934
Inscris : 01/09/2012
Frumos ;) .


Re: Imagine de fundal pentru mesajele staf..
mr.franta OnlineOffline
Rank: fondator
mr.franta
Respect : 100%
Mesaje : 4059
Inscris : 18/06/2011
un tutorial reusit de al lui keir :) multumesc ca l-ai postat


Re: Imagine de fundal pentru mesajele staf..
Braga Catalin OnlineOffline
Rank: Membru
Braga Catalin
Respect : 100%
Mesaje : 585
Inscris : 18/12/2012
Va multumesc mult 3my si franta..


Autorul acestui mesaj a fost eliminat din forum. - Afisati mesajul
Re: Imagine de fundal pentru mesajele staf..
Jimmi OnlineOffline
Rank: Membru
Jimmi
Respect : 100%
Mesaje : 119
Inscris : 30/12/2013
merge multumesc mult


Re: Imagine de fundal pentru mesajele staf..
Continut sponsorizat OnlineOffline



    Design creat si realizat de fraNNNta-Design.com
    Acum este: Lun Mai 25, 2020 2:30 am