Jak wykonać kopię skórki, by edytować pliki HTML (.TPL)?

Ostatnia aktualizacja: 17 maja 2024

W tym artykule opisujemy w jaki sposób wykonać kopię skórki graficznej, by możliwym była edycja plików .TPL (HTML). Edycja plików .TPL umożliwia zmianę struktury skórki, dodanie dodatkowych znaczników HTML, skryptów JavaScript.

Jak skopiować skórę graficzną do edycji plików TPL w sklepie internetowym Shoper?

Zaloguj się do Panelu administracyjnego sklepu.
Przejdź do: Wygląd i treści (A) > Wygląd sklepu (B) > Bieżąca skórka (C), a następnie kliknij opcję: Utwórz kopię (D) zlokalizowaną pod słowem: Więcej w prawym górnym rogu.
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Obecny szablon graficzny > Więcej > Kopia
Rys 1. Skopiuj obecny szablon graficzny sklepu Shoper, by móc edytować pliki TPL.
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Obecny szablon graficzny > Więcej > Kopia
Rys 1. Skopiuj obecny szablon graficzny sklepu Shoper, by móc edytować pliki TPL.
Po utworzeniu kopii znajdziesz się automatycznie w jej edycji. Wprowadź nazwę stylu (A) i ewentualnie ustaw kopię jako domyślną skórę sklepu, klikając opcję: Aktywny w sklepie (B) po rozwinięciu menu Więcej. W skopiowanym szablonie pojawią się dwie dodatkowe zakładki: Pliki graficzne (C) i Edycja zaawansowana (D).
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Kopia szablonu graficznego
Rys 2. Po utworzeniu kopii szablonu możesz ustawić ją jako aktywną i przejść do zakładek: Pliki graficzne i Edycja zaawansowana.
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Kopia szablonu graficznego
Rys 2. Po utworzeniu kopii szablonu możesz ustawić ją jako aktywną i przejść do zakładek: Pliki graficzne i Edycja zaawansowana.
W zakładce: Pliki graficzne (A) można dodawać własne pliki na serwer (B). Zdjęcie pojawi się poniżej przycisku dodawania zdjęć (C), a po najechaniu na nie można wyświetlić Informacje o zdjęciu (D).
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Kopia szablonu > Pliki graficzne
Rys 3. Dodaj zdjęcie i wyślij je na serwer sklepu Shoper.
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Kopia szablonu > Pliki graficzne
Rys 3. Dodaj zdjęcie i wyślij je na serwer sklepu Shoper.

Po kliknięciu ikony Informacje o pliku pojawi się okienko o jego zawartości. Znajdziesz tam między innymi adres do pliku CSS.

Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Kopia szablonu > Pliki graficzne > Ścieżka CSS
Rys 4. W informacjach o zdjęciu znajdziesz ścieżkę CSS do pliku graficznego na serwerze.
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Kopia szablonu > Pliki graficzne > Ścieżka CSS
Rys 4. W informacjach o zdjęciu znajdziesz ścieżkę CSS do pliku graficznego na serwerze.
Przechodząc do zakładki: Edycja zaawansowana (A) można edytować pliki: tpl oraz user.css, gdzie należy wprowadzać własne style CSS. Aby przejść do edycji wystarczy wybrać odpowiedni plik i po rozwinięciu menu akcji, kliknąć opcję: Edytuj (B).
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Kopia szablonu > Edycja zaawansowana
Rys 5. W zakładce: Edycja zaawansowana znajdziesz listę plików, w których możesz wprowadzić własne style CSS.
Panel administracyjny sklepu > Wygląd i treści > Wygląd sklepu > Kopia szablonu > Edycja zaawansowana
Rys 5. W zakładce: Edycja zaawansowana znajdziesz listę plików, w których możesz wprowadzić własne style CSS.

Wideo: jak zmienić wygląd sklepu Shoper?

Zagadnienie konfiguracji wyglądu sklepu omówiliśmy w naszym wideoporadniku na kanale YouTube.

Wideo poradnik: zmiana koloru przewodniego, tła, fontu i innych elementów skórki

Zadbaj o nowoczesny i profesjonalny wygląd swojej strony, który przyciągnie więcej klientów. Zobacz gotowe szablony graficzne w Shoper.

Warto zapamiętać!
W powyższym artykule zostało wyjaśnione:
  • Jak wykonać kopię skórki graficznej strony sklepu internetowego?
  • Wideo poradnik: jak poprawnie zmienić wygląd szablonu graficznego na platformie Shoper?
Udostępnij artykuł:

Przetestuj sklep internetowy
przez 14 dni za darmo

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

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