Održavanje CSS -a u Prestashopu

Sadržaj
Stranica za održavanje web stranice vrlo je važan aspekt, jer postoje razdoblja u kojima iz različitih razloga (problemi s dobavljačem, ažuriranje izvornog koda, stupanje na snagu novih komercijalnih propisa) u kojima moramo na trenutak obustaviti našu stranicu, međutim vidjeti korisnik i potencijalni klijent mora odražavati svu profesionalnost osobe iza koje stoji.
održavanje.css
Prilikom ulaska u način rada održavanje u našoj internetskoj trgovini Prestashop, naši korisnici će vidjeti sljedeće ako koristimo zadanu temu:

Ovo daleko od toga da je nešto personalizirano, međutim zahvaljujući datoteci maintenance.css možemo je izmijeniti i prilagoditi tako da bude u skladu s našom slikom.
Pogledajmo sadržaj ove datoteke:
 *, body {margin: 0; padding: 0} body {font-family: 90% / 1em 'Lucida Grande', Verdana, sans-serif} #maintenance {width: 450px; margina: 35px auto 0 auto; punjenje: 12px 0; pozadina: #fff; poravnavanje teksta: središte; tekstualna transformacija: nema; font-weight: normal; razmak između slova: 0; boja: # C73178} # poruka {širina: 450px; margin-top: 35px; punjenje: 12px 15px; obrubljeni vrh: 1px točkasto # 666; border-bottom: 1px točkasto # 666; pozadina: # F9E3EE; text-align: justify; font: 90% / 1em 'Lucida Grande', Verdana, bez serifa; tekstualna transformacija: nema; font-weight: normal; razmak između slova: 0; boja: # C73178} # poruka img {padding: 30px} 

Prilikom ocjenjivanja koda shvaćamo da imamo 3 velika birača, koji daju strukturu našoj stranici za održavanje, pogledajmo sada sljedeću sliku kako bismo mogli vizualno locirati svaki birač:

Uočavamo da je selektor #održavanje je opći spremnik unutar kojeg imamo #poruka img koji regulira sliku poruke i tada imamo #poruka koji je tekst s porukom koju želimo prikazati.
maintenace.tpl
Datoteke CSS od Prestashop kontrolne datoteke .tpl što su predlošci Pametno, uporaba predložaka poboljšava i olakšava rad, za to moramo znati predložak održavanje.tpl Pogledajmo kod koji ga razumije:
 {$ meta_title | escape: 'htmlall': 'UTF-8'} {if isset ($ meta_description)} {/ if} {if isset ($ meta_keywords)} {/ if}

{l s = 'U ***** radi održavanja web mjesta, naša internetska trgovina privremeno je isključena. Ispričavamo se na neugodnostima i molimo vas da pokušate kasnije kasnije! '}


Kao što vidimo svaki od selektora CSS prisutna je u ovoj datoteci pa će svaka promjena koju napravimo imati utjecaj na ovaj odjeljak.
Na primjer u odjeljku poruka:

{l s = 'U ***** radi održavanja web mjesta, naša internetska trgovina privremeno je isključena. Ispričavamo se na neugodnostima i molimo vas da pokušate kasnije kasnije! '}


Možemo ga promijeniti u sljedeće:

{l s = 'Ova se stranica održava. Molimo kontaktirajte sljedeću ABC Store Online Limited 33 W. 111 Street, New York, NY 10001, USA Telefon: (212) 210-2100 '}


Tada možemo izmijeniti CSS sa sljedećim:
 #održavanje {širina: 750px; margina: 35px auto 0 auto; punjenje: 12px 0; pozadina: #fefefe; poravnavanje teksta: središte; tekstualna transformacija: nema; font-weight: bold; razmak između slova: 0; boja: # 3FCA66} # poruka {širina: 450px; margin-top: 35px; punjenje: 12px 15px; obrubljeni vrh: 1px točkasto # 666; border-bottom: 1px točkasto # 666; pozadina: # 2EE6F3; text-align: justify; font: 90% / 1em 'Lucida Grande', Verdana, bez serifa; tekstualna transformacija: nema; font-weight: normal; razmak između slova: 0; boja: # 000} # poruka img {padding: 10px} 

Ovim malim promjenama koje označavamo podebljano, dodane promjenama napravljenim u .tpl predlošku, možemo postići nešto slično sljedećoj slici:

Kako vidimo, ovaj moćni alat zajedno s našom kreativnošću pomaže nam postići vrlo zanimljive rezultate.
Ovime završavamo vodič i stječemo znanje o tome kako izmijeniti stranicu za održavanje i s kojim će naši klijenti znati da će naša kvaliteta biti ista kada nismo u eteru.Je li vam se svidio i pomogao ovaj vodič?Autor možete nagraditi pritiskom na ovaj gumb kako biste mu dali pozitivan bod

Vi ćete pomoći u razvoju web stranice, dijeljenje stranicu sa svojim prijateljima

wave wave wave wave wave