Większa efektywność SEO dla Twojego sklepu internetowego Magento z pomocą Google Rich Snippets – tutorial

Według serwisu eMarketer sprzedaż na rynku ecommerce wzrośnie w tym roku aż o 20,1% i wyniesie 1,5 tryliarda dolarów. Nic więc dziwnego, że przedsiębiorcy coraz więcej inwestują w sprzedaż internetową, a kolejne sklepy pojawiają się w sieci jak grzyby po deszczu. W tym całym zamieszaniu użytkownicy zaczynają sprawdzać oferty powierzchownie, a właściciele sklepów internetowych muszą zadbać o dobre SEO. Powalczmy zatem o klienta i napiszmy wspólnie rozszerzenie Magento, które pokaże potencjalnym klientom najważniejsze informacje o produkcie, w miejscu specjalnie do tego przeznaczonym.

Wprawdzie wszystkie popularne wyszukiwarki preferują dane w formie Microdata, ale my nie chcemy edytowaćp plików szablonu naszego sklepu, więc przekażemy dane przez JSON+LD (JSON Linked Data), starając się ich nie dotykać. Jeśli nie masz czasu pisać własnego rozszerzenia (lub po prostu ci się nie chce ;)), w dalszej części artykułu znajdziesz gotowy do zainstalowania moduł.

Co chcemy przekazać?

Dane strukturalne potrafią przekazać wyszukiwarce mnóstwo ważnych danych od różnego typu stron: przepisy kulinarne, program TV, dane organizacji. My skupimy się na esencji naszej działalności, czyli na produkcie. Przekażmy zatem do wyników następujące dane:

  • Nazwa
  • SKU
  • Zdjęcie produktu
  • Opis (skrócony)
  • URL
  • Dostępność
  • Cena
  • Waluta
  • Kategoria
  • Kolor (jeśli dotyczy)
  • Marka (jeśli dotyczy)
  • Model (jeśli dotyczy)
  • Średnia ocen produktu (opcjonalnie)
  • Ilość komentarzy (opcjonalnie)
  • Komentarze – autor, data publikacji, tytuł komentarza, treść komentarza (opcjonalnie)

Struktura modułu

UWAGA! Nie powinniśmy implementować Rich Snippets w sklepach, w których często zmieniamy ceny. Wyszukiwarki nie indeksują naszych produktów codziennie, więc dane w wynikach wyszukiwania mogą być nieaktualne

Odpalmy sklep na naszym localhoście, zróbmy kopię zapasową bazy danych, wyłączmy cache w Magento i stwórzmy szkielet dodatku:

Na tym etapie powinniśmy mieć już działający dodatek. Poszukajmy go zatem na liście modułów w panelu administracyjnym: System > Configuration > Advanced > Advanced


Formularz konfiguracyjny

Dorzućmy trochę kodu w celu stworzenia własnej pozycji w konfiguracji systemu Magento i kilku opcji do sterowania naszym dodatkiem:

Sekcja <tabs> informuje Magento, że chcemy otrzymać własną pozycję w części konfiguracyjnej sklepu, <groups> pomoże nam zachować ład w naszym formularzu. Następnie dodaliśmy następujące opcje:

  • <enabled>…</enabled> – włącz/wyłącz cały moduł
  • <review>…</review> – decyduje o tym czy przesłać do tablicy informacje o ocenach i komentarzach
  • <manufacturer>…</manufacturer> – wiele sklepów używa dodatków np. Shop By Brands, które bazują na innych (własnych) atrybutach do obsługi produktów. Pole to umożliwia wskazanie tego atrybutu, co uchroni nas przed ustawianiem marki produktu w wielu miejscach podczas dodawania produktu
  • <color>…</color> – j.w.
  • <model>…</model> – domyślnie Magento nie obsługuje takiego atrybutu. Google jednak pozwala nam wyświetlić model danego produktu, jeśli więc masz taki atrybut w swoim sklepie, możesz go tu wskazać. Jeśli nie masz – w każdej chwili możesz go stworzyć

