Background automat in mesaje in functie de genul postatorului

Vezi subiectul anterior Vezi subiectul urmator In jos

Tutorial Background automat in mesaje in functie de genul postatorului

Mesaj Scris de Keir la data de Vin 10 Aug - 10:34

Background automat in mesaje in functie de genul postatorului


1. Definiție:


Pentru ca acest tutorial să funcționeze, este necesar ca în mesajele utilizatorilor, câmpul "sex(gen)" sa fie vizibil, nu numai cu ajutorul unui singur text ci și cu o imagine! Vom crea o clasă CSS suplimentară class_fa_postbody_xy(pentru băieți) și fa_postbody_xx(pentru fete) la corpul mesajului, iar cu această nouă clasă, vom fi capabili să personalizăm designul postului, cu ajutorul CSS-ului.


2. Codurile necesare:


Panou de Administrare Module HTML și JAVASCRIPT Administrare coduri Javascript

Creați un nou cod Javascript, iar la amplasare puneți "topicuri".


  • Titlu*: Adaugati titlul dorit
  • Amplasare: Topicuri
  • Cod Javascript*:
    Cod:

        $(function() {
          
           //Indicate here the version of your forum.
           var version = "phpBB3";
          
           if(version.toLowerCase() == "phpbb2"){  
              $(".postdetails img[title='Male']").closest('.postdetails').parent('td').next('td').addClass("fa_postbody_xy");
              $(".postdetails img[title='Female']").closest('.postdetails').parent('td').next('td').addClass("fa_postbody_xx");
           }else if(version.toLowerCase() == "phpbb3"){  
              $(".postprofile img[title='Male']").closest('.postprofile').prev('.postbody').addClass("fa_postbody_xy");
              $(".postprofile img[title='Female']").closest('.postprofile').prev('.postbody').addClass("fa_postbody_xx");  
           }else if(version.toLowerCase() == "punbb"){  
              $(".user-info img[title='Male']").closest('.postmain').addClass("fa_postbody_xy");
              $(".user-info img[title='Female']").closest('.postmain').addClass("fa_postbody_xx");  
           }else if(version.toLowerCase() == "invision"){        
              $(".postprofile img[title='Male']").closest('.post-container').addClass("fa_postbody_xy");
              $(".postprofile img[title='Female']").closest('.post-container').addClass("fa_postbody_xx");
           }
        });



Important! Pentru a face codul sa meargă este absolut necesar să identificați versiunea forumului dvs. și să editați codul de mai sus, specificând numele versiunii care poate fi phpBB2, phpBB3, punBB sau Invision și alegând codul pentru respectiva versiune.

Indicație: Codul fiecărei versiuni are în componeța sa numele versiunii respective, și începe exact cu rândul în care găsiți denumirea ei.


3. Personalizarea foii de stil CSS:


În codul CSS ve-ți găsii două clase personalizate, clase care reprezintă defapt mesajele băieților și mesajele fetelor. Cu ajutorul Javascript-ului, am creat aceste clase, iar acum le putem modifica aspectul cu ajutorul CSS-ului. Totul ține de iamginația voastră.

Panou de Administrare Afișare Imagini și culori Culori Foaie de stil CSS

Cod:

    .fa_postbody_xy{
       background: url("http://i45.servimg.com/u/f45/17/45/19/77/xy10.png");
    min-height: 500px;
    }
    
    .fa_postbody_xx {
       background: url("http://i45.servimg.com/u/f45/17/45/19/77/xx10.png");
    min-height: 500px;
    }


4. Rezultatul tutorialului:




Pentru orice nelămurire legată de acesta nu ezitați să creați un topic în secțiunea de suport spre a rezolva problema respectivă cat mai rapid. Mult succes! Noroc

   
Acest tutorial a fost scris de catre Turbodeif - 06.20.12, de pe  forumul spaniol de suport
Tradus de către Keir

   Copyright ˆ Forumgratuit.ro Nicio 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
Keir
Membru onorific
Membru onorific

masculin

Mesaje : 6769
Varsta : 19
Localizare : Buzau
Data înscrierii : 28/12/2011
Multumiri : 68
Niciun avertisment

http://neotalk.wikiforum.ro/

Sus In jos

Vezi subiectul anterior Vezi subiectul urmator Sus

- Subiecte similare

Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum