Jak zintegrować Trustbadge w sklepie bez użycia wtyczki?

Na początku przypominamy, że w naszej ofercie znajdują się specjalne wtyczki oraz pomoc w integracji Trustbadge z różnymi systemami oprogramowania sklepów internetowych. Przegląd tych systemów można znaleźć tutaj: Jak rozpocząć integrację Trustbadge®? Nie ma jeszcze oddzielnej instrukcji dotyczącej oprogramowania wykorzystywanego w Twoim sklepie? W takim razie skorzystaj z poniższego samouczka i wyślij do nas e-mail, abyśmy mogli opracować instrukcję również do tego oprogramowania.

Trustbadge® możesz zintegrować już pierwszego dnia członkostwa w Trusted Shops. Potrzebujesz tylko adresu URL swojego sklepu, swojego identyfikatora Trusted Shops otrzymanego w e-mailu powitalnym, nieco doświadczenia w kodowaniu oraz poniższej instrukcji integracji. 

Krok 1: Wygeneruj własny kod Trustbadge

Aby rozpocząć integrację, najpierw potrzebny będzie indywidualny kod Trustbadge. Dzięki niemu po integracji Trustbadge będzie wyświetlać informacje o Twoim sklepie, takie jak znak jakości czy gwiazdki oceny. Kod można wygenerować przy użyciu identyfikatora Trusted Shops lub adresu URL sklepu. Wystarczy wpisać jeden z nich w polu poniżej, aby automatycznie wygenerować własny kod Trustbadge.

Identyfikator Trusted Shops (zaczynający się od X...) znajdziesz w swoim panelu administracyjnym w części backend My Trusted Shops. Aby go odnaleźć, w pierwszej kolejności zaloguj się do My Trusted Shops klikając tutaj. Po zalogowaniu się zostaniesz przeniesiony bezpośrednio do panelu administracyjnego. W prawej kolumnie panelu wyświetlone są Twoje sklepy zarejestrowane w Trusted Shops wraz z odpowiednimi identyfikatorami Trusted Shops.

Krok 2: Skonfiguruj kod Trustbadge odpowiednio do swoich potrzeb

W wygenerowanym kodzie Trustbadge można modyfikować różne ustawienia, tak aby dostosować wyświetlanie Trustbadge do indywidualnych warunków w sklepie. Istotne są tu parametry, które można znaleźć w sekcji _tsConfig kodu. W dalszej części omówimy poszczególne parametry i modyfikacje, jakich można za ich pomocą dokonać.

'yOffset': '0', /* offset from page bottom */

Domyślnie Trustbadge jest wyświetlany w prawym dolnym rogu strony sklepu. Za pomocą parametru „yOffset” możesz przesuwać Trustbadge w osi pionowej. Wystarczy zmienić wartość 0 na liczbę pikseli, o którą chcesz przesunąć Trustbadge w górę.

Domyślnie Trustbadge jest wyświetlany na wysokości 54 pikseli od dolnej krawędzi. Jeśli chcesz, żeby znajdował się niżej, możesz wprowadzić wartości ujemne. Wartość nie powinna być jednak niższa niż -54.

'variant': 'reviews', /* default, reviews, custom, custom_reviews */

Istnieją cztery warianty wyświetlania Trustbadge. Parametr „variant” pozwoli określić, który z nich jest widoczny w Twoim sklepie. Domyślnie wybrany wariant to „reviews”. Jeśli wolisz inny wariant, zamień wartość „reviews” w wierszu kodu na „default”, „custom_reviews” lub „custom”. Dostępne cztery warianty są następujące:

  • reviews: W tym wariancie wyświetlane są gwiazdki oceny i znak jakości.

01_TB-reviews_PL.png

  • default: Po uzyskaniu przez sklep certyfikatu, w tym wariancie pokazywany będzie tylko znak jakości.

02_TB-default_PL.png

  • custom_reviews: W tym wariancie Trustbadge wyświetla gwiazdki oceny i znak zaufania w taki sam sposób jak w przypadku opcji „reviews”. Jednak wybór „custom_reviews” umożliwia elastyczne pozycjonowanie w Twoim sklepie.

03_TB-customreviews_PL.png

  • custom: W tym wariancie Trustbadge wyświetla wyłącznie znak jakości, w taki sam sposób jak w przypadku opcji „default”. Jednak wybór „custom” umożliwia elastyczne pozycjonowanie w sklepie.

04_TB-custom_PL.png

