Instalacja i konfiguracja - instrukcja do szablonu „Vega Blog 2.0”

Jeśli masz więcej niż jedną domenę podłączoną na jednej instalacji >Web Systems Pro<, upewnij się, że logujesz się do backendu ze strony domeny, na której zainstalowany jest sablon. Na przykład, jeśli używasz "Vega Blog 2.0" na stronie internetowej blog.my-domain.com, należy zalogować się na swoje konto ze strony blog.my-domain.com/wsp-admin/.

Importuj ustawienia między szablonami.

Jeśli masz zainstalowanych kilka szablonów z rodziny „Vega 2.0”, możesz przyspieszyć ich konfigurację, włączając częściowy import parametrów między nimi w sekcji „Ustawienia główne” 🠖 „Inne ustawienia”:

Informacje kontaktowe oraz ustawienia nagłówka i stopki zostaną pobrane z wybranego szablonu, więc nie trzeba będzie ich ponownie wprowadzać. Zakładki, których dotyczy taki import, zostaną oznaczone plakietką Importowane.

Własne style i skrypty.

Swój kod CSS i JavaScript należy umieścić odpowiednio w plikach user.css i user.js. Pliki te nie zostaną przepisane po aktualizacji szablonu. Można je znaleźć w aplikacji „Blog -> Projekt -> Szablony”.

Możesz edytować również inne pliki szablonu, jednak po zainstalowaniu aktualizacji wprowadzone zmiany będą wymagały powtórzenia. Jeśli po wprowadzeniu zmian pojawią się błędy, otwórz zmieniony plik, wybierz „Wyświetl oryginał” i kliknij „Przywróć moje zmiany do oryginalnej wersji pliku”.

Jeśli nadal musisz edytować pliki CSS lub JS szablonu, wyłącz ustawienie „Ustawienia główne” —> „Inne” —> „Zmniejsz rozmiar stylów i skryptów”. Spowoduje to zastąpienie zminimalizowanych plików zwykłymi plikami (theme.css, theme.js), z którymi można pracować. Należy pamiętać, że spowoduje to nieznaczne zwiększenie rozmiaru plików.

Włączanie i wyłączanie panelu ustawień.

Konfigurację wyświetlania panelu można wykonać w backendzie, wybierając szablon graficzny, a następnie zakładkę „Blog” —> „Projekt” —> „Wygląd”.

Panel demonstracyjny może być:

• „Ukryty dla wszystkich”.
• „Widoczny tylko dla administratorów” - wyświetla panel ustawień szablonu, jeśli jesteś zalogowany jako administrator.
• „Widoczny dla wszystkich użytkowników” - wyświetla panel ustawień szablonu dla administratora i panel demonstracyjny dla wszystkich innych użytkowników.

Panel ustawień w interfejsie użytkownika to element zawierający dużą ilość treści. Zajmuje on znacznie więcej miejsca niż sama strona, co spowalnia ładowanie witryny. Po zakończeniu konfiguracji szablonu można wyłączyć panel lub skorzystać z trybu przeglądarki „Incognito”, aby sprawdzić działanie witryny bez niego.

Panel boczny to wygodny sposób konfiguracji szablonu. Wybierz wygląd szablonu i wypełnij treść. Po zakończeniu konfiguracji kliknij „Zapisz” lub użyj kombinacji klawiszy CTRL + S.

Nagłówek strony.

Nagłówek strony zawiera kilka konfigurowalnych szablonów. Niektóre z nich obsługują funkcje aplikacji Shopy-Script (katalog, koszyk, ulubione, porównanie, wyszukiwanie, konto osobiste), a inne są przeznaczone dla prostych stron i landingów.

Nawigacja w nagłówku strony może być wyświetlana bezpośrednio ze stron aplikacji lub może być utworzona za pomocą aplikacji „Zarządzanie menu”. Ponadto w szablonie wbudowany jest generator nawigacji, który umożliwia tworzenie i sortowanie dowolnych linków.

Strona główna aplikacji.

Strona główna szablonu graficznego składa się z bloków - logicznie wyodrębnionych fragmentów witryny. Otwórz ustawienia szablonu, przejdź do zakładki „Strona główna” ➔ „Sortowanie bloków”. Uporządkuj bloki w żądanej kolejności, przeciągając karty z nazwami. Przełączniki pozwalają ukrywać lub wyświetlać bloki.