Zauważmy, że atrybut <source_model> wskazuje ścieżkę richsnippets/attributes. Konieczne będzie więc stworzenie nowego pliku – modelu, który pozwoli załadować wszystkie dostępne atrybuty:

Zmienna $attributeArray zawiera teraz tablicę ze wszystkimi atrybutami typu „text”, „select” oraz „textarea”, powiększoną o jedną opcję bez wartości (domyślną).

Dorzućmy nasz nowy model, wraz z helperem i blockiem do pliku konfiguracyjnego uzupełniając go o sekcję global:

Aby zobaczyć jakieś zmiany w panelu administracyjnym, musimy do jego menu dodać nasz formularz. Doklejmy zatem za sekcją <global> następującą regułę:

Gotowe! Teraz możemy zarządzać naszym nowym dodatkiem, z poziomu panelu administracyjnego! Wylogujmy się zatem i zalogujmy jeszcze raz w celu przeładowania przywilejów (inaczej zamiast naszego formularza zobaczymy 404) i udajmy do: System > Configuration. Powinniśmy zobaczyć nową zakładkę pod nazwą Creativestyle. Dodajmy jeszcze na końcu pliku kilka ustawień domyślnych dla naszych pól oraz informację o pliku szablonu:

2014-05-29_1603

Po zapisaniu zmian powinniśmy zobaczyć efekt finalny części backend’owej.

Tworzymy tablicę z danymi produktu

Mając gotowy formularz, możemy się skupić na sercu modułu. Uzupełnimy nasz Block o kilka funkcji, które finalnie zwrócą nam gotową tablicę z danymi strukturalnymi na podstawie schematów http://schema.org, a konkretnie o jeden typ – Produkt

Po krótce:

  • funkcja getProduct() sprawdzi czy jesteśmy na stronie produktu
  • przekazując parametr w postaci kodu atrybutu do funkcji getAttributeValue() otrzymamy jego wartość

Na koniec dopisujemy funkcje która zbierze wszystkie dane o produkcie w jednej tablicy i zwróci ją w formacie JSON.

Oto kompletna zawartość bloku:

Komentarze w kodzie opisują poszczególne jego części, więc nie ma potrzeby opisywania go tutaj ponownie.

Na koniec „wyplujmy” wszystko do szablonu:

I koniec! Właśnie skończyliśmy pisać nasz moduł. Przydałoby się zatem sprawdzić czy działa poprawnie.

Testing, testing, testing…

Niestety ani Google, ani Bing czy Yahoo nie udostępnili żadnego narzędzia do podglądu wyniku wyszukiwania, które obsługuje dane strukturalne z JSONLD, więc na efekt przyjdzie nam poczekać do czasu aż boty przeindeksują nasze produkty. Jest jednak sposób na sprawdzenie poprawności przesyłanych przez nas informacji. Posłuży nam do tego tester znaczników w emailu, od Google. Otwórzmy zatem dowolny produkt w naszym sklepie, skopiujmy pełne źródło strony i wklejmy nasz HTML do testera. Jeśli wszystko zrobiliśmy tak jak trzeba, powinniśmy otrzymać mniej-więcej taki wynik:

2014-05-30_1223

Nasz moduł w obecnej wersji niestety nie obsłuży kompleksowo produktów konfigurowalnych oraz grup. Przekaże tylko informacje o ofercie, którą zastanie na stronie w momencie jej wyświetlenia. Koszula koloru niebieskiego może być nieco droższa od białej, niestety w tym przypadku, nie damy rady tego pokazać bezpośrednio w wyszukiwarce. Być może w przyszłości pokuszę się o rozbudowę tego dodatku. W pierwszej wersji starałem się jednak szanować serwer i obciążyć go w jak najmniejszym stopniu.

Dodatek do pobrania znajdziesz klikając tutaj.

pluswerk