Jeśli chcesz użyć wariantu „custom” lub „custom_reviews”, konieczne będą dodatkowe modyfikacje kodu Trustbadge i używanego szablonu. Natomiast samouczek, z którego obecnie korzystasz, koncentruje się na wariantach „reviews” i „default”.
Za pomocą parametru „variant” można określić maksymalną liczbę elementów wyświetlanych przez Trustbadge. Jednak aby można było wyświetlać znak jakości, sklep musi ukończyć certyfikację. Podobnie gwiazdki oceny mogą być wyświetlane dopiero po zebraniu ocen sklepu internetowego w Trusted Shops. Różne formaty wyświetlania zostały szczegółowo omówione w tym artykule: Czym jest Trustbadge?
'disableResponsive': 'false', /* deactivate responsive behaviour */

Ogólnie rzecz biorąc Trustbadge automatycznie dostosowuje się do rozmiaru ekranu używanego przez klienta. Oznacza to, że przy szerokości ekranu 648 pikseli lub mniejszej Trustbadge przełącza się na wariant wyświetlania zoptymalizowany pod kątem urządzeń mobilnych. Jeśli zmienisz wartość parametru „disableResponsive” z false na true, to takie automatyczne dostosowanie zostanie wstrzymane. Wtedy urządzenie mobilne będzie wyświetlać wersję Trustbadge typową dla ekranów komputerowych.

'disableTrustbadge': 'false' /* deactivate trustbadge */

Te parametry mogą również służyć do określenia, czy Trustbadge ma być wyświetlany w Twoim sklepie czy nie. Jeśli zmienisz wartość tego parametru z false na true, Trustbadge zostanie ukryty. Na stronie z potwierdzeniem zamówienia pojawi się jednak Trustcard, umożliwiający klientom wyrażenie zgody na zaproszenie do wystawienia opinii, a także oferujący im Ochronę Kupującego.

Krok 3: Wklej swój kod Trustbadge do stopki szablonu sklepu

Na serwerze FTP otwórz plik szablonu używanej stopki (footer.php lub podobny). Następnie skopiuj cały kod, który właśnie został wygenerowany i skonfigurowany w powyższym polu. Wklej ten kod do szablonu stopki bezpośrednio przed końcowym tagiem </body>.

Trustbadge będzie wtedy dostępny na każdej stronie Twojego sklepu, także na stronie z potwierdzeniem zamówienia. To już prawie wszystko. Musisz jeszcze tylko zrobić jedną ważną rzecz. 

Krok 4: Zdefiniuj transmisję danych dla Trustcard

Trustbadge potrzebuje drobnej pomocy, aby wysyłać klientom prośby o opinie i móc zaoferować Ochronę Kupującego, gdy już zakończysz certyfikację. Musisz ustawić element DIV, aby umożliwić rozpoznawanie strony z potwierdzeniem zamówienia („strony z podziękowaniem”) i przesyłanie wymaganych danych zamówienia. Wówczas Trustbadge będzie automatycznie otwierać na tej stronie Trustcard z ofertą Ochrony Kupującego na zamówienie i/lub prośbą o zgodę na wysłanie przypomnienia o pozostawieniu opinii.

website_integration_custom_pl-PL.png

Aby maksymalnie wszystko ułatwić klientom i nie prosić ich o ponowne wpisywanie swoich danych zamówienia, dane potrzebne do Ochrony Kupującego i prośby o opinię powinny zostać bezpośrednio przesłane z szablonu sklepu do Trustbadge. Wprowadź poniższy kod do szablonu strony z potwierdzeniem zamówienia (finish.tpl, thankyou.php, success.phtml lub podobnej) i zastąp pogrubione przykładowe wartości zmiennymi, które są używane w systemie Twojego sklepu, aby umożliwić dynamiczne wypełnianie elementów DIV prawidłowymi danymi zamówienia.

<div id="trustedShopsCheckout" style="display: none;">
<span id="tsCheckoutOrderNr">2020-05-21-001</span>
<span id=”tsCheckoutBuyerEmail”>moj.klient@poczta.pl</span>
<span id="tsCheckoutOrderAmount">4005.95</span>
<span id="tsCheckoutOrderCurrency">PLN</span>
<span id="tsCheckoutOrderPaymentType">PREPAYMENT</span>
<span id="tsCheckoutOrderEstDeliveryDate">2020-05-24</span>
</div> 

Poniżej na przykładowym kodzie krótko wyjaśnimy parametry przesyłania, które umożliwiają przekazywanie wymaganych danych.

<span id="tsCheckoutOrderNr">2020-05-21-001</span>

Wymagane Ten parametr przesyła numer zamówienia. Jest to wymagane w celu przypisania przesłanej opinii do konkretnego procesu składania zamówienia. Jeśli numer zamówienia nie jest dostępny, można również przekazać znacznik czasu dla danego zamówienia, o ile to odniesienie jest jednoznaczne.

<span id=”tsCheckoutBuyerEmail”>klient@poczta.pl</span>  

Wymagane Ten parametr przekazuje adres e-mail klienta. Jest to wymagane, aby wysłać klientowi zaproszenie do wystawienia opinii kilka dni po złożeniu zamówienia lub wysłać e-mail z potwierdzeniem zawartej umowy gwarancyjnej.

<span id="tsCheckoutOrderAmount">95</span>

Opcjonalny, ale wymagany, jeśli masz znak jakości. Ten parametr przekazuje całkowitą kwotę zamówienia. Jak widać na przykładzie 4005.95, separatorem dziesiętnym jest kropka, a kwota jest podawana z dokładnością do dwóch miejsc po przecinku.

<span id="tsCheckoutOrderCurrency">PLN</span>

Opcjonalny, ale wymagany, jeśli masz znak jakości. Ten parametr przenosi kod waluty zamówienia zgodnie z normą ISO 4217. Jeśli oferujesz tylko jedną walutę, wartość tę można również zakodować na stałe.

<span id="tsCheckoutOrderPaymentType">PREPAYMENT</span>

Opcjonalny, ale wymagany, jeśli masz znak jakości. Ten parametr przekazuje informację o stosowanej metodzie płatności. Wystarczy prosty ciąg tekstowy. Jeśli metoda płatności nie jest już dostępna po zakończeniu zamówienia, słowo OTHER można zakodować na stałe jako wartość tego parametru.

<span id="tsCheckoutOrderEstDeliveryDate">2020-05-24</span>

Opcjonalny, ale wymagany, jeśli prośby o opinię mają być wysyłane na podstawie oczekiwanego terminu dostawy. Jest to parametr, który przekazuje oczekiwany termin dostawy. Jak widać na przykładzie 2020-05-24, używany jest format daty RRRR-MM-DD.

Ponieważ elementy DIV powinny przekazywać dynamiczne szczegóły zamówienia, powyższy przykładowy kod nie powinien być wklejany na stronie z potwierdzeniem zamówienia bez modyfikacji. Zamiast tego, tak jak wspominaliśmy powyżej, wartość każdego parametru przesyłania zaznaczoną pogrubioną czcionką należy zastąpić odpowiednimi zmiennymi w języku programowania używanym przez system sklepu. Na przykład w języku programowania PHP przesyłanie adresu e-mail mogłoby wyglądać tak:

<span id="tsCheckoutBuyerEmail"><?php echo $customer_email; ?><span>

$customer_email odpowiada adresowi e-mail klienta w systemie sklepu. Dokładną definicję używanej zmiennej należy sprawdzić w dokumentacji systemu sklepu, ponieważ różni się ona w zależności od systemu. Z tego powodu niestety nie możemy podać żadnych uniwersalnych formuł. Gdy odpowiednio zmodyfikujesz powyższy przykładowy kod, możesz go skopiować i wprowadzić do szablonu strony z potwierdzeniem zamówienia zgodnie z opisem.

Krok 5: Przetestuj Trustbadge w swoim sklepie

Możesz teraz przetestować działanie Trustbadge w swoim sklepie poprzez złożenie zamówienia testowego. Pod koniec procesu składania zamówienia sprawdź, czy Trustcard wyświetla się tak, jak pokazano powyżej, aby umożliwić klientom zarejestrowanie się w celu otrzymania zaproszenia do wystawienia opinii jednym kliknięciem przycisku. Jeśli wszystko działa sprawnie, udało Ci się zintegrować Trustbadge. Od teraz Twoi klienci będą mogli zgodzić się na wysyłanie przypomnienia o wystawieniu opinii bezpośrednio po sfinalizowaniu zakupu. Gdy tylko Twój sklep uzyska certyfikat, klienci będą również otrzymywać ofertę Ochrony Kupującego. Sprawdź też w konsoli przeglądarki, czy kontener DIV „trustShopsCheckout” jest teraz całkowicie i poprawnie wypełniony.

Potrzebujesz więcej pomocy przy integracji Trustbadge? Zapraszamy do kontaktu pod adresem members@trustedshops.com lub pod numerem telefonu +48 22 462 64 07.

Oprócz standardowej integracji Trustbadge opisanej w tym samouczku dostępne są również inne warianty w ramach opcji wyświetlania „reviews” i „default”.

Czy ten artykuł był pomocny?

Liczba użytkowników, którzy uważają ten artykuł za przydatny: 7 z 7