Data publikacji: 21 sierpnia 2024 Aktualizacja: 23 czerwca 2026

Storefront: Edycja i dodawanie stylów CSS

Dowiedz się jak edytować istniejące w szablonie style CSS oraz tworzyć klasy dla nowo dodanych elementów.

Jak przypisać klasę CSS do elementu w szablonie Storefront?

Zaloguj się do panelu administracyjnego sklepu, a następnie:

Przejdź do zakładki: Wygląd i treści > Wygląd sklepu > Edycja szablonu graficznego.

W poprzedniej wersji panelu: Wygląd i treści > Wygląd sklepu > Obecny szablon graficzny

Miejsce edycji aktywnego szablonu używanego w sklepie
Aktualnie wyświetlany szablon dla klientów sklepu

Kliknij: Edytuj układ i styl szablonu.

Przycisk uruchamiający edytor szablonu
Przycisk uruchamiający edytor szablonu

Przejdź do edycji wybranego elementu szablonu (sekcji, wiersza, kolumny, modułu) i w sekcji: CSS znajdziesz pole, w którym możesz wpisać nazwę klasy. Kliknij: ZAPISZ w ustawieniach elementu, aby zachować zmiany.

Nazwę klasy wpisz bez kropki na początku. Możesz dodać kilka klas jednocześnie, oddzielając je spacjami.

Shoper VIsual Editor > Edycja elementu > Nadawanie klasy CSS
Rys 2. Wprowadź nazwę klasy CSS bez kropki i zapisz zmiany
Shoper VIsual Editor > Edycja elementu > Nadawanie klasy CSS
Rys 2. Wprowadź nazwę klasy CSS bez kropki i zapisz zmiany

Jak edytować style CSS danego elementu szablonu?

Zaloguj się do panelu administracyjnego sklepu, a następnie:

Przejdź do zakładki: Wygląd i treści > Wygląd sklepu > Edycja szablonu graficznego.

W poprzedniej wersji panelu: Wygląd i treści > Wygląd sklepu > Obecny szablon graficzny

Miejsce edycji aktywnego szablonu używanego w sklepie
Aktualnie wyświetlany szablon dla klientów sklepu

W zakładce: Własny styl CSS wprowadź regułę CSS odnoszącą się do danego elementu i kliknij: Zapisz.
Miejsce w którym możesz wpisać własny styl CSS w sklepie Shoper
Miejsce w którym możesz wpisać własny styl CSS w sklepie Shoper
Miejsce w którym możesz wpisać własny styl CSS w sklepie Shoper
Miejsce w którym możesz wpisać własny styl CSS w sklepie Shoper

Jeśli chcesz edytować style istniejącego w szablonie elementu musisz samodzielnie sprawdzić, jaka klasa CSS jest do niego przypisana. Każda przeglądarka internetowa posiada „tryb inspekcji” i to tam możesz zweryfikować nazwę klasy.

Warto zapamiętać!
W powyższym artykule zostało wyjaśnione:
  • W jaki sposób nadać klasę CSS danemu elementowi w szablonie Storefront?
  • Gdzie można wprowadzić parametry reguły CSS dla elementów szablonu?
Czy ten artykuł był pomocny?
Tak
Nie
Dziękujemy za odpowiedź!
Udostępnij artykuł:

Przetestuj sklep internetowy
przez 14 dni za darmo

Korzystaj ze wszystkich funkcji oprogramowania za darmo i bez zobowiązań.

Dane kontaktowe

Testuj wszystkie funkcje przez 14 dni bez zobowiązań. Zakładając sklep poprzez podanie
adresu e-mail akceptujesz nasz Regulamin i Politykę Prywatności