ℹ️ 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.

Sekcja Design & Styling daje pełną kontrolę nad wyglądem Konwerter walut na swoim sklepie.

Od stylów flagi i typografii po kolory, granice i preferencje wyświetlania, te ustawienia pomagają stworzyć Konwerter walut, który wydaje się być naturalną częścią sklepu przy jednoczesnym zachowaniu płynnego doświadczenia dla międzynarodowych klientów.

⚠️ Zanim zaczniesz

Aby uzyskać dostęp do ustawień Design & Styling:

→ Otwórz Hoppy Currency Converter

→ Zakończenie procesu pokładowego

→ Otwórz Projekt tab

💡 Wszystkie zmiany projektowe stają się widoczne w sklepie po zapisaniu.

🏳️ Dostosowanie flagi

Ta sekcja kontroluje, jak flagi pojawiają się w całym Konwerter walut.

Zmiany mają zastosowanie do obu:

• Wybrany wyświetlacz waluty
• Lista przeterminowanych walut

🎨 Styl flagi

Kontroluje wizualny wygląd flag.

Tradycyjne

Wyświetla standardowe obrazy flagi bez dodatkowego stylizacji.

Najlepiej dla: Minimalne i profesjonalne sklepy, gdzie chcesz flagi wtopić się naturalnie w projekt.

Nowoczesne

Wyświetla flagi z:

• Zaokrąglone rogi
• Miękkie cienie
• Subtelne granice
• Ulepszone leczenie wzrokowe

Najlepiej dla: Nowoczesne storefonty, które chcą Konwerter walut wyróżniać się jako element premium projektowania.

💡 Wybrany styl dotyczy każdej flagi wyświetlanej przez Konwerter walut.

🔘 Motyw flagi

Kontroluje kształt flag.

Okrągłe

Flagi pojawiają się z delikatnie zaokrąglonymi narożnikami.

Koło

Flagi pojawiają się wewnątrz okrągłego kształtu.

Płaski

Flagi pojawiają się z ostrymi narożnikami i tradycyjnym wyglądem.

Wybrany motyw pomaga określić ogólną osobowość wizualną widgetu.

🔘 Dostosowanie wyboru waluty

Te ustawienia kontrolują wygląd głównego widget Konwerter walut.

🎨 Motyw

Kontroluje ogólny styl wizualny kontener Konwerter walut.

Domyślne

Czysty i prosty wygląd, który miesza się naturalnie w większości Shopify tematy.

Nowoczesna warstwa

Tworzy warstwowy efekt wizualny za widżetem dla dodatkowej głębokości i nacisku.

💡 Efekt Modern Layer automatycznie używa wybranego koloru tła.

👀 Tryb wyświetlania

Kontroluje, jakie informacje pojawiają się w Konwerterze Walutowym.

Pokaż flagę i walutę

Wyświetla zarówno informacje o fladze, jak i walutach.

Pokaż tylko flagę

Wyświetla tylko flagi.

Pokaż tylko walutę

Wyświetla tylko informacje o walutach.

To ustawienie odnosi się zarówno do listy wyboru, jak i listy rozwijanej.

🌓 Motyw koloru

Kontroluje, czy Konwerter walutowy używa światła lub ciemnego wyglądu.

Światło

Używa jasnego tła z ciemniejszym tekstem.

Ciemny

Używa ciemnego tła z jaśniejszym tekstem.

Automatyczne

Automatycznie pasuje do preferencji systemu klienta.

💡 Tryb automatyczny pomaga Konwerter walut dostosować się naturalnie do różnych urządzeń i środowisk przeglądania.

🔤 Wyświetl tylko kody walut

Kontroluje, jak pojawiają się nazwy walut.

Włączone

Wyświetla krótkie kody walutowe.

Przykłady:

• USD
• EUR
• GBP

Wyłączone

Wyświetla pełne nazwy walut i kody.

Przykłady:

• Dolar amerykański (USD)
• EUR (EUR)
• Funt brytyjski (GBP)

Może to przyczynić się do bardziej kompaktowego spadku przy obsłudze wielu walut.

🎨 Dostosowanie motywu

Sekcja ta kontroluje podstawową stylizację Konwerter walut.

