{"id":3097,"date":"2026-02-11T09:01:44","date_gmt":"2026-02-11T08:01:44","guid":{"rendered":"https:\/\/help.zanfia.com\/?post_type=docs&p=3097"},"modified":"2026-02-11T09:01:46","modified_gmt":"2026-02-11T08:01:46","password":"","slug":"jak-dodac-koszyk-zanfia-bezposrednio-na-swoja-strone-css-classes","status":"publish","type":"docs","link":"https:\/\/help.zanfia.com\/pl\/docs\/jak-dodac-koszyk-zanfia-bezposrednio-na-swoja-strone-css-classes\/","title":{"rendered":"Jak doda\u0107 koszyk Zanfia bezpo\u015brednio na swoj\u0105 stron\u0119 (CSS Classes)?"},"content":{"rendered":"\n

Mo\u017cesz umie\u015bci\u0107 koszyk bezpo\u015brednio na swojej stronie sprzeda\u017cowej, bez przekierowywania klient\u00f3w do zewn\u0119trznego linku. Dzi\u0119ki temu ca\u0142y proces zakupowy odbywa si\u0119 w jednym miejscu na Twojej stronie produktu. Proces ten jest obs\u0142ugiwany przez dodanie klas css do przycisku<\/p>\n\n\n

\r\n \ud83d\udca1 Podpowied\u017a:<\/strong> Osadzenie koszyka na stronie zwi\u0119ksza konwersj\u0119, poniewa\u017c klient nie musi opuszcza\u0107 Twojej
\nstrony sprzeda\u017cowej. \r\n <\/div>\n\n\n\n

1. Przejd\u017a do ustawie\u0144 koszyka produktu<\/h2>\n\n\n\n

Przejd\u017a do Produkty<\/strong> \u2192 wybierz produkt \u2192 Integracje<\/strong> \u2192\n Koszyk na stronie<\/strong>.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

2. Znajd\u017a sekcj\u0119 osadzania<\/h2>\n\n\n\n

Znajd\u017a sekcj\u0119 Kod do wstawienia na stron\u0119<\/strong>.
Znajdziesz tam gotowy kod do wklejenia na swoj\u0105 stron\u0119.<\/p>\n\n\n\n

3. Skopiuj kod embed<\/h2>\n\n\n\n

Kliknij przycisk Kopiuj kod<\/em> lub zaznacz ca\u0142y kod i skopiuj go r\u0119cznie.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

4. Dodaj skrypt otwieraj\u0105cy koszyk (overlay)<\/h2>\n\n\n\n

Dodaj skrypt na samym dole swojej strony:<\/p>\n\n\n\n

<script src=\"https:\/\/mailingr.co\/mailingr-checkout-1.0.min.js?productId={id_produktu}&host=https:\/\/mailingr.co\/&overlay=true\"><\/script><\/code><\/pre>\n\n\n\n
Podmie\u0144 {id_produktu}<\/strong> na ID produktu w Zanfii.<\/p>\n\n\n\n
Przyk\u0142ad:<\/p>\n\n\n\n
<script src=\"https:\/\/mailingr.co\/mailingr-checkout-1.0.min.js?productId=prod_NOLi78GFEjUBx3&host=https:\/\/mailingr.co\/&overlay=true\"><\/script>\n\nID produktu znajdziesz tutaj:<\/code><\/pre>\n\n\n\n
\"\"<\/figure>\n\n\n
\r\n          \u26a0\ufe0f Wa\u017cne:<\/strong> Upewnij si\u0119, \u017ce Twoja strona obs\u0142uguje elementy iframe<\/strong>. Wi\u0119kszo\u015b\u0107 platform (WordPress, Webflow, Squarespace) obs\u0142uguje je bez problemu.                                                  \r\n      <\/div>\n\n\n\n
5. Dodaj przycisk, kt\u00f3ry otworzy koszyk na stronie (dla konkretnej ceny)<\/h2>\n\n\n\n
a) Dodaj przycisk na swojej stronie.<\/p>\n\n\n\n
b) Dodaj klasy css mailingr-open<\/strong> oraz mailingr-price__{id_ceny}<\/em><\/strong><\/code><\/pre>\n\n\n\n
Podmie\u0144 {id_ceny} w<\/em> powy\u017cszym kodzie na ID ceny w produkcie w Zanfii, dla kt\u00f3rej ma otworzy\u0107 si\u0119 koszyk.<\/p>\n\n\n\n
Np. dla ceny o ID: price_1M9a4PDr7RQDbP1pXyRcnluc<\/strong><\/p>\n\n\n\n
<a class=\"mailingr-open mailingr-price__price_1M9a4PDr7RQDbP1pXyRcnluc\" href=\"#\">Kup m\u00f3j kurs<\/a><\/code><\/pre>\n\n\n\n
Je\u017celi korzystasz z wizualnych edytor\u00f3w stron (np. Elementor) klasy mo\u017cesz zdefiniowa\u0107 w parametrach przycisku.<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n\n
ID ceny znajdziesz w li\u015bcie cen dla danego produktu.<\/p>\n\n\n\n
\"\"<\/figure>\n\n\n
\r\n          \u26a0\ufe0f Wa\u017cne:<\/strong> Wybrana cena nie mo\u017ce by\u0107 cen\u0105 ukryt\u0105<\/strong>.                                                  \r\n      <\/div>\n\n\n\n
6. Ustal zachowanie po zakupie<\/h2>\n\n\n\n
Domy\u015blnie:<\/p>\n\n\n\n