În acest tutorial, vom explora conceptul de layouts în OpenCart. Vom începe prin a explora aspectele de bază disponibile în OpenCart și, pe măsură ce vom continua, vom examina modul în care puteți crea noi layout-uri. Mai mult, vom vedea asocierea de machete cu produse, categorii și module.
Presupun că utilizați cea mai recentă versiune a OpenCart 2.0. Desigur, layout-urile sunt disponibile și în versiunile anterioare ale OpenCart, dar vom rămâne la ultima versiune deoarece interfața nu este exact aceeași cu cea a versiunilor OpenCart 1.x.
"Layouts" în OpenCart reprezintă conceptul de organizare și furnizare a șabloanelor pentru diferite tipuri de pagini din front - end. Ce înseamnă atunci când spui un alt "tip" de pagină? Dacă vă uitați la diferitele pagini din OpenCart, veți observa că structura "layout" nu este aceeași în fiecare pagină. De exemplu, aspectul paginii "listingul de produse" nu este același cu cel al paginii "detalii produs".
În plus, structura este variată în diferite pagini, cum ar fi "Pagini de cont", "Pagină de contact", "Pagină de verificare" etc. Deci aici este locul în care imaginea intră. Puteți spune că machetele sunt șabloanele decorator care pregătesc pagina completă prin completarea sloturilor și modulelor disponibile pentru acel aspect.
Pe de altă parte, layouts sunt, de asemenea, utile în OpenCart pentru a atribui diferite module paginii. De exemplu, dacă doriți să afișați un modul "Banner" pe pagina cu detaliile produsului, puteți face acest lucru din back-end, deoarece aspectul "detalii produs" este deja disponibil în miez. OpenCart vă permite, de asemenea, să creați noi layout-uri din back-end, astfel încât să puteți suprascrie layout-urile implicite atribuite diferitelor pagini ale front-end-ului.
Să aruncăm o privire la layout-urile încorporate disponibile în OpenCart. Mergeți pe spatele programului OpenCart. În navigare, mergeți la Sistem> Design> Layouts, care va lista machetele de bază.
După cum puteți vedea, există o listă destul de mare de planuri deja existente. Faceți clic pe Editați | × pictograma Acasă layout, după cum se arată în captura de ecran de mai sus, pentru a configura setările legate de aspect.
Să înțelegem exact ce reprezintă fiecare secțiune a configurației.
Este doar numele layout-ului. Ar trebui să fie stabilit la ceva sensibil, deoarece ne va ajuta mai târziu în timpul alocării modulului.
Lucrul important aici este valoarea coloanei "Route", care sugerează OpenCart că ori de câte ori există o adresă URL care conține "common / home" în pagina front-end, ar trebui să activați această setare referitoare la aspect. Aceasta înseamnă că va activa toate modulele atribuite acestui aspect în timpul solicitării paginii de pornire din partea frontală.
În această secțiune, puteți vedea că modulele sunt deja configurate pentru a fi afișate pe pagina de pornire. Există trei module atribuite poziției "Top Content", deși puteți adăuga mai multe module pentru a le afișa în diferite poziții pe pagina de pornire. De exemplu, puteți adăuga un modul "Banner" în poziția "Conținut de fund".
În același mod, puteți configura și setările pentru celelalte layout-uri. OpenCart oferă o interfață foarte utilă pentru a aloca module la diferite poziții ale layout-ului.
În următoarele câteva secțiuni, vom vedea cum puteți crea un nou aspect și puteți folosi acel aspect pentru a suprascrie layout-urile de bază ale OpenCart.
Mergeți la Sistem> Design> Layouts pagină. Faceți clic pe + semn pentru a adăuga noul aspect. Completați informațiile solicitate așa cum se arată în următoarea imagine de ecran și salvați-o.
Am introdus "Layout personalizat de produs" ca nume de aspect. De asemenea, am atribuit modulul "Banner> Category" la poziția "Column Right". Aceasta înseamnă că ori de câte ori aspectul nostru este activat pentru orice solicitare din front-end, acesta va afișa modulul "Banner" pe bara laterală dreaptă.
Există două moduri de a activa aspectul pentru orice solicitare de tip front-end. Am discutat deja primul, atribuirea "Rută" în setările de configurare a aspectului. Celălalt este opțiunea "suprascriere" disponibilă pentru anumite pagini din front-end. Vom continua cu a doua opțiune pentru cursul acestui tutorial.
Acum, că am creat aspectul personalizat, hai să mergem mai departe și să verificăm cum puteți folosi funcția de suprapunere a aspectului în OpenCart. Voi folosi exemplul produselor implicite disponibile în OpenCart pentru a ușura lucrurile.
Mergi la Catalog> Produse, care va lista toate produsele disponibile în magazin. Să editați produsul "iMac" sub categoria "Desktops> Mac".
În interfața de editare a produsului, mergeți la Proiecta fila, unde ar trebui să vedeți Layout Override pentru magazinul implicit. Selectați CustomLayout în caseta verticală și salvați produsul.
Ați depășit aspectul standard al produsului "iMac" cu aspectul "CustomLayout"! Aceasta înseamnă că ori de câte ori cineva vizitează pagina detaliată a produsului "iMac" în partea frontală, "CustomLayout" va fi activată pentru acea pagină. Și așa cum am discutat în secțiunea anterioară, va afișa modulul "Banner" în poziția "Column Right". Să o testați în partea frontală!
În același mod, puteți înlocui planșele și pentru categorii!
Deci, sper că ar trebui să aveți o înțelegere de bază a modului în care funcționează planurile în OpenCart. Amenajările sunt foarte utile pentru a suprascrie layout-urile implicite și a atribui module pentru diferite poziții în OpenCart. Împărtășiți-vă gândurile sub formă de comentarii și interogări folosind feed-ul de mai jos!