✅ Vedligeholdelse CSS i Prestashop

Indholdsfortegnelse

Vedligeholdelsessiden for et websted er et meget vigtigt aspekt, da der af forskellige årsager (leverandørproblemer, opdatering af kildekode, ikrafttrædelse af nye kommercielle forskrifter) af forskellige årsager, hvor vi midlertidigt skal suspendere vores side, hvad bruger og potentiel klient se skal afspejle al professionalisme hos personen bag.
vedligeholdelse.css
Når du går ind i tilstanden vedligeholdelse i vores online butik Prestashop, vil vores brugere se følgende, hvis vi bruger standardtemaet:

Dette er langt fra noget personlig, men takket være filen maintenance.css kan vi ændre og tilpasse den, så den overholder vores image.
Lad os se indholdet af denne fil:

 *, body {margin: 0; polstring: 0} body {font-family: 90% / 1em 'Lucida Grande', Verdana, sans-serif} #maintenance {width: 450px; margen: 35px auto 0 auto; polstring: 12px 0; baggrund: #fff; tekstjustering: center; tekst-transform: ingen; font-vægt: normal; bogstavafstand: 0; farve: # C73178} #message {bredde: 450px; margin-top: 35px; polstring: 12px 15px; border-top: 1px prikket # 666; kant-bund: 1px prikket # 666; baggrund: # F9E3EE; tekstjustering: begrunde; skrifttype: 90% / 1em 'Lucida Grande', Verdana, sans-serif; tekst-transform: ingen; font-vægt: normal; bogstavafstand: 0; farve: # C73178} #message img {polstring: 30px}

Når vi evaluerer koden, indser vi, at vi har 3 store vælgere, som er dem, der giver strukturen til vores vedligeholdelsesside, lad os nu se følgende billede for visuelt at kunne lokalisere hver vælger:

Vi bemærker, at vælgeren #vedligeholdelse er den generelle beholder, inden for hvilken vi har #message img der regulerer billedet af budskabet, og så har vi det #besked som er teksten med beskeden, som vi vil vise.
vedligeholdelse.tpl
Filerne CSS af Prestashop kontrol filer .tpl hvad er skabeloner Smarty, brugen af skabeloner forbedrer og letter arbejdet, for dette skal vi kende skabelonen vedligeholdelse.tpl Lad os se koden, der forstår det:

 {$ meta_title | escape: 'htmlall': 'UTF-8'} {if isset ($ meta_description)} {/ if} {if isset ($ meta_keywords)} {/ if}


{l s = 'I ***** for at udføre vedligeholdelse af webstedet er vores onlineshop midlertidigt blevet taget offline. Vi beklager ulejligheden og beder dig om at prøve igen senere! '}

Som vi ser hver af vælgerne af CSS det er til stede i denne fil, så hver ændring vi foretager vil have en effekt på dette afsnit.
For eksempel i meddelelsesafsnittet:

{l s = 'I ***** for at udføre vedligeholdelse af webstedet er vores onlineshop midlertidigt blevet taget offline. Vi beklager ulejligheden og beder dig om at prøve igen senere! '}

Vi kan ændre det til følgende:

{l s = 'Dette websted er under vedligeholdelse. Kontakt venligst følgende ABC Store Online Limited 33 W. 111 Street, New York, NY 10001, USA Telefon: (212) 210-2100 '}

Derefter kan vi ændre CSS med følgende:

 #maintenance {bredde: 750px; margen: 35px auto 0 auto; polstring: 12px 0; baggrund: #fefefe; tekstjustering: center; tekst-transform: ingen; skrifttype-vægt: fed; bogstavafstand: 0; farve: # 3FCA66} #message {bredde: 450px; margin-top: 35px; polstring: 12px 15px; border-top: 1px prikket # 666; kant-bund: 1px prikket # 666; baggrund: # 2EE6F3; tekstjustering: begrunde; skrifttype: 90% / 1em 'Lucida Grande', Verdana, sans-serif; tekst-transform: ingen; font-vægt: normal; bogstavafstand: 0; farve: # 000} #message img {polstring: 10px}

Med disse små ændringer, som vi fremhæver med fed skrift, tilføjet til ændringen foretaget i .tpl -skabelonen, kan vi opnå noget, der ligner følgende billede:

Som vi ser, hjælper dette kraftfulde værktøj sammen med vores kreativitet os med at opnå ganske interessante resultater.
Med dette afslutter vi selvstudiet og med dette opnår vi viden om, hvordan vi ændrer vores vedligeholdelsesside, og som vores kunder ved, at når vi ikke er i luften, vil vores kvalitet være den samme.Kan du lide og hjælpe denne vejledning?Du kan belønne forfatteren ved at trykke på denne knap for at give ham et positivt punkt