Press "Enter" to skip to content

PrestaShop 1.6 – sposób na umieszczenie na stronie głównej sklepu listy kategorii w formie boxów. Proste programowanie.

Admin 0

Jeśli nasz sklep internetowy wymaga zaprezentowania na stronie głównej boxów z linkami do kategorii – poniżej “przepis” jak to wykonać.

Taka forma prezentacji może zwiększyć klikalność i sprawić, że klienci szybciej dotrą do interesujących ich przedmiotów nie przeszukując menu głównego sklepu. Jeśli jeszcze w okładkach kategorii zastosujemy “clickbait-owe” grafiki – mamy szansę zwiększyć konwersję sprzedaży przez takie rozwiązanie.

Co warte podkreślenia – nasze rozwiązanie jest dynamiczne. Tzn. jeśli jakaś kategoria zostanie wyłączona – zniknie także na stronie głównej. Dodanie nowej podkategorii też sprawi że się ona pojawi na stronie startowej sklepu. Jednak należy pamiętać aby przypisać do niej okładkę 🙂

Sposób został opracowany dla wersji 1.6. Jeśli poszukujesz wersji dla 1.7 – możesz spróbować odp. zmodyfikować podany kod. Jest on w dużej mierze natywny w stosunku do nowszej wersji.

Dodatkowa uwaga. W zależności od Twojego szablonu możliwe, że będą potrzebne dodatkowe prace webmasterskie aby dostosować wygląd boxów stricte pod Twój szablon. My stosujemy tutaj domyślny styl CSS dla wyglądu boxów podkategorii (subcategories) w kategoriach.

Moduł polecanych produktów na stronie głównej.

Wejdź w “Moduły -> Pozycje” i upewnij się, że na stronie głównej jest przypięty moduł “Polecane produkty na stronie głównej” (homefeatured) jeśli nie – przypnij je do strony głównej albo zresetuj ten moduł.

Edycja kodu PHP

Uwaga! Przed pojęciem działań na plikach – warto wykonać ich kopie zapasową 🙂

Otwórz plik:

Dopisz w nim funkcję:

I tutaj w miejscu cyfry 52 podaj ID kategorii zbiorczej, której podkategorie mają być wyświetlane. Jeśli jest to kategoria główna – wejdź w dział “Katalog -> Kategorie” i przepisz ID tej kagegorii. To kategorie które są dla niej podkategoriami będą wyświetlane.

W funkcji hookDisplayHome() dopisz kod:

Wklej go przed:

W tym samym pliku znajdz funkcję hookHeader() i zamień kod w jej wnętrzu:

na:

Jeśli Twój kod jest inny – wykonaj to tak, aby plik category.css był include’owany w nagłówku i aby ten styl CSS był dostępny.

Edycja kodu HTML i bazowa konfiguracja

Teraz przechodzimy do sedna. W pliku .tpl który wyświetlany jest na stronie głównej:

Na początku tego pliku wklej:

Natomiast na końcu:

Jaka jest idea takiego kodu? Jak widać w pliku PHP przekazujemy zmienną $israndom. Jest ona określana przez “wajhę” TAK/NIE o tytule “Losowe wyświetlanie produktów polecanych” w konfiguracji modułu homefeatured:

Konfiguracja modułu “homefeatured”

W ten sposób mamy takie zachowanie:

  • Jak jest ustalana losowość: pokazuj domyślnie produkty polecane na stronie głównej
  • Jesli nie jest ustalana losowoć: pokazuj okładki kategorii (tego czego dotyczy ten artykuł).

Czyli mozna uznać, że jest to “bazowa konfiguracja” czy pokazywać kategorie na głównej czy nie.

Oczywiście możemy pokazać to i to – po prostu pozbywając się
1) klauzuli {if $israndom}
2) klauzuli środkowej {else}
3) klauzuli końcowej {/if}
To jak ma się to wyświetlać – zależy od Ciebie.

Gotowe! Po przebudowaniu cache szablonu i wyczyszenu pamięci podręczniej – na stronie głównej pojawią się boxy kategorii. Tak jak zostało napisane to wyżej – jeśli potrzebujesz dodatkowych styli CSS – dopisz je do pliku category.css aby dotyczyły tylko kodu zestrony głównej.

Znacznik <body> na stronie głównej posiada atrybut ID o wartości

I zawsze mozesz z tego skorzystac w dyrektywach CSS:)

Wymiar grafiki boxa kagegorii na stronie głównej

Warto też dobrać odp. rozmiar grafik. Czy to kwadratowe, czy prostokątne. Ich rozmiar określisz w dziale “Zdjęcia” w PrestaShop 1.6 w adminie. My w kodzie używamy rozmiaru tm_home_default – zupełnie typowy dla danego szablonu. Ty możesz stworzyć wręcz dodatkowy np. home_cetegory_cover + nadać mu określone wymiary (unikalne dla Twojego szablonu) i przebudować następnie miniatury kategorii tylko dla tego wymiaru. W ten sposób nie naruszysz okładek z kategorii a tego wymiaru będziesz używać tylko do strony głównej. Tutaj PrestaShop 1.6 jest bardzo elastycznym systemem.

grafika: pexels.com

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Wymagane pola są oznaczone *

Witryna wykorzystuje Akismet, aby ograniczyć spam. Dowiedz się więcej jak przetwarzane są dane komentarzy.

Zobacz także !
Ustawienie okładek kategorii dla 150 albo 2000 kategorii na Twoim…