1) Instrucțiunea este destinată începătorilor - celor care tocmai au început să-l stăpânească pe Jumla.
2) Este scris pentru Joomla 1.0 (de când am lucrat numai cu ea și cât de mult diferite 1.5 - nu știu)
3) se presupune că cel puțin în termeni generali imaginați ce este CSS (foi de stil cascadă) și știți cum să le utilizați pe paginile HTML obișnuite.
În toate modulele Jumla - atât preinstalate, cât și adăugate, există o opțiune "Suită de clasă CSS". Acesta vă permite să specificați un stil individual pentru un modul sau un articol.
A trebuit să schimb ceva din cauza tipurilor de liste din module - prea multă schimbare din stânga le-a făcut urâte.
De ce sufixul? La urma urmei, dacă scriem CSS pentru un site obișnuit, atunci am face o nouă clasă. În esență, facem acest lucru adăugând un sufix - creăm o nouă clasă cu un nume nou. Diferența față de site-ul HTML obișnuit - că în textele afișate pe ecran această clasă nu este prescrisă de noi, ci de programul lui Jumla. Și acest program este atât de scris încât noua clasă ar trebui să fie numită nu numai oribilă, ci ca cea veche - dar cu adăugarea unui text la sfârșitul numelui ei.
Numele clasei vechi, i. Clasa implicită pentru toate modulele Jumla este table.moduletable. Aceasta este clasa care definește forma tabelului modulului în sine. Și există intrări separate în fișierul CSS pentru antetul său - table.moduletable th și pentru celula de tabel din interiorul modulului - table.moduletable td.
Aici, pe baza acestora, trebuie să creăm propriul stil individual pentru modul.
Deci, ce să fac?
Toate modificările sunt mai convenabile pentru a face și a testa copia locală a site-ului din Denver. Asigurați-vă că corectați fișierul CSS dorit - adică că se află în dosarul șablonului local.
Pasul 1. Mergeți la zona admin - modulele site-ului, deschideți modulul necesar pentru editare. Adăugăm orice sufix - este mai convenabil când începe cu un indiciu sau cu o cratimă, pentru a nu fi confuz. În exemplul nostru, am adăugat _mylist.
Apoi, anulați cache-ul sau setați ora cache-ului la 0 - această acțiune este necesară pentru setarea stilului, altfel veți vedea modulul memorat în cache, și nu rezultatul modificărilor efectuate.
Ne uităm la site. Nimic nu sa schimbat? Și de ce s-ar schimba, dacă nu am făcut cel mai important lucru - nu a adăugat o nouă clasă în foaia de stil șablon CSS.
Pasul 2. Mergeți la directorul dosarelor Jumla și găsiți fișierul de stil. TEMPLATES - TEMPLATE - CSS - template_css.css.
Primul lucru de făcut înainte de toate modificările (acest lucru este valabil nu numai CSS, dar, de asemenea, modificări în orice fișier, cum ar fi șablon index.php) - să păstreze o copie a fișierului sub un alt nume, de exemplu template_css.txt. Acum, dacă se întâmplă ceva dintr-o dată rău, puteți întotdeauna să reveniți la starea anterioară.
Un alt mod mai radical pentru a acoperi este să faceți o copie de siguranță a întregului site pe server înainte de a începe să schimbați ceva.
Mai întâi trebuie să găsiți în el locul în care este definit stilul modulelor.
Se pare ca aceasta (dau un exemplu din șablonul meu, în altele proprietățile vor fi diferite, dar antetul este același selector, de exemplu table.moduletable.
Copiați cu grijă toată această piesă și o lipiți din nou direct sub ea (în principiu, puteți să vă aflați în orice loc din fișier, dar este mai convenabil - când totul se referă la module într-un singur loc).
De ce copiați? Dar după ce toată clasa veche este pur și simplu. Modulabilă fără sufixe - și tu trebuie să rămâi! Cu toate acestea, dacă doriți să modificați aspectul tuturor modulelor site-ului - trebuie să modificați proprietățile acestei clase și să nu porniți unul nou.
În plus față de fiecare selector - pentru modulul propriu, antetul și celula acestuia, adăugăm propriul nostru sufix - exact același pe cel pe care îl puneți în setările modulului din panoul de administrare. În exemplul nostru, acesta va fi _mylist (o dată în setările pe care le pun în jos cu un indiciu, eu fac același lucru aici) - vedeți exemplul de mai jos.
Toate - am creat o nouă clasă! Acum ne-am arunca o privire asupra dorinței noastre și îi schimbăm proprietățile în conformitate cu un concept profund de design.
Dar proprietățile inutile pot fi eliminate sau înlocuite. Și, de asemenea, adăugați orice altele noi - pentru etichetele din interiorul modulului, de exemplu, a sau ul și li
Codul stilului dvs. pentru tabele cu _mylistul sufixului
Exemplul arată că, într-o clasă nouă, nu numai că poți schimba descrierea acelor proprietăți ale modulelor care au fost setate în stilul original, dar și să adaugi noi reguli - de exemplu, pentru lista ul din interiorul modulului.
Pasul 4, ultimul. Asigurându-vă că totul arată așa cum trebuie, verificați vizualizarea în diferite browsere (acestea sunt, desigur, aveți - cel puțin, IE, FireFox și Opera) de pe serverul local, dacă este necesar, repara ceva.
Copiați fișierul de stil modificat pe server în dosarul șablonului dvs. (de unde am primit-o). Verificați. Nu funcționează? Și nu ați uitat să adăugați sufixul la modulele necesare prin intermediul site-ului admin pe site?
De asemenea, nu vă strica să dezactivați modulul cache pentru timpul de testare (dar apoi nu uitați să-l activați din nou).
Apropo, după antrenamentul de a crea module cu propriile sufixe și de a le schimba aspectul, puteți încorpora tipurile standard de module specificate în șablonul dvs. - adică pe clasa itself table.moduletable, schimbând proprietățile după gustul tău.
Trimiteți-le prietenilor: