Spisie treści
Utrzymanie strony serwisu jest bardzo ważnym aspektem, ponieważ są chwile, w których z różnych powodów (problemy z dostawcami, aktualizacja kodu źródłowego, wejście w życie nowych przepisów handlowych) musimy chwilowo zawiesić naszą stronę, jednak co użytkownik i potencjalny klient widzi musi odzwierciedlać cały profesjonalizm osoby, która za tym stoi.konserwacja.css
Po wejściu w tryb konserwacja w naszym sklepie internetowym Prestashop, nasi użytkownicy zobaczą następujące informacje, jeśli używamy domyślnego motywu:
Zobaczmy zawartość tego pliku:
*, body {margin: 0; padding: 0} body {font-family: 90% / 1em 'Lucida Grande', Verdana, sans-serif} #maintenance {szerokość: 450px; margines: 35px auto 0 auto; dopełnienie: 12px 0; tło: #fff; wyrównanie tekstu: środek; transformacja tekstu: brak; grubość czcionki: normalna; odstępy między literami: 0; kolor: # C73178} #wiadomość {szerokość: 450px; margines górny: 35px; dopełnienie: 12px 15px; góra obramowania: 1px z kropkami # 666; obramowanie-dół: 1px z kropkami # 666; tło: # F9E3EE; text-align: justuj; czcionka: 90% / 1em 'Lucida Grande', Verdana, bezszeryfowa; transformacja tekstu: brak; grubość czcionki: normalna; odstępy między literami: 0; kolor: # C73178} #obraz wiadomości {wypełnienie: 30px} Podczas oceny kodu zdajemy sobie sprawę, że mamy 3 duże selektory, które nadają strukturę naszej stronie serwisowej, zobaczmy teraz następujący obraz, aby móc wizualnie zlokalizować każdy selektor:
konserwacja.tpl
Pliki CSS z Prestashop pliki kontrolne .tpl czym są szablony Smarty, korzystanie z szablonów usprawnia i ułatwia pracę, do tego musimy znać szablon konserwacja.tpl Zobaczmy kod, który to rozumie:
{$ meta_title | escape: 'htmlall': 'UTF-8'} {if isset ($ meta_description)} {/ if} {if isset ($ meta_keywords)} {/ if}
{l s = 'W ***** w celu przeprowadzenia konserwacji witryny nasz sklep internetowy został tymczasowo wyłączony. Przepraszamy za niedogodności i prosimy o spróbowanie ponownie później! '}
Jak widzimy każdy z selektorów CSS jest on obecny w tym pliku, więc każda wprowadzona przez nas zmiana będzie miała wpływ na tę sekcję.
Na przykład w sekcji wiadomości:
Możemy to zmienić na następujące:
Następnie możemy zmodyfikować CSS z następującymi:
#konserwacja {szerokość: 750px; margines: 35px auto 0 auto; dopełnienie: 12px 0; tło: #fefefe; wyrównanie tekstu: środek; transformacja tekstu: brak; grubość czcionki: pogrubiona; odstępy między literami: 0; kolor: # 3FCA66} #wiadomość {szerokość: 450px; margines górny: 35px; dopełnienie: 12px 15px; góra obramowania: 1px z kropkami # 666; obramowanie-dół: 1px z kropkami # 666; tło: # 2EE6F3; text-align: justuj; czcionka: 90% / 1em 'Lucida Grande', Verdana, bezszeryfowa; transformacja tekstu: brak; grubość czcionki: normalna; odstępy między literami: 0; kolor: # 000} #obraz wiadomości {wypełnienie: 10px} Dzięki tym małym zmianom, które zaznaczamy pogrubioną czcionką, dodanym do zmiany dokonanej w szablonie .tpl, możemy osiągnąć coś podobnego do poniższego obrazu:
Na tym kończymy tutorial i tym samym zdobywamy wiedzę jak modyfikować naszą stronę serwisową i dzięki której nasi klienci będą wiedzieć, że kiedy nie będziemy na antenie, nasza jakość będzie taka sama.Podobał Ci się i pomógł ten samouczek?Możesz nagrodzić autora, naciskając ten przycisk, aby dać mu pozytywny punkt
