Ustawienia szablonu JetTheme
Ustawienia szablonu JetTheme
Jeśli zastanawiasz się jak skonfigurować szablon JetTheme, tutaj podamy szczegółowe informacje na temat zalecanych ustawień pod względem wyglądu, układu i SEO.
Jeśli jeszcze go nie zainstalowałeś, kliknij tutaj, aby dowiedzieć się, jak go zainstalować.
Zalecamy użycie pliku xml o nazwie jettheme-v2.min.xml którego kod został zoptymalizowany, ale jeśli chcesz mieć większe możliwości modyfikacji szablonu możesz zainstalować jettheme-v2.xml.
Ustawienia logo i favikony
W sekcji Układ/Logo podaj link do obrazu, ktory wybierasz na swoje logo.Logo wyświetlane jest w lewym górnym rogu Twojego bloga.
Obraz logo w schemacie SEO
<Variable name="logo" description="Logo" type="string" value="wklej link logo"/>Wprowadź adres URL obrazu logo swojego bloga, przechodząc do sekcji Motyw/edytuj kod HTML,
znajdz kod podany wyżej i w sekcji
znajdz kod podany wyżej i w sekcji
value="wklej link logo"/>
Jego funkcją jest uzupełnienie danych w schemacie SEO.
Zalecany rozmiar logo to: 175 x 55 px
W przypadku favikony możesz przesłać ją w sekcji Ustawienia > Favikona
<Variable name="favicon" description="Favicon" type="string" value="wklej link favikony"/>Wprowadź adres URL obrazu favikony, przechodząc do sekcji Motyw/edytuj kod HTML,
znajdz kod podany wyżej i w sekcji
znajdz kod podany wyżej i w sekcji
value="wklej link favikony"/>
Ustawienia menu nawigacji
Aby stworzyć zozwijaną listę w menu wstawiaj pozycje, które mają być rozwijane między znaczniki #sub-start a #sub-end.
Przykład:
Kategorie - (po kliknięciu na kategorie rozwinie się lista)
#sub-start
1
2
3
#sub-end
Ustawienia strony mapy witryny
Utwórz nową stronę, którą możesz nazwać np. spis treści czy też mapa witryny, a następnie wprowadź poniższy kod do posta w trybie HTML.
<div class="custom-posts sitemap-posts" data-label="false" data-func="sitemap_temp" data-callback="sitemap_cb" data-items="1"><div class='text-center'><div class='spinner-grow text-light' role='status'><span class='visually-hidden'>Loading...</span></div></div></div>Po wejściu na stronę mapa witryny zobaczysz rozwijane menu sortowane według kategorii/tagów, ktore dodajesz do swoich postów.
Ustawienia strony kontakt
Utwórz nową stronę, którą możesz nazwać np. kontakt, a następnie wprowadź poniższy kod do posta w trybie HTML. Link do utworzonej strony kontakt zmień w menu nawigacyjnym w sekcji Kontakt.
<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: left;"><br /></div><div class="separator" style="clear: both; text-align: left;"><svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-mail"></use></svg> <a href="mailto:adkomtel@gmail.com">Wyślij E-mail</a></div><div class="separator" style="clear: both; text-align: left;"><svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-telegram"></use></svg> <a href="https://t.me/fairtemplatespro">Telegram</a></div><div class="separator" style="clear: both; text-align: left;"><svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-facebook"></use></svg> <a href="https://m.facebook.com/groups/1623807868098686/">Facebook</a></div></div>
Proponowany kontakt w powyższym kodzie obejmuje wysyłanie wiadomości e-mail (automatyczne uruchamianie aplikacji e-mail po kliknięciu), kontakt przez Telegram, kontakt przez Facebook. Każda opcja kontaktu oznaczona jest przez logo w postaci ikony SVG oraz tekst.
E-mail - zamień adres email na własny w podanym wyżej kodzie, w sekcji :
mailto:adkomtel@gmail.com">Wyślij E-mail ,
możesz też zmienić wyświetlany tekst za adresem email na własny.
Telegram - zmień link na własny w podanym wyżej kodzie, w sekcji :
<a href="https://t.me/fairtemplatespro">
<a href="https://m.facebook.com/groups/1623807868098686/">Ustawienia motywu przez edycję kodu HTML
Ustawienia JetTheme v.2.9 w motywie HTML nie są już wymagane, wystarczy zainstalować i używać konfiguracji Bloggera, a motyw JetTheme będzie działał dobrze.
Jeśli nadal widzisz taki kod ##### w tytule, oznacza to, że używasz starszej wersji motywu. Zdecydowanie zalecamy uaktualnienie motywu JetTheme. Nie pozbywamy się tych funkcji, ale zmieniamy je, aby były jeszcze łatwiejsze do znalezienia i zarządzania nawet jeśli nie rozumiesz kodu, tutaj wyjaśnimy jak z nich korzystać, więc przejdź do strony Motyw/Edytuj kod HTML Gdy otworzysz Edytuj kod HTML, zobaczysz tekst podobny do poniższego.
-------------------------
# JetTheme v.2.8 Setting #
-------------------------Tuż pod nim znajdziesz funkcję ustawień JetTheme, wystarczy zwrócić uwagę na opis, żeby się nie mylił i wypełnić sekcję value=" ", oto wyjaśnienie:
Tagi w nazwie bloga
<Variable name="tagline" description="Tagline" type="string" value=""/>wypełnij value=" " hasłem tytułu, (tagi, słowa kluczowe, które pojawią się za nazwą Twojego bloga) ma to również na celu poprawę SEO, przykładowy tytuł strony głównej: "Blogger Szablony Premium – do pobrania za darmo", więc wpisujesz tylko "do pobrania za darmo" czyli to co ma się pojawić za tytułem bloga po "-"
Separator tytułu
<Variable name="separator" description="Separator" type="string" value=" - "/>W tej sekcji możesz zmienić znacznik, który będzie oddzielał nazwę Twojego bloga od dodatkowego opisu
"Blogger Szablony Premium – do pobrania za darmo",
value=" - "/>Dodatkowy opis bloga
<Variable name="description" description="Description" type="string" value=""/>value="zamieść tu tekst opisujący Twojego bloga"/>Okladka strony głównej
<Variable name="cover" description="Cover" type="string" value=""/>W sekcji value=""/> dodaj link do zdjęcia, które będzie okładką Twojego bloga. Zdjęcie bedzie widoczne podczas udostępniania strony głównej w mediach społecznościowych.
Google Analytics
<Variable name="analyticId" description="Analytic ID" type="string" value=""/>Jest to alternatywny sposób wprowadzania kodu identyfikacyjnego Google Analytics, możesz go zignorować, jeśli wypełniłeś identyfikator analityczny w ustawieniach Bloggera, ale różnica polega na tym, że możesz również korzystać z najnowszej wersji Google Analytics.
<Variable name="analyticId" description="Analytic ID" type="string" value="G-AXXXXXXXXX"/>Google Adsense
<Variable name="caPubAdsense" description="caPubAdsense ID" type="string" value=""/>Możesz to zignorować, jeśli aktywowałeś Adsense na Bloggerze, jest to tylko alternatywa dla Twojego Adsense z innym e-mailem od Twojego blogera, możesz wypełnić go identyfikatorem caPubAdsense, który możesz uzyskać w swoim skrypcie Adsense. Po lewej stronie menu strony Adsense kliknij Reklamy/reklamy wybierz Przegląd/Przegląd, po wejściu na stronę Przegląd kliknij Uzyskaj kod/Pobierz kod, otrzymasz kod podobny do poniższego
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890XXXXXX
crossorigin="anonymous"></script>Skopiuj zaznaczony na zielono identyfikator i wprowadź go, jak pokazano poniżej.
<Variable name="caPubAdsense" description="caPubAdsense ID" type="string" value="1234567890XXXXXX"/>Ikony SVG i przyciski
Globalne ikony
Szablon JetTheme zawiera również gotowe do użycia 29 ikon svg i 6 wzorów przycisków. Poniżej zobaczysz jak wyglądają i jak z nich korzystać.
Kody ikon svg i przyciski dodaj do postów w trybie "Widok HTML"
Whatsapp
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-whatsapp"/></svg>Pinterest
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-pinterest"/></svg>Tumblr
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-tumblr"/></svg>Twitter
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-twitter"/></svg>Linkedin
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-linkedin"/></svg>Facebook
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-facebook"/></svg>Instagram
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-instagram"/></svg>YouTube
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-youtube"/></svg>Telegram
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-telegram"/></svg>GitHub
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-github"/></svg>Strzałka w górę
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-arrow-t"/></svg>Strzałka w dół
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-arrow-b"/></svg>Strzałka w prawo
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-arrow-r"/></svg>Strzałka w lewo
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-arrow-l"/></svg>Użytkownik
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-user"/></svg>Zegar
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-clock"/></svg>Komentarz
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-comment"/></svg>Menu
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-menu"/></svg>E-mail
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-mail"/></svg>Ołówek
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-edit"/></svg>Zamknij
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-close"/></svg>Szukaj
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-search"/></svg>Zaznacz
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-check"/></svg>Pobierz
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-download"/></svg>Księżyc
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-moon"/></svg>Słońce
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-sun"/></svg>Telefon
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-phone"/></svg>Wiadomość
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-news"/></svg>Oko
<svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-eye"/></svg>Przyciski
<a class="btn jt-btn-primary mb-2 me-2" href="tu wstaw link">tu wstaw tekst</a>Ikonę SVG na przycisku możesz zmieniać edytując #i-download zmieniajac na np. #i-user , spójrz wyżej na kody ikon.
<a class="btn jt-btn-primary mb-2 me-2" href="tu wstaw link"><svg aria-hidden="true" class="jt-icon"><use xlink:href="#i-download"/></svg> tu wstaw tekst</a><a class="btn btn-sm jt-btn-primary mb-2 me-2" href="tu wstaw link">tu wstaw tekst</a><a class="btn rounded-pill jt-btn-primary mb-2 me-2" href="tu wstaw link">tu wstaw tekst</a><a class="btn btn-lg jt-btn-primary mb-2 me-2" href="tu wstaw link">tu wstaw tekst</a><a class="btn jt-btn-outline-primary mb-2 me-2" href="tu wstaw link">tu wstaw tekst</a>Jeśli nadal masz pytania dotyczące JettTeme.
Możesz napisać w komentarzu pod postem.
Źródło:
