{"id":857,"date":"2025-08-11T14:31:44","date_gmt":"2025-08-11T14:31:44","guid":{"rendered":"https:\/\/rs.quarticon.com\/wdrozenie-samodzielne-frontend-pwa-npm-api\/"},"modified":"2025-08-12T15:38:11","modified_gmt":"2025-08-12T15:38:11","slug":"wdrozenie-samodzielne-frontend-pwa-npm-api","status":"publish","type":"post","link":"https:\/\/help.quarticon.com\/pl\/wdrozenie-samodzielne-frontend-pwa-npm-api\/","title":{"rendered":"Wdro\u017cenie samodzielne: Frontend PWA &#8211; NPM API"},"content":{"rendered":"<article class='jsx-ef86202475c6562f '>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>W odpowiedzi na oczekiwania naszych klient\u00f3w, dostarczamy rozwi\u0105zanie umo\u017cliwiaj\u0105ce samodzielne wdro\u017cenie <b>Systemu Rekomendacji Quarticon<\/b> w e\u2011sklepie za pomoc\u0105 NPM \u2013 <a href='https:\/\/www.npmjs.com\/' target='_blank' rel='nofollow noopener noreferrer'>https:\/\/www.npmjs.com\/<\/a> (Node Package Manager).<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Paczka ta napisana w JavaScripcie umo\u017cliwia wdro\u017cenie <b>Systemu Rekomendacji Quarticon<\/b> po frontowej stronie aplikacji w bibliotekach, takich jak<b> React, Vue, Angular<\/b> poprzez u\u017cycie ich bezpo\u015brednio w kodzie aplikacji.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Podobnie, jak wdro\u017cenie po API (<a href='https:\/\/docs.quarticon.com\/storeapi\/dokumentacja\/#tag-Recommendation' target='_blank' rel='nofollow noopener noreferrer'>https:\/\/docs.quarticon.com\/storeapi\/dokumentacja\/#tag-Recommendation<\/a>) to rozwi\u0105zanie w ca\u0142o\u015bci odbywa si\u0119 po stronie klienta. R\u00f3\u017cnica jest taka, \u017ce wdro\u017cenie po API z racji niejawnych kluczy dost\u0119powych musi odby\u0107 si\u0119 po stronie backendu.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>Tak, jak pisali\u015bmy wy\u017cej, wdro\u017cenie poprzez paczk\u0119 NPM odbywa si\u0119 po stronie frontowej aplikacji, podczas \u0142adowania widoku strony w aplikacjach opartych o frameworki React, Vue, Angular. <\/b>Oczywi\u015bcie mo\u017cna jej u\u017cy\u0107 r\u00f3wnie\u017c w w innych frameworkach, wa\u017cne, aby wspiera\u0142y one NPM.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Dokumentacja techniczna tej wtyczki, znajduje si\u0119 tutaj:<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><a href='https:\/\/docs.quarticon.com\/quarticTs\/index.html' target='_blank' rel='nofollow noopener noreferrer'>https:\/\/docs.quarticon.com\/quarticTs\/index.html<\/a>.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Sama za\u015b wtyczka znajduje si\u0119 tutaj:<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><a href='https:\/\/www.npmjs.com\/package\/qon-connection' target='_blank' rel='nofollow noopener noreferrer'>https:\/\/www.npmjs.com\/package\/qon-connection<\/a>.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-heading intercom-interblocks-align-left'>\n<h2 id='h_818d1960e3'>Czego potrzebujesz przed rozpocz\u0119ciem wdro\u017cenia<\/h2>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Aby m\u00f3c rozpocz\u0105\u0107 wdro\u017cenie, potrzebujesz <b>przygotowanego konta w systemie Quarticon<\/b>. W tym celu skontaktuj si\u0119 z naszym Dzia\u0142em Sprzeda\u017cy na <a href='mailto:sales@quarticon.com' target='_blank' rel='nofollow noopener noreferrer'>sales@quarticon.com<\/a>.<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Konto musi posiada\u0107:<\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>ustawiony i sprawdzony katalog produktowy<\/b>; wi\u0119cej o przygotowaniu katalogu znajdziesz w artykule <a href='\/implementacja-feeda-xml-do-katalogu-w-panelu-quarticon\/'>Katalog w formie pliku XML<\/a><\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>przygotowane widgety z ustawionymi logikami rekomendacji; <\/b>wi\u0119cej o logikach i strategiach rekomendacji znajdziesz tu<\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><a href='https:\/\/howto.quarticon.com\/pl\/collections\/2380279-silnik-rekomendacji-produktowych#strategie-rekomendacji'>https:\/\/howto.quarticon.com\/pl\/collections\/2380279-silnik-rekomendacji-produktowych#strategie-rekomendacji<\/a> oraz<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><a href='\/strategie-rekomendacji-wprowadzenie\/'>\/strategie-rekomendacji-wprowadzenie\/<\/a><\/p>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Do wst\u0119pnej konfiguracji modu\u0142 <b>qon-connection<\/b> potrzebujesz na pocz\u0105tku dw\u00f3ch zmiennych:<\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><code>CUSTOMER_SYMBOL<\/code> \u2013 ci\u0105g znak\u00f3w identyfikuj\u0105cy Twoje konto w systemie Quarticon<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><code>HOST_URL<\/code> \u2013 adres API, kt\u00f3ry potrzebny jest do wywo\u0142ania wszystkich metod dost\u0119pnych w aplikacji<\/p>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<div class='intercom-interblocks-table'>\n<table>\n<tbody>\n<tr>\n<td>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>CUSTOMER_SYMBOL oraz HOST_URL otrzymasz od swojego opiekuna w QON. Je\u015bli nie posiadasz konta w naszym systemie albo po prostu masz pytania, skontaktuj si\u0119 z <a href='mailto:sales@quarticon.com' target='_blank' rel='nofollow noopener noreferrer'>naszym dzia\u0142em sprzeda\u017cy<\/a>.<\/b><\/p>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div class='intercom-interblocks-heading intercom-interblocks-align-left'>\n<h2 id='h_44ef7cf4eb'>G\u0142\u00f3wne za\u0142o\u017cenia wymagane do prawid\u0142owego dzia\u0142ania Systemu Rekomendacji Quarticon<\/h2>\n<\/div>\n<div class='intercom-interblocks-ordered-nested-list'>\n<ol>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>Katalog produkt\u00f3w jest niezb\u0119dny do tego, aby wy\u015bwietla\u0107 rekomendacje<\/b>. Domy\u015blnie katalog od\u015bwie\u017cany jest co 24h (najcz\u0119\u015bciej wykorzystywanym katalogiem jest ten w formacie XML zgodny z Google Merchant).<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Przekazywane do nas <b>ID produkt\u00f3w<\/b> <b>musz\u0105 by\u0107 zgodne z tymi w katalogu produkt\u00f3w.<\/b><\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Aby system uczy\u0142 si\u0119, potrzebujemy informacji dotycz\u0105cych <b>wszystkich <\/b>zachowa\u0144 u\u017cytkownika:<\/p>\n<\/div>\n<div class='intercom-interblocks-ordered-nested-list'>\n<ol>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>wy\u015bwietlenia karty produktu (proces implementacji opisany <a href='#h_0c07c40ea2'>ni\u017cej<\/a>)<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>klikni\u0119cia w nasze ramki rekomendacyjne (w przypadku korzystania z naszych link\u00f3w proces zadzieje si\u0119 automatycznie)<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>produkty zakupione przez klienta (proces implementacji opisany <a href='#h_0c07c40ea2'>ni\u017cej<\/a>)<\/p>\n<\/div>\n<\/li>\n<\/ol>\n<\/div>\n<\/li>\n<\/ol>\n<\/div>\n<div class='intercom-interblocks-heading intercom-interblocks-align-left'>\n<h2 id='h_0b00a59f71'> Przyk\u0142adowa \u015bcie\u017cka zachowania u\u017cytkownika na stronie sklepu<\/h2>\n<\/div>\n<div class='intercom-interblocks-ordered-nested-list'>\n<ol>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>U\u017cytkownik wchodzi na stron\u0119 g\u0142\u00f3wn\u0105<\/p>\n<\/div>\n<div class='intercom-interblocks-ordered-nested-list'>\n<ol>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>na stronie g\u0142\u00f3wnej u\u017cytkownik widzi ramk\u0119 rekomendacyjn\u0105 pod tytu\u0142em np. <i>Wybrane dla Ciebie<\/i><\/p>\n<\/div>\n<\/li>\n<\/ol>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>U\u017cytkownik wchodzi na kart\u0119 produktu<\/p>\n<\/div>\n<div class='intercom-interblocks-ordered-nested-list'>\n<ol>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>do systemu QON zostaje wys\u0142ana informacja o wy\u015bwietleniu produktu<\/p>\n<\/div>\n<\/li>\n<\/ol>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>U\u017cytkownik klika w ramk\u0119 rekomendacji QON wy\u015bwietlaj\u0105c\u0105 produkty podobne<\/p>\n<\/div>\n<div class='intercom-interblocks-ordered-nested-list'>\n<ol>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>do systemu QON zostaje wys\u0142ana informacja o klikni\u0119ciu w produkt<\/p>\n<\/div>\n<\/li>\n<\/ol>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>U\u017cytkownik dodaje do koszyka produkt klikni\u0119ty z ramki QON<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>U\u017cytkownik dokonuje zakupu tego produktu<\/p>\n<\/div>\n<div class='intercom-interblocks-ordered-nested-list'>\n<ol>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>System QON dostaje informacj\u0119 o dokonanej transakcji<\/p>\n<\/div>\n<\/li>\n<\/ol>\n<\/div>\n<\/li>\n<\/ol>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>W przypadku, gdy zakup zosta\u0142 dokonany po klikni\u0119ciu w ramk\u0119 rekomendacji, produkt ten zostanie potraktowany jako zakup dzi\u0119ki QON. <b>Ka\u017cdy zakup dokonany w ci\u0105gu 24h od momentu klikni\u0119cia jest traktowany jako zakup z rekomendacji.<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-heading intercom-interblocks-align-left'>\n<h2 id='h_0c07c40ea2'>Proces implementacji krok po kroku<\/h2>\n<\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_da17417450'>A. Przygotuj widgety rekomendacyjne<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>O tym, jakie rekomendacje sprawdz\u0105 si\u0119 na jakich podstronach, poczytasz w artykule <a href='\/strategie-rekomendacji-wprowadzenie\/'>Strategie rekomendacji. Wprowadzenie<\/a>. Opis poszczeg\u00f3lnych strategii znajdziesz z kolei w sekcji <a href='https:\/\/howto.quarticon.com\/pl\/collections\/2380279-silnik-rekomendacji-produktowych#strategie-rekomendacji'>Strategie rekomendacji<\/a>.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Aby doda\u0107 nowy widget rekomendacji nale\u017cy przej\u015b\u0107 do zak\u0142adki <b>Rekomendacje <\/b>i<i> <\/i>wybra\u0107 przycisk <b><i>Dodaj widget<\/i><\/b><i>.<\/i> Zostaniesz przekierowany do edytora, kt\u00f3ry sk\u0142ada si\u0119 z czterech etap\u00f3w:<\/p>\n<\/div>\n<div class='intercom-interblocks-ordered-nested-list'>\n<ol>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><a href='#h_5bcc1a7f28'>Wskazanie miejsca dla rekomendacji w sklepie<\/a><\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><a href='#h_c7d3ec470d'>Wybranie strategii rekomendacji produkt\u00f3w<\/a><\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><a href='#h_77dd67e2a5'>Kreator drag&#038;drop<\/a><\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><a href='#h_1f9a6047bd'>Podsumowanie<\/a><\/p>\n<\/div>\n<\/li>\n<\/ol>\n<\/div>\n<div class='intercom-interblocks-image intercom-interblocks-align-left'><a href='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/88442585\/9c62c4582113a9a3efd259c9\/image.png' target='_blank' rel='noreferrer nofollow noopener'><img src='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/88442585\/9c62c4582113a9a3efd259c9\/image.png'><\/a><\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_5bcc1a7f28'>1. Wska\u017c miejsce dla rekomendacji w sklepie<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Struktura miejsc dla widget\u00f3w jest wst\u0119pnie zdefiniowana przez nasz system i wygl\u0105da nast\u0119puj\u0105co:<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-image intercom-interblocks-align-center'><a href='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522643278\/a9f69722c8d0f9376cd74ece\/5b5f370a-f948-4d9f-898c-e4f0e3fee77a.png' target='_blank' rel='noreferrer nofollow noopener'><img src='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522643278\/a9f69722c8d0f9376cd74ece\/5b5f370a-f948-4d9f-898c-e4f0e3fee77a.png' alt='Wska\u017c miejsce dla rekomendacji w sklepie' width='973' height='437'><\/a><\/div>\n<div class='intercom-interblocks-table'>\n<table>\n<tbody>\n<tr>\n<td>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Powy\u017cszy uk\u0142ad zosta\u0142 przez nas opracowany na bazie wieloletnich do\u015bwiadcze\u0144 z klientami i sprawdzonych przez nas metod. Miejsca widget\u00f3w mog\u0105 zosta\u0107 zmodyfikowane przez u\u017cytkownika, jednak zalecamy, aby od pocz\u0105tku zarz\u0105dzania rekomendacjami trzyma\u0107 si\u0119 okre\u015blonej hierarchii wyznaczonych miejsc rekomendacji.<\/p>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Nazwy stron i miejsc na stronach oznaczaj\u0105 wst\u0119pnie zak\u0142adan\u0105 pozycj\u0119, w kt\u00f3rej zostanie wywo\u0142any widget rekomendacji. Przyk\u0142adowo, je\u017celi Twoim celem jest dodanie widgetu na karcie produktu pod kr\u00f3tkim opisem produktu, ale przed sekcj\u0105 dodatkowych informacji o produkcie, zalecamy wykorzystanie placementu <i>STRONA PRODUKTU <\/i>-&gt;<i> Middle<\/i>.<\/p>\n<\/div>\n<div class='intercom-interblocks-table'>\n<table>\n<tbody>\n<tr>\n<td>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_243bce98a5'>Uwaga! <\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>W ramach jednego placementu mo\u017cesz zdefiniowa\u0107 wiele widget\u00f3w rekomendacji. Spowoduje to losowe wybieranie widget\u00f3w przy ka\u017cdorazowym wywo\u0142aniu placementu, do kt\u00f3rego s\u0105 przypi\u0119te. W zak\u0142adce <i>Wska\u017c miejsce dla rekomendacji w sklepie <\/i>nale\u017cy wybra\u0107 miejsce w zdefiniowanej strukturze, w kt\u00f3rym dany widget ma si\u0119 pojawi\u0107.<\/p>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_c7d3ec470d'>2. Wyb\u00f3r strategii rekomendacji<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>W kolejnej zak\u0142adce <i>Wybierz strategi\u0119 rekomendacji produktu<\/i> dost\u0119pnych jest 12 predefiniowanych strategii rekomendacji. Po najechaniu kursorem na strategi\u0119, pojawi si\u0119 jej kr\u00f3tki opis. Wybierz jedn\u0105 z nich i zdecyduj, jakie produkty maj\u0105 zosta\u0107 wy\u015bwietlone u\u017cytkownikowi. <br \/>\u200b<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Poni\u017cej przedstawiamy nasze best practice strategii rekomendacji:<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-image intercom-interblocks-align-center'><a href='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522644455\/515ad0d67f9dc8e3629e7ec9\/bb3762f6-63a5-4c31-95aa-353c64c7d7c7.png' target='_blank' rel='noreferrer nofollow noopener'><img src='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522644455\/515ad0d67f9dc8e3629e7ec9\/bb3762f6-63a5-4c31-95aa-353c64c7d7c7.png' alt='Best practice dotycz\u0105ce umieszczania ramek rekomendacji' width='485' height='751'><\/a><\/div>\n<div class='intercom-interblocks-table'>\n<table>\n<tbody>\n<tr>\n<td>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_ea9422fd1f'>Pami\u0119taj!<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Opisane praktyki nie musz\u0105 sprawdzi\u0107 si\u0119 u ka\u017cdego klienta, poniewa\u017c ka\u017cda bran\u017ca rz\u0105dzi si\u0119 swoimi prawami i mo\u017ce okaza\u0107 si\u0119, \u017ce zoptymalizowanie dzia\u0142ania silnika rekomendacji w Twoim sklepie wymaga przetestowania innych ustawie\u0144. Powy\u017cszy schemat jest jedynie propozycj\u0105, jeste\u015bmy otwarci na Twoje sugestie.<\/p>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_77dd67e2a5'>3. Kreator drag&#038;drop<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>W przypadku wdro\u017cenia poprzez NPM, kreator nie b\u0119dzie wykorzystywany, gdy\u017c to Ty decydujesz o wygl\u0105dzie swoich rekomendacji. Nazwij sw\u00f3j widget tak, aby wiedzie\u0107 gdzie on si\u0119 znajduje i przejd\u017a do kolejnego etapu, klikaj\u0105c <b><i>Dalej<\/i>.<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_1f9a6047bd'>4. Podsumowanie<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Sprawd\u017a podsumowanie i zapisz widget.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-image intercom-interblocks-align-center'><a href='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522645953\/4c3c0ad28ac6abb92f6007ad\/97064283-854a-407d-bd2b-051f08b5ed16.png' target='_blank' rel='noreferrer nofollow noopener'><img src='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522645953\/4c3c0ad28ac6abb92f6007ad\/97064283-854a-407d-bd2b-051f08b5ed16.png' alt='Podsumowanie ustawie\u0144 ramek rekomendacji' width='1247' height='452'><\/a><\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Powy\u017csze cztery kroki powt\u00f3rz dla wszystkich widget\u00f3w, kt\u00f3re chcesz zamie\u015bci\u0107 na swojej stronie. Widgety mo\u017cna edytowa\u0107, przesuwa\u0107, deaktywowa\u0107 itp. Wi\u0119cej szczeg\u00f3\u0142\u00f3w na temat ich edycji znajdziesz w artykule <a href='\/kreator-widgetow\/'>Kreator widget\u00f3w<\/a>.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_b15b7e7da0'>B. Zaimplementuj wysy\u0142anie informacji o odwiedzinach karty produktu<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Zgodnie z instrukcj\u0105 paczki (<a href='https:\/\/www.npmjs.com\/package\/qon-connection' target='_blank' rel='nofollow noopener noreferrer'>https:\/\/www.npmjs.com\/package\/qon-connection<\/a>), zaimplementuj kod.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>Informacja o odwiedzeniu strony powinna zosta\u0107 do nas wys\u0142ana, gdy u\u017cytkownik odwiedzi kart\u0119 produktu.<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Utw\u00f3rz instancj\u0119 paczki, stosuj\u0105c otrzymane od nas <b>CUSTOMER_SYMBOL <\/b>I <b>HOST_URL:<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>const CUSTOMER_SYMBOL = 'YOUR_CUSTOMER_SYMBOL'<br>const HOST_URL = 'YOUR_HOST_URL'<br><br>const CUSTOMER_CONFIGURATION = new Config.Config({ customerSymbol: CUSTOMER_SYMBOL, host: HOST_URl})<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Przeka\u017c obiekt z id produktu, jak poni\u017cej:<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>const productTracker = new Track.Tracker(CUSTOMER_CONFIGURATION)<br>productTracker.sendProductView({ id:'PRODUCT_ID' })<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Przyk\u0142ad u\u017cycia w kodzie VUE:<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>export default Vue.extend({<br> name: 'demopage1',<br> data(): DataParams {<br> return {<br> hostUrl: 'quartic.test',<br> customerSymbol: 'twojcustomerSymbol',',<br> customerConfiguration: new Config.Config({ customerSymbol: 'this.customerSymbol', host: 'this.hostUrl' }),<br> productViewId: '115310',<br> }<br> },<br> mounted() {<br> this.sendProductPageView()<br> },<br> methods: {<br> sendProductPageView() {<br> const tracker = new Track.Tracker(this.customerConfiguration)<br> tracker.sendProductView({ id: this.productViewId })<br> },<br> },<br>})<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_9da8477b34'>C. Zaimplementuj wysy\u0142anie informacji o zakupach<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Wy\u015blij nam informacje o tym, jakie produkty zakupi\u0142 u\u017cytkownik Twojego sklepu.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>Wa\u017cne, aby wysy\u0142a\u0107 do systemu Quarticon wszystkie transakcje. Nasz system na podstawie klikni\u0119\u0107 w nasze rekomendacje, sam oznaczy zakupione produkty, jako te <i>z naszych rekomendacji<\/i>. Transakcj\u0119 wy\u015blij na stronie tzw. Podsumowania\/ Podzi\u0119kowania za transakcj\u0119 (Thank You Page).<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Tak jak wcze\u015bniej, utw\u00f3rz instancj\u0119 aplikacji:<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>const CUSTOMER_SYMBOL = 'YOUR_CUSTOMER_SYMBOL'<br>const HOST_URL = 'YOUR_HOST_URL'<br><br>const CUSTOMER_CONFIGURATION = new Config.Config({ customerSymbol: CUSTOMER_SYMBOL, host: HOST_URl})<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Nast\u0119pnie przygotuj informacje o zakupionych produktach (przyk\u0142ad dla 2 produkt\u00f3w):<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>const transaction = {<br> transactionId: 'ID_TRANSAKCJI',<br> basket: [{<br> productId: 'ID_PRODUKTU_1',<br> price: 'CENA_PRODUKTU_1',<br> quantity: 'ILOSC_PRODUKTU_1'<br> }, {<br> productId: 'ID_PRODUKTU_2',<br> price: 'CENA_PRODUKTU_2',<br> quantity: 'ILOSC_PRODUKTU_2'<br> }]<br>}<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Pami\u0119taj, aby <b>productId<\/b> przekazywane w transakcji pokrywa\u0142o si\u0119 z tym, jakie przekazywane jest w katalogu produktowym.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Wy\u015blij transakcj\u0119:<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>\/\/ configure tracker<br>const transactionTracker = new Tracker(CUSTOMER_CONFIGURATION)<br>\/\/ send transaction<br>transactionTracker.sendTransaction(transaction)<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Przyk\u0142ad u\u017cycia VUE:<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>export default Vue.extend({<br> name: 'demopage1',<br> data(): DataParams {<br> return {<br> hostUrl: 'quartic.test',<br> customerSymbol: 'twojcustomerSymbol', ',<br> customerConfiguration: new Config.Config({ customerSymbol: 'this.customerSymbol', host: 'this.hostUrl' }),<br> }<br> },<br> mounted() {<br> this.sendProductPageView()<br> },<br> methods: {<br><br> sendTransaction() {<br> const transactionTracker = new Track.Tracker(this.customerConfiguration)<br><br> const transaction = {<br> transactionId: 'ID_TRANSAKCJI',<br> basket: [{<br> productId: 'ID_PRODUKTU_1',<br> price: 'CENA_PRODUKTU_1',<br> quantity: 'ILOSC_PRODUKTU_1'<br> }, {<br> productId: 'ID_PRODUKTU_2',<br> price: 'CENA_PRODUKTU_2',<br> quantity: 'ILOSC_PRODUKTU_2'<br> }]<br> }<br> transactionTracker.sendTransaction(transaction)<br> },<br> },<br>})<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_9ee47264ca'>D. Zaimplementuj ramki rekomendacji na swojej stronie<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Aby rozpocz\u0105\u0107 proces samej implementacji, musisz wybra\u0107 widget do implementacji i posiada\u0107 jego <b>placementID.<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>PlacementId to nasz unikalny identyfikator widgetu. Znajdziesz go przechodz\u0105c do zak\u0142adki <b>Rekomendacje -&gt;<\/b> <b>Widgety <\/b>(<a href='https:\/\/cp.quarticon.com\/upseller\/myPlacements' target='_blank' rel='nofollow noopener noreferrer'>https:\/\/cp.quarticon.com\/upseller\/myPlacements<\/a>). <\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Proces implementacji opiszemy na przyk\u0142adzie <b>widgetu <i>Wybrane dla Ciebie<\/i><\/b> na stronie g\u0142\u00f3wnej:<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-image intercom-interblocks-align-center'><a href='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522655545\/52219f61009ea15432814a6f\/d84f0d0f-5140-46d9-9c9d-0f6605bd98c7.png' target='_blank' rel='noreferrer nofollow noopener'><img src='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522655545\/52219f61009ea15432814a6f\/d84f0d0f-5140-46d9-9c9d-0f6605bd98c7.png' alt='widget Wybrane dla Ciebie na stronie g\u0142\u00f3wnej' width='1255' height='649'><\/a><\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Kolorem zaznaczyli\u015bmy jego placementId \u2013 to w\u0142a\u015bnie jego potrzebujemy do implementacji. Nasz placementId to: <b><i>_qS_2tj3o. <\/i><\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Widget umie\u015bcimy na stronie g\u0142\u00f3wnej, zatem nie b\u0119dziemy u\u017cywa\u0107 dost\u0119pnych w paczce opcji filtrowania (wi\u0119cej o dost\u0119pnych mo\u017cliwo\u015bciach znajdziesz <a href='https:\/\/docs.quarticon.com\/quarticTs\/index.html' target='_blank' rel='nofollow noopener noreferrer'>tutaj<\/a>). <\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Tak, jak wcze\u015bniej, tworzymy instancj\u0119 aplikacji:<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>const CUSTOMER_SYMBOL = 'YOUR_CUSTOMER_SYMBOL'<br>const HOST_URL = 'YOUR_HOST_URL'<br><br>const CUSTOMER_CONFIGURATION = new Config.Config({ customerSymbol: CUSTOMER_SYMBOL, host: HOST_URl})<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>a nast\u0119pnie instancj\u0119 silnika rekomendacji, przekazuj\u0105c <code>CUSTOMER_CONFIGURATION<\/code>:<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>const recommendationEngine = new Recommendation.Recommendation(CUSTOMER_CONFIGURATION )<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Teraz przygotujemy konfiguracj\u0119 samego widgetu:<\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>const homePageWidget1= {<br> placementId: '_qS_2tj3o',\/\/ tu u\u017cyli\u015bmy naszego placementId<br> filters: []<br>}<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Poniewa\u017c nie filtrujemy ramki, przekazujemy pust\u0105 tablic\u0119.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Teraz nale\u017cy wywo\u0142a\u0107 silnik, kt\u00f3ry zwr\u00f3ci nam produkty. Nale\u017cy zwr\u00f3ci\u0107 uwag\u0119, \u017ce jest to funkcja asynchroniczna, wymagaj\u0105c u\u017cycia <code>await<\/code>. <\/p>\n<\/div>\n<div class='intercom-interblocks-code'>\n<pre>const homePageRecomendations = await recommendationEngine.getRecommendation(homePageWidget1)<br><br>constole.log (homePageRecomendations)<\/pre>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>U\u017cyty tu console.log wy\u015bwietli nam produkty rekomendowane dla u\u017cytkownika. Teraz wystarczy, \u017ce produkty te zostan\u0105 opakowane w html i umieszczone na stronie. Nasze API w odpowiedzi zwraca zestaw danych o produkcie:<\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>_id \u2013 identyfikator produktu<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>_pageUrl \u2013 link do produktu z kodem trackuj\u0105cym Quarticon<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>_imageUrl \u2013 link do zdj\u0119cia produktu<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>_price \u2013 aktualna cena produktu (pobrana z wgranego do Quarticon katalogu produktu)<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>_priceOld \u2013 stara cena produktu (pobrana z wgranego do Quarticon katalogu produktu)<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>_title \u2013 nazwa produktu<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>_custom.name \u2013 nazwa dodatkowego pola produktu<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>_custom.value \u2013 warto\u015b\u0107 dodatkowego pola produktu<\/p>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<div class='intercom-interblocks-table'>\n<table>\n<tbody>\n<tr>\n<td>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>Pami\u0119taj!<\/b> Tworz\u0105c ramk\u0119 rekomendacji w oparciu o zwracane dane, koniecznie jako link do danego produktu wstaw _pageUrl znajduj\u0105cy si\u0119 w odpowiedzi. Inaczej system rekomendacji nie b\u0119dzie rejestrowa\u0142 klikni\u0119\u0107 w ramk\u0119 i \u2013 tym samym \u2013 raportowa\u0142 ich skuteczno\u015bci w panelu oraz uczy\u0142 algorytm\u00f3w AI, a to ma wp\u0142yw na jako\u015b\u0107 i skuteczno\u015b\u0107 prowadzonych przez Ciebie dzia\u0142a\u0144!<\/p>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div class='intercom-interblocks-image intercom-interblocks-align-center'><a href='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522657887\/7ba05a75dc05ba3df9aa21da\/cd2fece5-4290-4237-90bb-9572888dcb72.png' target='_blank' rel='noreferrer nofollow noopener'><img src='https:\/\/cdn.quartic.com.pl\/howtoimg\/i\/o\/522657887\/7ba05a75dc05ba3df9aa21da\/cd2fece5-4290-4237-90bb-9572888dcb72.png' alt='Wybrane dla Ciebie, przyk\u0142ad 2' width='1057' height='514'><\/a><\/div>\n<div class='intercom-interblocks-table'>\n<table>\n<tbody>\n<tr>\n<td>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Pami\u0119taj, \u017ce integruj\u0105c si\u0119 poprzez paczk\u0119 NPM, to, jak b\u0119d\u0105 wygl\u0105da\u0142y wigdety, <b>zale\u017cy od Ciebie<\/b>. Mo\u017cesz zdecydowa\u0107, aby ka\u017cdy widget wygl\u0105da\u0142 inaczej lub, odwzorowuj\u0105c swoje widgety na stronie, odwzorowa\u0107 je w taki spos\u00f3b, \u017ce nie b\u0119d\u0105 niczym r\u00f3\u017cni\u0142y si\u0119 od natywnych widget\u00f3w znajduj\u0105cych si\u0119 na stronie. Tytu\u0142y Twoich ramek r\u00f3wnie\u017c zale\u017c\u0105 od Ciebie, dlatego wdra\u017caj\u0105c si\u0119 w ten spos\u00f3b, <b>masz najwi\u0119ksz\u0105 swobod\u0119 podczas wdro\u017cenia<\/b>.<\/p>\n<\/div>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div class='intercom-interblocks-subheading intercom-interblocks-align-left'>\n<h3 id='h_447d7af9f6'>E. Zaimplementuj ramki rekomendacji na pozosta\u0142ych stronach<\/h3>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>Spos\u00f3b implementacji na innych stronach jest taki sam, jak w powy\u017cszym przyk\u0142adzie.<\/p>\n<\/div>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>R\u00f3\u017cnice s\u0105 natomiast w u\u017cytym filtrowaniu. Rekomendujemy poni\u017cszy spos\u00f3b implementacji:<\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>Strona kategorii, podkategorii, marki<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>przeka\u017c do konfiguracji widgetu Filtr kategorii:<\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><code>filters: [Recommendation.FilterApi.category('idkategorii')]<\/code> \u2013 aby zaw\u0119zi\u0107 wy\u015bwietlane produkty do jednej kategorii<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><code>filters: [Recommendation.FilterApi.category('idkategorii1'), Recommendation.FilterApi.category('idkategorii2')]<\/code> \u2013 aby zaw\u0119zi\u0107 wy\u015bwietlane produkty do wi\u0119cej ni\u017c jednej kategorii<\/p>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>Strona produktu, koszyka<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p>przeka\u017c do konfiguracji widgetu ID ogl\u0105danego produktu\/produkt\u00f3w, kt\u00f3re znajduj\u0105 si\u0119 w koszyku<\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><code>filters: [Recommendation.FilterApi.product('ID _PRODUKTU_OGLADANEGO')]<\/code> \u2013 przyk\u0142ad dla strony produktu<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><code>filters: [Recommendation.FilterApi.product('ID _PRODUKTU_W_KOSZYKU1)'), Recommendation.FilterApi.product('ID _PRODUKTU_W_KOSZYKU2')]<\/code> \u2013 przyk\u0142ad dla koszyka i dw\u00f3ch produkt\u00f3w<\/p>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><b>Opcjonalnie mo\u017cesz doda\u0107 filtr ceny:<\/b><\/p>\n<\/div>\n<div class='intercom-interblocks-unordered-nested-list'>\n<ul>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><code>Recommendation.FilterApi.minPrice('30')<\/code> \u2013 np. je\u015bli chcesz wy\u015bwietla\u0107 produkty nie ta\u0144sze ni\u017c 30<\/p>\n<\/div>\n<\/li>\n<li>\n<div class='intercom-interblocks-paragraph no-margin intercom-interblocks-align-left'>\n<p><code>Recommendation.FilterApi.maxPrice('70')<\/code> \u2013 np. je\u015bli chcesz wy\u015bwietli\u0107 produkty nie dro\u017csze ni\u017c 70<\/p>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/li>\n<\/ul>\n<\/div>\n<\/article>\n","protected":false},"excerpt":{"rendered":"<p>W odpowiedzi na oczekiwania naszych klient\u00f3w, dostarczamy rozwi\u0105zanie umo\u017cliwiaj\u0105ce samodzielne wdro\u017cenie Systemu Rekomendacji QuarticOn w e\u2011sklepie za pomoc\u0105 <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[],"class_list":["post-857","post","type-post","status-publish","format-standard","hentry","category-rekomendacje"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/posts\/857","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/comments?post=857"}],"version-history":[{"count":6,"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/posts\/857\/revisions"}],"predecessor-version":[{"id":2342,"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/posts\/857\/revisions\/2342"}],"wp:attachment":[{"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/media?parent=857"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/categories?post=857"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/help.quarticon.com\/pl\/wp-json\/wp\/v2\/tags?post=857"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}