📦 Styl graniczny

Kontroluje jak wyświetlana jest granica widżetu.

Pole Cień

Dodaje subtelny cień wokół Konwertera Waluta.

Linia graniczna

Dodaje widoczną granicę wokół widżetu.

Brak granic

Całkowicie usuwa granice i cienie.

Każda opcja tworzy inny wizualny nacisk w zależności od stylu sklepu.

🔤 Rodzina czcionek

Steruje czcionką używaną w całym Konwerterze walutowym.

Użyj czcionki motywu

Pasuje do Twojego Shopify typografia motywu automatycznie.

Czcionki Google

Wybierz jedną z różnych obsługiwanych czcionek.

Przykłady obejmują:

• Roboto
• Otwarte kanały
• Montserrat
• Poppins Przewodniczący

💡 Korzystanie z czcionki motyw zazwyczaj tworzy najbardziej bezproblemowe doświadczenie storefront.

🎨 Kolor tła

Kontroluje kolor tła Konwerter walut.

Możesz:

• Użyj znacznika kolorów
• Wprowadź wartość koloru Hex

Wybierz kolor, który uzupełnia swój sklep jednocześnie pozostając łatwo zidentyfikować.

🖊️ Kolor tekstu

Kontroluje kolor tekstu w całym Konwerter walut.

Obejmuje to:

• Wybrana waluta
• Opcje umorzenia
• Etykiety

Dla najlepszej czytelności, zapewnić wystarczający kontrast między tekstem i kolorami tła.

🖱️ Kolor mouseover

Kontroluje kolor wyświetlany, gdy klienci unoszą się nad opcjami walutowymi.

Pomaga to klientom jasno określić, którą opcję mają wybrać.

Subtelny kontrast z koloru tła zazwyczaj działa najlepiej.

🔽 Kolor ikony rozwijanej

Kontroluje kolor ikony wskaźnika zrzutu.

Dopasowanie tego koloru do koloru tekstu często tworzy najbardziej konsekwentny wygląd.

⚠️ Ważne uwagi

Dark Theme Overrides Niektóre kolory

Podczas używania:

• Ciemny motyw
• Automatyczne Motyw (podczas gdy klient używa trybu ciemnego)

Konwerter walut może używać zoptymalizowanych kolorów w trybie dark- mode zamiast wybranych kolorów tła i tekstu.

Do zaawansowanego dostosowywania trybu ciemności, użyj CSS Custom.

Motyw warstwy wykorzystuje kolor tła

Motyw Modern Layer automatycznie generuje efekt warstwowy za pomocą wybranego koloru tła.

Zmiana koloru tła zmienia również wygląd warstwy.

Tryb wyświetlania ma zastosowanie wszędzie

Wyświetl Ustawienia trybu wpływają na:

• Wybrany wyświetlacz waluty
• Opcje walutowe "Dropdown"

Obie lokalizacje zawsze pozostają zsynchronizowane.

Zmiany czcionek Zastosuj globalnie

Wybrana czcionka ma wpływ na cały tekst Konwerter walut, w tym:

• Wybrana waluta
• Opcje umorzenia
• Wyniki wyszukiwania (w stosownych przypadkach)

Potrzebujesz więcej dostosowania?

Dla zaawansowanych stylizacji poza zakładką Design, użyj:

Zaawansowane → CSS Custom

Pozwala to deweloperom stosować w pełni niestandardowe style do Konwerter walut.

🚀 Wynik końcowy

Po skonfigurowaniu:

✅ Konwerter walut pasuje do marki sklepu

✅ Flagi wyświetlane w preferowanym stylu i kształcie

✅ Kolory i typografia czują się zgodne z tematem

✅ Wybór waluty pozostaje jasny i łatwy w użyciu

✅ Klienci międzynarodowi cieszą się bardziej polerowanym doświadczeniem

✅ Konwerter walut czuje się jak naturalna część sklepu

Dobrze zaprojektowany Konwerter Waluta nie tylko wygląda lepiej - pomaga również stworzyć płynniejsze i bardziej godne zaufania doświadczenie w zakupach dla klientów na całym świecie. 🌍

Aktualizowane na: 10/09/2026