Jak edytować układ strony w PrestaShop?

Edycja układu strony w PrestaShop to kluczowy element w procesie tworzenia unikalnego i atrakcyjnego sklepu internetowego. W tym artykule pokażemy Ci, jak krok po kroku dostosować wygląd Twojego sklepu do własnych potrzeb.

Edycja układu strony w panelu administracyjnym

Zmiana układu w ustawieniach motywu

PrestaShop oferuje możliwość dostosowania układu bez konieczności edytowania kodu. Aby to zrobić:

1. Zaloguj się do panelu administracyjnego.
2. Przejdź do Wygląd → Motywy i Logo.
3. Kliknij przycisk Dostosuj obok aktualnie używanego motywu.
4. W sekcji Układ strony można wybrać układ dla różnych stron sklepu (strona główna, kategorie, produkty, koszyk itd.).

Moduły i ich pozycjonowanie

PrestaShop wykorzystuje moduły, które można swobodnie umieszczać w różnych sekcjach strony:

1. Przejdź do Wygląd → Pozycje.
2. Wyszukaj moduł, który chcesz przenieść lub zmienić jego układ.
3. Użyj opcji Przenieś, aby umieścić go w innej sekcji strony.
4. Możesz także usunąć niepotrzebne moduły lub dodać nowe, klikając Dodaj nowy moduł.

Edycja szablonów i plików w motywie

Zmiana struktury plików szablonu

Jeśli chcesz dostosować układ strony bardziej szczegółowo, konieczna będzie edycja plików motywu:

1. Przejdź do katalogu motywu: Znajdziesz go w /themes/nazwa-twojego-motywu/.
2. Edytuj pliki .tpl: Pliki szablonu w PrestaShop to głównie pliki .tpl, które można edytować za pomocą edytora kodu.
3. Dostosuj plik header.tpl, footer.tpl i product.tpl: Odpowiadają one za nagłówek, stopkę i stronę produktu.

Zmiana CSS dla układu strony

Jeżeli chcesz edytować style, edytuj pliki CSS:

1. Otwórz /themes/nazwa-twojego-motywu/assets/css/ i znajdź plik theme.css lub custom.css.
2. Dodaj lub zmodyfikuj style, aby dostosować wygląd strony.
3. Po zmianach wyczyść pamięć podręczną w Zaawansowane → Wydajność.

Korzystanie z edytora wizualnego PrestaShop

W niektórych wersjach PrestaShop dostępny jest edytor wizualny pozwalający na dostosowanie strony metodą „przeciągnij i upuść”:

1. Przejdź do Wygląd → Strony.
2. Kliknij przycisk edycji wybranej strony.
3. Skorzystaj z edytora do przenoszenia elementów.