Opis działania.
W wersji demo PrestaShop 1.7 mamy do dyspozycji baner na stronie głównej. Możemy go w prosty sposób przenieść do stopki i umieścić tam dowolną grafikę. Na grafikę może być nałożony dowolny link edytowalny w edycji modułu. W każdej chwili zdjęcie może być podmienione na inne bez podtrzeby programowania.
Modyfikacja dotyczy najnowszej (obecnie) wersji PrestaShop 1.7.8.2 i powinna zadziałać w każdej wersji 1.7. Bazujemy tutaj wyłącznie na kodzie i modulach dostępnych „na starcie” w PrestaShop, więc nic nie musimy dodatkowo doinstalowywać.
Dla początkujących programistów PrestaShop artykuł może stanowić wprowadzenie do zasady funkcjonowania hooków (przyczepów) w architekturze tego CMS. Dodatkowo poznasz na przykładzie jak działa przekazywanie zmiennych z plików PHP modułu do szablonów TPL. Zapraszamy do lektury ! 🙂
Kopia zapasowa i przygotowanie hooków
Przed podjęciem prac wykonaj kopię zapasową w dziale:
Zaawansowane -> Baza danych
Najpierw musimy zrobić miejsce pod ten baner. Może być on umieszczony tak jak na screenie po prawej albo w dowolnej z 4 kolumn.
Aby potem ustawić banner w konkretnej kolumnie należy przesunać przyczepione do hooka moduły na stronie „Pozycje” w adminie
Wchodzimy w adminie w :
Wygląd -> Pozycje -> (znajdujemy sekcję) displayFooter
Usuwamy moduł: Informacje kontaktowe za pomocą opcji pod 3-ema kropkami
Jednocześnie w ten sam sposób odczepiamy moduł baner z hooka displayHome:
Przyczepienie modułu Banner do hooka stopki
Ok, w stopce zrobiła się dziura, którą możemy wykorzystać. Przyczepiamy do niego moduł Banner. Wciśnij przycisk „Przemieszczanie modułu” (na ww. stronie Pozycje) i do hooka displayFooter wstawiamy moduł Banner:
Zatwierdzamy operację przyciskiem pod formularzem.
Podmiana zdjęcia
Podmieniamy obrazek w banerze na kwadratowy, bo w tym momencie banner nie mieści się w kolumnie:
W dziale „Moduły” znajdź moduł Banner (ps_banner) i tam wstaw wybrany obrazek.
Wyłącz przy okazji cache w dziale:
Zaawansowane -> Wydajność
zaznaczając opcję ze screena:
Aby mieś pewność, że wszystko jest na nowo wczytane – wciśnij przycisk na górze strony:
„Wyczyść pamięć podręczną”
Edycja plików .tpl i .php
Otwieramy plik:
themes/classic/modules/ps_banner/ps_banner.tpl
Przed kodem HTML w tym pliku wstawiamy:
{if $hook_name == 'displayFooter'}
<div class="col-md-3 links block">
<a class="banner hidden-sm-down" href="{$banner_img}" title="{$banner_desc}">
{if isset($banner_img)}
<img src="{$banner_img}" alt="{$banner_desc}" title="{$banner_desc}" class="img-fluid" loading="lazy">
{else}
<span>{$banner_desc}</span>
{/if}
</a>
</div>
{else}
Na końcu zamykamy klamrą:
{/if}
Następnym krokiem jest mała modyfikacja pliku PHP w module ps_banner:
Otwórz plik:
modules/ps_banner/ps_banner.php
Znajdź funkcję:
public function getWidgetVariables()
I zamień kod:
return array(
'banner_link' => $this->updateUrl($banner_link),
'banner_desc' => Configuration::get('BANNER_DESC', $this->context->language->id)
);
Na:
return array(
'banner_link' => $this->updateUrl($banner_link),
'hook_name' => $hookName,
'banner_desc' => Configuration::get('BANNER_DESC', $this->context->language->id)
);
Czyli dopisz nową zmienną hook_name której wartość ($hookName) będzie przekazywana z pliku PHP do szablonu TPL.
Gotowe! Baner jest już widoczny w stopce i moze linkować do dowolnego łącza, które zdeklarujemy w edycji modułu Banner (ps_banner):