Blok „Startowy” - blok techniczny, który wita użytkownika i zawiera link do dokumentacji szablonu. Nie ma on własnych ustawień, więc wystarczy go po prostu ukryć.

Aby wybrać odpowiedni blok, można skorzystać z wersji demonstracyjnej szablonu. Otwórz panel demonstracyjny i włącz ustawienie „Pokaż nazwy bloków po najechaniu”.

Bloki można konfigurować bezpośrednio z poziomu interfejsu użytkownika. W tym celu kliknij ikonę „Ołówek” w prawym górnym rogu bloku. Ta opcja jest dostępna tylko dla administratorów:

Obok znajduje się przycisk z ikoną nawiasów. Pozwala on uzyskać kod bloku do wstawienia na inne strony. Więcej informacji można znaleźć w sekcji Instrukcja korzystania z bloków i elementów. W ten sam sposób można zduplikować blok na stronie głównej.

Używaj obrazów w odpowiednich formatach. W przypadku filmów dopuszczalny jest format WebM, a w przypadku obrazów — WebP. Rozmiar plików nie powinien przekraczać 200–300 KB.

Link kotwiczny do bloku.

W szablonie graficznym „Vega Blog 2.0” można używać linków do płynnego przechodzenia do bloków na stronie. Format: #ID_BLOKU. Na przykład #banner przeniesie Cię do bloku „Baner”.

ID bloku jest podane na początku zakładki z jego ustawieniami.

Aby przejść z innej strony, użyj adresu URL w formacie: https://your-domain.com/#banner

Formularz informacji zwrotnej.

Formularz informacji zwrotnej zachęca użytkownika do wypełnienia informacji kontaktowych, które zostaną wysłane na Twój adres email. Elementy formularza:

• Imię — pole obowiązkowe.
• Email — pole opcjonalne, może być wyłączone w ustawieniach.
• Numer telefonu — pole opcjonalne.
• Zgoda na przetwarzanie danych osobowych — pole opcjonalne.
• Captcha — element obowiązkowy, nie można go usunąć, ale można go zastąpić Google reCAPTCHA z trybem niewidocznym.

Aby formularz działał, należy podać adres Email do powiadomień oraz, w razie potrzeby, dodatkowy adres Email. Powiadomienia z witryny będą wysyłane na te adresy. Nadawcą będzie skrzynka pocztowa określona w ustawieniach framworku Web Systems Pro.

Jeśli chcesz zastąpić standardowy formularz, włącz funkcję „Własny kod formularza”. Utwórz blok blog.feedback_form w aplikacji „Witryna” ➔ „Bloki” i dodaj do niego swój kod.

Formularz subskrypcji.

Formularz subskrypcji działa poprzez aplikację „Mailer”. W aplikacji utwórz nową listę i podaj jej ID w ustawieniach szablonu graficznego. ID można znaleźć w pasku adresu przeglądarki. Więcej informacji.

Następnie utwórz nowy formularz i podaj jego ID w ustawieniach szablonu graficznego.

Captcha.

CAPTCHA pomaga odróżnić prawdziwych użytkowników od botów. Możesz zastąpić standardową captcha na Google reCAPTCHA. Aby to zrobić, zarejestruj się w serwisie, przejdź do Admin Console i utwórz reCAPTCHA v2 lub reCAPTCHA v3 dla swojej witryny.

Następnie przejdź do backendu Web Systems Pro „Ustawienia” —> „Captcha” i dodaj otrzymane klucze. Tryb niewidoczny jest dostępny dla wersji v3.

Dodatkowe elementy.

Szablon ma dodatkowe elementy, które są obecne na wszystkich stronach.

Cookie to plik danych, który jest zapisywany na komputerze użytkownika po odwiedzeniu strony internetowej. Web Systems Pro ogólnie i szablon „Vega Blog 2.0” w szczególności używają plików cookie i innych podobnych technologii. Prawodawstwo wielu krajów wymaga od użytkowników uzyskania zgody na przetwarzanie danych osobowych, ponieważ pliki cookie często przechowują informacje o zachowaniu użytkownika, które wchodzą w zakres tej definicji. W tym celu do szablonu dodano element „Polityka plików cookie”.

Użytkownik musi zaakceptować Politykę plików cookie, klikając przycisk na tym elemencie. W takim przypadku okno zostanie wyświetlone tylko raz. Element można dostosować we frontendzie: „Inne” —> „Polityka cookies”.