> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.hoppyapps.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# 📍 Jak ustawić pasek ogłoszeń z niestandardowym położeniem

> ℹ️ **Note:** Ten artykuł został automatycznie przetłumaczony za pomocą AI i może zawierać nieścisłości. Jeśli coś wygląda źle, skontaktuj się z naszym zespołem wsparcia.

Czy chcesz, aby pasek ogłoszeń wyświetlał się w konkretnym miejscu, którego automatyczne pozycjonowanie nie obejmuje? 🎯

**Niestandardowe położenie** daje Ci pełną kontrolę nad tym, gdzie dokładnie wyświetli się pasek — niezależnie od tego, czy ma to być wewnątrz konkretnej sekcji motywu, pod nawigacją, w obszarze opisu produktu, czy gdziekolwiek indziej, gdzie możesz dodać fragment kodu lub blok aplikacji.

Ten przewodnik przeprowadzi Cię przez konfigurację paska ogłoszeń z ręcznym położeniem, aby wyświetlał się dokładnie tam, gdzie chcesz ✨

---

# **✅ Zanim zaczniesz**

Upewnij się, że osadzenie aplikacji **Hoppy Announcement Bars & Banners** jest włączone w Twoim motywie. Nawet przy niestandardowym położeniu osadzenie ładuje wymagane skrypty i style.

**Aby je włączyć:**

1. Przejdź do **Shopify Admin → Sales Channels (Kanały sprzedaży) → Online Store (Sklep internetowy) → Themes (Motywy)**
2. Kliknij **Edit Theme (Edytuj motyw)** w aktywnym motywie
3. W lewym panelu wybierz **App Embeds (Osadzenia aplikacji)**
4. Znajdź **Announcement Bar/Banner (Pasek ogłoszeń/baner)**
5. Przełącz go w pozycję **ON (WŁ.)**
6. Kliknij **Save (Zapisz)**

💡 *Już włączone? Możesz przejść dalej!*

---

# **⚙️ Krok 1 — Utwórz nowe ogłoszenie**

Otwórz aplikację **Hoppy Announcement Bars & Banners** w panelu Shopify Admin.

Na pulpicie kliknij **Create New Announcement (Utwórz nowe ogłoszenie)**.

Zostaniesz przeniesiony na ekran wyboru położenia.

---

# **📌 Krok 2 — Wybierz niestandardową pozycję**

Wśród opcji położenia wybierz **Custom Position (Niestandardowa pozycja)**.

To informuje aplikację, że to Ty — a nie automatyczny iniektor — zdecydujesz, gdzie dokładnie pasek pojawi się w sklepie.

Po wyborze kliknij **Continue (Kontynuuj)**.

---

# **🎨 Krok 3 — Zaprojektuj swój pasek**

Stwórz pasek ogłoszeń tak, jak chcesz:

* Dodaj **tytuł**, **podtytuł** i **CTA** (przycisk wezwania do działania)
* Wybierz **typ ogłoszenia** (Simple, Running, Multiple lub Email)
* Dostosuj wygląd w karcie **Design (Projekt)**

💡 *Szczegółowe wskazówki dotyczące projektowania — w tym szablony, kolory, animacje i własny CSS — znajdziesz w dokumentacji **Design & Styling (Projekt i style)**.*

---

# **📍 Krok 4 — Ustaw Display Position na Manual**

Kliknij kartę **Placement (Położenie)**.

Z rozwijanej listy **Display Position (Pozycja wyświetlania)** wybierz **Manual (Ręczna)**.

Gdy to zrobisz:

* Lista rozwijana **Page Targeting (Targetowanie strony)** zostaje automatycznie wyłączona i ustawiona na **Custom (Niestandardowe)**
* Pasek nie będzie już automatycznie wstrzykiwany na stronę
* Zamiast tego będzie czekać, aż umieścisz go za pomocą fragmentu kodu lub bloku aplikacji

To właśnie sprawia, że niestandardowe położenie działa 🛠️

---

# **📋 Krok 5 — Skopiuj fragment kodu położenia**

Po zapisaniu paska na karcie **Placement (Położenie)** pojawi się kopiowalny fragment kodu:

`\<div class="futureblink-announcement-block" id="{announcementId}"\>\</div\>`

Każde ogłoszenie ma unikalny identyfikator. Fragment kodu informuje aplikację, który pasek ma wyrenderować wewnątrz tego kontenera.

Kliknij przycisk kopiowania, aby zapisać go w schowku 📋

---

# **🧩 Krok 6 — Dodaj fragment kodu do motywu**

Masz dwie możliwości umieszczenia fragmentu:

## **Opcja A — Za pomocą bloku aplikacji (zalecane)**

To najprostsza metoda, która działa z motywami Online Store 2.0.

1. Przejdź do **Shopify Admin → Sales Channels → Online Store → Themes**
2. Kliknij **Edit Theme** w aktywnym motywie
3. Przejdź do strony lub sekcji, w której chcesz umieścić pasek
4. Kliknij **Add Section (Dodaj sekcję)** lub **Add Block (Dodaj blok)**
5. Przejdź do zakładki **Apps (Aplikacje)**
6. Wybierz **Hoppy Announcement Bars & Banners**
7. Wklej swój **Announcement ID (Identyfikator ogłoszenia)** w ustawieniach bloku
8. Przeciągnij blok na wybrane miejsce
9. Kliknij **Save**

## **Opcja B — Za pomocą niestandardowego fragmentu Liquid**

