Pozycjonowanie PrestaShop – praktyczne porady SEO
10 min
10 min
Na skróty
Prowadzisz sklep internetowy oparty na systemie PrestaShop? Z pewnością chcesz, aby serwis był odpowiednio widoczny w Internecie, co pozwoli generować ruch, a w sprzyjających warunkach także konwersję. Dlatego koniecznie dowiedz się, jak powinny wyglądać pozycjonowanie sklepu PrestaShop. To system e-commerce, który daje naprawdę wiele możliwości!
PrestaShop to najpopularniejszy system do zarządzania sklepem internetowym w Polsce. Korzysta z niego obecnie ponad 17tys. sklepów, co przekłada się na 24% udział w rynku eCommerce w naszym kraju. Pod względem wielkości na całym świecie, obecnie PrestaShop zajmuje 8. miejsce z 3% “poparciem” i blisko 300tys. sklepów opartych o to oprogramowanie:
Swoją popularność system ten zawdzięcza przede wszystkim dystrybucji jako Open Source oraz możliwościom konfiguracyjnym. Zaawansowany programista PHP będzie mógł zrobić na oprogramowaniu PrestaShop dosłownie wszystko. I choć system ten jest oprogramowaniem darmowym, warto mieć na uwadze fakt, iż do jego poprawnego funkcjonowania, wymagane jest zainstalowanie odpowiednich wtyczek (darmowych lub płatnych) oraz ponadpodstawowa znajomość PHP, ze względu na ograniczone możliwości wprowadzania zmian przez panel CMS.
Przy podstawowej wiedzy, i bazując jedynie na darmowych wtyczkach, jesteśmy w stanie stworzyć funkcjonujący sklep internetowy, jednak stworzenie profesjonalnego serwisu będzie wymagało inwestycji w płatne rozwiązania lub zatrudnienie programisty PHP celem zaawansowanej konfiguracji.
W poniższym tekście postaramy się przedstawić Wam możliwości konfiguracyjne w PrestaShop oraz wykonanie podstawowej optymalizacji tego CMS pod kątem pozycjonowania.
Nie ma sensu rozpisywać się pod kątem poradnika dotyczącego zakładania nowego sklepu PrestaShop, gdy oficjalna dokumentacja opisuje wszystko krok po kroku. Dlatego bez zbędnego opisywania sposobu pobierania i instalacji zapraszamy do oficjalnej dokumentacji oprogramowania, z której dowiesz się, jak w ciągu kilkunastu minut założyć swój sklep PrestaShop.
Instalator procesem przypomina instalację nowego oprogramowania na komputerze i prowadzi użytkownika przez cały proces. Po przejściu do końca zobaczycie, które elementy są wykonywane w danym momencie:
Po zakończeniu wszystkich powyższych operacji sklep jest zainstalowany i gotowy do konfiguracji!
Po zainstalowaniu i skonfigurowaniu swojego sklepu (a także po dodaniu towarów) możemy przejść do jego optymalizacji pod kątem SEO. Biorąc pod uwagę to, że możliwym jest zaczynanie na podstawowym szablonie, pierwszym elementem związanym z dalszym dostosowywaniem sklepu powinna być instalacja odpowiednich modułów.
Moduły Prestashop, często też nazywane wtyczkami (za sprawą WordPressa, który rozpropagował głównie to nazewnictwo) są w dużej mierze płatne. Ceny niestety nie są zazwyczaj dostosowane do polskiego użytkownika i potrafią przekraczać nawet 100 euro. Pozwalają jednak użytkownikom rozszerzyć funkcjonalność sklepu. Prestashop oferuje tysiące modułów, które można też kupić od firm zewnętrznych. Każda z nich oferuje coś innego. A to wszystko umożliwia dostosowanie sklepu do ich konkretnych potrzeb lub ich klientów.
Przyjazność adresów URL ma wpływ nie tylko na odczytywanie naszych linków przez roboty indeksujące, ale oddziałuje także na postrzeganie witryny przez użytkowników – wszak zarówno robot jak i człowiek dowie się więcej o zawartości strony, jeżeli będzie ona nazwana /kozaki-muszkieterki aniżeli /category-12.html.
W PrestaShop przyjazność adresów URL włączamy w menu Preferencje > SEO & URL (lub Ruch):
Jeżeli dla naszej domeny wykupiliśmy certyfikat bezpieczeństwa TLS (protokół https) w panelu Prestashop powinniśmy włączyć jego obsługę dla poszczególnych adresów. Ustawienia te znajdują się w menu Preferencje > Ogólny:
Domyślnie po instalacji sklepu na oprogramowaniu Presta w meta tagach strony głównej znajdą się takie informacje jak: nazwa sklepu w znaczniku title, natomiast w meta description – “Sklep na oprogramowaniu PrestaShop”. Pozostawienie tego elementu w takiej postaci można już uważać jako błąd, a dodatkowo może to wpłynąć niekorzystnie na prezentację naszej strony w wynikach wyszukiwania:
W przypadku strony głównej należy przejść do zakładki Preferencje > SEO & URL (zamiennie: Ruch). Następnie wybieramy stronę oznaczoną jako index i dodajemy ustalone title oraz meta description:
Bardzo podobnie wygląda to w przypadku kategorii w naszym sklepie. Tutaj jednak musimy udać się do zakładki Katalog > Kategorie.
Przy wybranej kategorii klikamy w edycję i na załadowanej stronie szukamy sekcji Meta-tytuł oraz Opis meta:
Analogicznie postępujemy w przypadku kart produktów, tu jednak w menu Katalog wybieramy Produkty. W kolejnym kroku z menu po lewej stronie wybieramy zakładkę SEO i możemy uzupełnić Meta-tytuł oraz Opis meta:
UWAGA: w sklepie opartym o PrestaShop w znaczniku Title automatycznie dopisywana jest nazwa sklepu, zatem jeżeli chcemy dokonać zmian w tym elemencie musimy przejść w menu do Preferencje > Kontakty sklepu > Nazwa sklepu:
Jeżeli chcemy usunąć nazwę sklepu ze stałego elementu, należy dokonać zmian w kodzie strony
Globalny schemat description w PrestaShop zwalnia nas z obowiązku uzupełniania tego elementu ręcznie, jeżeli mamy dużą bazę produktową. O ile title generuje się automatycznie, tak w przypadku description musimy radzić sobie sami. Do wyboru mamy dwie opcje:
Poniżej opiszemy drugie rozwiązanie, dla osób chcących spróbować swoich sił w edycji Presty.
Na początek musisz zalogować się do swojego konta na serwerze FTP i odnaleźć plik header.tpl w wykorzystywanym szablonie sklepu. Powinieneś znaleźć tam domyślnie taki zapis odpowiedzialny za generowanie title oraz meta description:
{if isset($meta.description) AND $meta.description}
<meta name=”description” content=”{$meta.description|escape:html:’UTF-8′}” />
{/if}
Jak widać, system automatycznie pobiera opis meta description ze zmiennej przypisanej konkretnemu polu w panelu sklepu. W związku z tym, że w przypadku części podstron mogłeś przypisać już odpowiednie treści musimy zmienić tę formułę w taki sposób, by ów tekst nie został nadpisany przez nasz “generator”. W tym celu dodamy warunek else:
{if isset($meta_description) AND $meta_description}
<meta name=”description” content=”{$meta.description|escape:html:’UTF-8′}” />
{else}
<meta name=”description” content=”{$meta.description|escape:html:’UTF-8′}” />
{/if}
Nadal jednak w owej instrukcji warunkowej wywołujemy standardowy schemat. W budowie naszego schematu wykorzystamy zmienną $meta_title. Jednak jak pamiętasz z poprzedniego punktu, w elemencie tym automatycznie dopisuje się nazwa sklepu. W związku z powyższym musimy “wyciąć” ten element z title w tym miejscu. Dokonamy tego przy pomocy funkcji replace, którą zastąpimy nazwę sklepu/domeny pustym miejscem:
{$meta.title|replace:’- Nazwa Sklepu’:”}
Dopiszemy teraz kilka dodatkowych wyrazów, by zunifikować nasze description i otrzymamy prosty schemat meta description:
{if isset($meta.description) AND $meta.description}
<meta name=”description” content=”{$meta.description|escape:html:’UTF-8′}” />
{else}
<meta name=”description” content=”Sprawdź {$meta.title|replace:’- Nazwa Sklepu’:”} w sklepie Nazwa Sklepu. Znajdziesz tu szeroką ofertę … w niskich cenach. Zapraszamy!” />
{/if}
W tym momencie ogranicza Cię jedynie wyobraźnia i liczba 155-160 znaków, by odpowiednio dostosować schemat description dla swojej strony.
W przypadku SEO na PrestaShop ważne są nagłówki, oznaczane często jako nazwy kategorii na stronach kategorii i nazwy produktów na karcie produktu. Z punktu widzenia pozycjonowania warto się zastanowić, czy tego nie zmienić. Wynika to z faktu, że nagłówki są raczej stosowane treści, a rzadziej jako oznaczenie np. nazw produktów w kategorii.
W przypadku strony głównej w zależności od szablonu nagłówek H1 może nie być wykorzystany (i będziemy mogli dodać go w edytorze WYSIWYG podczas dodawania treści na stronę główną) lub nagłówkiem tego rzędu zostanie oznaczony jakiś element nawigacyjny strony (przykładowo: nagłówek Polecane produkty, który powinien być niższego rzędu, tj. H2/H3).
Mogą jednakże wystąpić sytuacje (również w zależności szablonu), gdzie nagłówek H1 będzie ukryty lub nie został umieszczony w ogóle na stronach kategorii. W celu jego dodania lub uwidocznienia będziemy musieli udać się na serwer FTP i edytować odpowiedni plik. W tym przypadku będzie to najczęściej plik category.tpl. W jego edycji musimy odnaleźć (lub dodać w odpowiednim miejscu, jeżeli go brakuje) kod:
<h1>{$category->name|escape:’html’:UTF-8’}</h1>
Niestety, obecnie jest to jedyna metoda, dzięki której możemy poprawić/edytować nagłówki H1 na stronach kategorii w PrestaShop. Kilka lat temu w bazie modułów dostępna była wtyczka do modyfikacji bezpośrednio z panelu sklepu, jednak została ona wycofana.
O tym jak ważna jest optymalizacja obrazów pod kątem nie tylko pozycjonowania ale i konwersji pisaliśmy szerzej tutaj <link do wpisu na blogu?>. W przypadku PrestaShop mamy możliwość wykorzystania do tego celu płatnej wtyczki, która umożliwi nam kompresję przesłanych zdjęć i ich dostosowanie do jak najlepszej relacji pod kątem czasu wczytywania, np.: https://addons.prestashop.com/pl/wydajnosc-strony/27020-total-image-optimization-pro-lossless-compression.html
Niestety, żaden darmowy moduł nie jest w tej chwili dostępny.
Oczywiście wiele możemy zrobić we własnym zakresie, wykorzystując np. narzędzia dostępne w Internecie do bezstratnej kompresji zdjęć.
Atrybut alt to tekst alternatywny, który najlepiej dodawać przy przesyłaniu obrazków na stronę. Jego odpowiednie uzupełnienie jest ważne zarówno pod kątem pozycjonowania, jak i dostosowania naszej strony dla osób niewidzących i niedowidzących (odpowiednie programy w tej sytuacji “czytają” opis danego zdjęcia osobie przeglądającej naszą stronę).
Oprogramowanie PrestaShop umożliwia nam w tym zakresie skorzystanie z płatnego rozwiązania, np. modułu SEO Image opracowanego przez PrestaShop: https://addons.prestashop.com/pl/seo-pozycjonowanie-naturalne/26877-seo-image.html lub od innych dostawców.
Alternatywnym rozwiązaniem będzie umieszczenie odpowiedniej zmiennej (np. nazwy produktu) w atrybucie alt dla konkretnych zdjęć produktowych. Najczęściej atrybuty te nie będą wyświetlane na listingu produktów (na stronach kategorii), dlatego by dodać w tym miejscu alt zdjęć produktowych, musimy na serwerze odnaleźć plik product_list.tpl w katalogu szablonu naszego sklepu.
Teraz musimy odszukać ścieżkę zdjęcia produktu, która będzie indywidualna dla każdego przypadku. Jednakże zawsze powinniśmy szukać <img src=”… oraz słów “product”. Gdy odnajdziemy odpowiedni wiersz, w znaczniku alt musimy dodać:
alt=”{$product.name|escape:’htmlall’:’UTF-8′}
PrestaShop od wersji 1.7 posiada preinstalowany moduł do generowania pliku sitemap.xml i jest to obecnie najskuteczniejsza i najłatwiejsza metoda dla tego oprogramowania. Moduł ten znajdziemy w menu Moduły > Wybrane, gdzie musimy odszukać: Mapa strony Google. Podczas konfiguracji tego modułu możemy wybrać, jakie strony powinny zostać wykluczone z dodawania do mapy oraz jak często system ma aktualizować ów plik.
Oczywiście alternatywą dla tego działania będzie generowanie mapy witryny ręcznie, korzystając z narzędzi dostępnych w Internecie. Aczkolwiek wymaga to każdorazowej, ręcznej aktualizacji pliku i ponowne przesyłanie go na serwer, dlatego zalecamy korzystanie z automatycznego generatora mapy.
Przekierowaniami w Prestashop możemy zarządzać z poziomu (płatnego) modułu, który dodatkowo umożliwi nam ustawienie automatycznych przekierowań (np. w przypadku usunięcia produktu z asortymentu). Jeżeli jednak nie chcemy wydawać 40 euro do dyspozycji mamy oczywiście plik .htaccess, w którym z poziomu serwera możemy dopisywać kolejne reguły w języku Apache. Przykładowo, jeżeli chcemy, by nasza strona dostępna była tylko z poziomu domena.pl bez przedrostka w postaci subdomeny www, w pliku .htaccess musimy dodać regułę:
RewriteEngine on
RewriteCond %{HTTP_HOST} ^www\.example\.com [NC]
RewriteRule ^(.*)$ http://example.com/$1 [L,R=301]
Plik robots.txt umożliwia nam kontrolowania przepływu robotów Google (oraz innych wyszukiwarek) przez naszą stronę. Domyślnie plik ten kojarzy się z blokowaniem lub udzielaniem dostępu do naszej strony konkretnym robotom – zarówno dla całej strony jak i jej poszczególnych podstron.Plik ten powinien znajdować się w głównym katalogu na serwerze naszej strony i domyślnie jego zapis to dyrektywa:
User-agent: *
Allow: /
Zapis ten oznacza, iż każdy robot ma dostęp do każdego miejsca na naszej stronie.
Dodatkowe zapisy, jak chociażby:
Disallow: /index.php
Sprawią, że wszystkie roboty nie będą mogły odwiedzać strony /index.php, jednak dotrą na pozostałe.
Jeżeli chcemy wykluczyć indeksowanie przez inne roboty, musimy skorzystać z zapisu:
User-agent: nazwa-robota-indeksującego
Disallow: /
Przykładowo:
User-agent: Yandex
Disallow: /
Jeżeli nie chcemy, by roboty Yandex indeksowały naszą stronę i miały do niej dostęp.
W PrestaShop mamy możliwość wygenerowania pliku robots.txt w zakładce Preferencje > SEO & URL (lub: Ruch):
Domyślnie w szablonach sklepów PrestaShop dane strukturalne/uporządkowane są już standardem. Jeżeli jednak jakimś cudem w naszym ich brakuje, jak zwykle mamy możliwość skorzystania z dwóch opcji: ręczne dodanie w kodzie strony lub skorzystanie z płatnej wtyczki.
Korzystając z pierwszej metody szukamy pliku products.tpl i dopisujemy odpowiednie zapisy, korzystając z danych strukturalnych w standardzie Schema.org. Całość polega na oznaczeniu odpowiednich elementów na karcie produktu przy pomocy danych strukturalnych. Instrukcje na ich temat znajdziesz w oficjalnej dokumentacji Google.
Opis produktu w PrestaShop dodajemy na karcie danego produktu, wyszukując go odpowiednio w menu Katalog > Produkty i przechodząc do edycji:
Mamy tutaj możliwość dodania zarówno opisu krótkiego (który często pojawia się obok zdjęcia produktu) oraz opisu długiego.
Analogicznie postępujemy w przypadku opisu kategorii w PrestaShop. W menu wybieramy Katalog > Kategorie i przechodzimy do edycji danej kategorii:
W zależności od wykorzystywanego szablonu może okazać się, iż nasze opisy kategorii są domyślnie ukryte. W tej sytuacji w pliku category.tpl będziemy musieli dodać po prostu w odpowiednim miejscu kod.
Weryfikacji Google Search Console możemy dokonać na kilka sposobów. Pierwszym z nich będzie umieszczenie odpowiedniego pliku w głównym katalogu naszej strony.
Drugi to dodanie tagu weryfikacyjnego w sekcji <head> naszej strony – w tym celu należy umieścić ów kod w pliku header.tpl.
Trzecią metodą jest weryfikacja na podstawie konta Google Analytics, jeżeli kod śledzenia został zainstalowany przez nas wcześniej.
Instalacja Google Analytics na stronie może przebiegać przy pomocy odpowiedniego modułu (darmowego lub płatnego), w którym podajemy jedynie identyfikator UA-ID.
Do tego celu możesz wykorzystać darmową, oficjalną wtyczkę PrestaShop: https://addons.prestashop.com/pl/analizy-statystyki/27138-google-analytics.html.
Do zbierania danych o transakcjach możesz wykorzystać wymienioną powyżej darmową wtyczkę: https://addons.prestashop.com/pl/analizy-statystyki/27138-google-analytics.html lub któreś z płatnych rozwiązań.
Oczywiście zarówno weryfikację/implementację kodu śledzenia jak i eCommerce można przeprowadzić poprzez umieszczenie kodu w odpowiednim miejscu w kodzie strony, jednak szczególnie w przypadku eCommerce będzie to wymagało oznaczania specyficznych zmiennych z danymi o transakcji (nazwa produkt, SKU, cena, ilość zakupionych rzeczy), dlatego działaniem tym powinna zająć się odpowiednio doświadczona osoba.
Domyślnie w PrestaShop w przypadku nazw produktów (na stronie głównej lub na kategoriach) zastosowana jest funkcja truncate, która skraca nazwę owego produktu do 35-40 znaków. W takim wypadku zamiast pełnej nazwy produktu, przykładowo na liście produktów wyświetlone zostanie jedynie jej krótsza wersja.
I teoretycznie dla klienta jest to jedynie małym utrudnieniem, jednakże już pod kątem pozycjonowania nieco większym. Wszystko dlatego, że nazwa produktu jest aktywnym odnośnikiem do danego produktu, przez co może mieć wpływ na linkowanie wewnętrzne.
Nie da się ukryć, iż będzie miało to wpływ także na nasycenie strony odpowiednimi słowami kluczowymi, bowiem – w zależności od długości nazwy – tracimy pewien człon opisujący np. właściwość czy cechę specyficzną danego produktu.
Aby uwidocznić pełne nazwy produktów w pliku product_list.tpl musimy odnaleźć:
{$product.name|truncate:45:’…’|escape:’html’:’UTF-8’}
i usunąć truncate:45:’…’|
Platforma PrestaShop jest przyjazna działaniom SEO, jednak wymaga kompleksowej wiedzy w tym zakresie. W przeciwnym wypadku niezwykle trudne jest wprowadzanie jakichkolwiek zaawansowanych zmian optymalizacyjnych, nie wspominając już o zapewnianiu użytkownikom odpowiedniego User Experience. Jeżeli nie jesteś w stanie samodzielnie pozycjonować swojego sklepu, skorzystaj z pomocy ekspertów.