Skorzystaj z tej opcji, jeśli chcesz umieścić pasek w konkretnym pliku Liquid lub motywie innym niż OS 2.0.

1. Przejdź do **Shopify Admin → Sales Channels → Online Store → Themes**
2. Kliknij menu **...** przy aktywnym motywie → **Edit Code (Edytuj kod)**
3. Otwórz plik Liquid, w którym ma się pojawić pasek  
   * Typowe przykłady: `theme.liquid`, `product.liquid`, `header.liquid`
4. Wklej fragment kodu w miejsce, w którym ma być wyrenderowany
5. Kliknij **Save**

⚠️ **Ważne:**

* Wklejaj fragment kodu tylko raz na pasek
* Jeśli ten sam identyfikator pojawi się wielokrotnie na tej samej stronie, pasek może wyrenderować się w każdym pasującym kontenerze
* Upewnij się, że kontener znajduje się wewnątrz znacznika `<body>`, a nie `<head>`

---

# **🚀 Krok 7 — Zapisz i opublikuj**

Wróć do edytora **Hoppy Announcement Bars & Banners** i kliknij **Save**.

Następnie kliknij **Publish (Opublikuj)**, aby wprowadzić go na żywo.

⚠️ **Ważne:** Samo zapisanie nie sprawia, że pasek jest widoczny dla klientów. Musisz kliknąć **Publish**.

Po opublikowaniu odwiedź stronę, na której umieściłeś fragment kodu, aby upewnić się, że pasek pojawia się we właściwym miejscu 👀

---

# **🎯 Kiedy używać niestandardowego położenia**

Niestandardowe położenie jest szczególnie przydatne, gdy:

* Chcesz, aby pasek znajdował się w **konkretnej sekcji motywu**, a nie globalnie u góry lub u dołu
* Układ Twojego motywu koliduje z automatycznym pozycjonowaniem u góry/u dołu
* Wyświetlasz **wiele pasków** i musisz kontrolować, gdzie dokładnie znajduje się każdy z nich
* Chcesz umieścić pasek **w sekcji kreatora stron**, na niestandardowej stronie docelowej lub w konkretnym szablonie produktu
* Chcesz, aby pasek pojawiał się **pomiędzy istniejącymi blokami treści**, a nie nad lub pod nimi

---

# **⚠️ Przydatne wskazówki**

## **Przemieszczanie lub usuwanie paska**

Ponieważ pasek jest przypisany do ręcznego kontenera, możesz:

* Przenosić blok aplikacji lub fragment Liquid w nowe miejsce w dowolnej chwili
* Usunąć blok lub fragment, aby zatrzymać wyświetlanie paska na tej stronie
* Ponownie użyć tego samego fragmentu w wielu szablonach, jeśli jest to potrzebne

## **Łączenie z targetowaniem**

Nawet przy niestandardowym położeniu nadal możesz korzystać z:

* **Scheduling (Harmonogram)** — ustaw daty rozpoczęcia i zakończenia
* **Geolocation (Geolokalizacja)** — pokazuj tylko odwiedzającym z wybranych krajów
* **Customer Targeting (Targetowanie klientów)** — filtruj według statusu logowania, tagów lub całkowitych wydatków
* **UTM Source Filtering (Filtrowanie źródeł UTM)** — pokazuj tylko odwiedzającym z konkretnych źródeł ruchu
* **Time-on-Site Delay (Opóźnienie po czasie na stronie)** — opóźnij pojawienie się paska

💡 *Te opcje konfiguruje się w tej samej karcie **Placement**. Pełne omówienie znajdziesz w dokumentacji **Advanced Targeting (Zaawansowane targetowanie)**.*

## **Niestandardowe położenie w koszyku i kasie**

* Położenia **Cart Page (Strona koszyka)** i **Cart Drawer (Szuflada koszyka)** również obsługują pozycję **Manual**, jeśli chcesz precyzyjnie umieścić pasek wewnątrz obszaru koszyka
* Położenie **Checkout Page (Strona kasy)** *(tylko Shopify Plus)* zamiast fragmentu Liquid używa systemu bloków rozszerzeń interfejsu kasy

---

# **🎉 Efekt końcowy**

Po poprawnej konfiguracji:

✅ Pasek ogłoszeń pojawia się dokładnie w tym miejscu w motywie, w którym go umieściłeś
✅ Respektuje wszystkie aktywne reguły targetowania (harmonogram, geolokalizację, segmenty klientów itd.)
✅ Możesz go w dowolnej chwili przenosić lub usuwać, nie zmieniając treści ani wyglądu paska
✅ Wiele niestandardowych pasków może współistnieć na tej samej stronie w różnych sekcjach
✅ Układ Twojego sklepu pozostaje uporządkowany i przemyślany ✨

---

# **📚 Powiązana dokumentacja**

* **How to Set Up an Announcement Bar (Jak skonfigurować pasek ogłoszeń)** — Pełny przewodnik po tworzeniu i publikowaniu każdego typu paska
* **Design & Styling (Projekt i style)** — Zaawansowana konfiguracja kolorów, czcionek, animacji i własnego CSS
* **Advanced Targeting (Zaawansowane targetowanie)** — Harmonogram, geolokalizacja, tagi klientów, filtrowanie UTM i reguły opóźnienia
* **Announcement Bar Types Explained (Wyjaśnienie typów pasków ogłoszeń)** — Różnice między paskami Simple, Running, Multiple i Email

Udanych umiejscowień! 🥂