Strona na WordPress – Jak zacząć [2/3]
Z poniższego poradnika dowiesz się jak zacząć pracę z WordPressem, o co zadbać na początku, aby nasza praca przebiegała płynniej, bardziej efektywnie.
Zakładam, że domena i hosting jest już wykupiony, WordPress zainstalowany?
Jeżeli nie, to zapraszam do pierwszej części poradnika, link powyżej.
Poradnik będzie oparty o motyw Kadence, który jest jednym z najlepszych motywów ostatnich czasów. Warto go zainstalować na swoim WordPressie.
Strona na WordPress – podstawowe konfiguracje
Podczas tworzenia stron na WordPressie warto przed startem prac skonfigurować wszystkie globalne ustawienia – kolory, czcionki, optymalizacje, menu, panele boczne itd.
Personalizacja
Zaczynając pracę z WordPressem, proponuje najpierw dograć wszystkie drobne rzeczy, aby nie wprowadzać niepotrzebnego chaosu, co w mniejszym lub większym stopniu dla osób początkujących jest nieuniknione. Mimo wszystko, dobre nawyki na początku zaowocują później. Dobra, do rzeczy.
Na starcie musimy przejść do ustawień personalizacji, które znajdziemy po prawej stronie w zakładce „Wygląd”, a następnie „Dostosuj”.
Po naszej lewej stronie pojawi się lista elementów, które możemy dostosować do własnych potrzeb oraz gustów. W związku z tym, że jest to poradnik Strona na WordPress – Jak zacząć, skupimy się na tych elementach łatwiejszych, ponieważ jak mówi przysłowie – lepiej jak najpierw nauczymy się chodzić, zanim zaczniemy biegać.
Publikowanie zmian
Za każdym razem kiedy chcemy wprowadzić zmiany na naszej stronie internetowej za pomocą panelu personalizacji, należy pamiętać o publikacji zmian. Szkoda by było, abyśmy namęczyli się konfigurując wszystkie potrzebne opcje tylko po to, aby je wszystkie stracić. Dlatego też, proszę pamiętać o kliknięciu przycisku „Opublikuj” od czasu do czasu.
Ustawienia globalne
Do tworzenia stron internetowych WordPress użyjemy trzech pierwszych ustawień globalnych motywu Kadence.
- Kolory
- Typografia
- Wydajność (Performance)
Aby dostać się do ustawień poniżej, musimy z głównego menu bocznego przejść do zakładki „General”.
Kolory
Globalne ustawienia dotyczące kolorów, dzięki którym dobierzemy odpowiednie kombinacje kolorów dla całej strony. Kolory możemy również dobierać indywidualnie. Należy jednak uważać, żeby pewne kolory nie pokryły się z kolorem niektórych czcionek.
Tak jak ma to miejsce poniżej, gdzie czcionka nagłówka (tzw. header), elementu u samej góry naszej strony internetowej, pokryły się z wybranym schematem kolorów i są niewidoczne.
Aby wrócić do poprzedniego menu, należy kliknąć na ikonkę strzałki w lewo.
Typografia
Strony internetowe na WordPress mogą mieć dowolnie wybraną czcionkę Google. Musimy jedynie zdecydować, która będzie najbardziej odpowiednia. Możemy sprawdzić jak się będzie prezentować dana czcionka na podglądzie na żywo po prawej stronie.
W motywie Kadence możemy dobierać czcionki dla:
- nagłówków – Heading Font Family H1, H2, H3, tytuły stron
- treści – Base Font, potocznie zwany „body”
Wydajność (Performance)
Ostatnim, banalnym ustawieniem jest wydajność naszej strony internetowej. A o wydajność zawsze należy dbać.
- Ładowanie czcionek Google lokalnie, z naszego serwera
- Ładowanie wstępne dla czcionek i CSS
Ładowanie wstępne wprost z naszego serwera zmniejszy liczbę zapytań wysyłanych przez przeglądarkę, a także przyspieszy wyświetlanie strony, win-win.
Strona na WordPress – dodatkowe konfiguracje
Konfiguracja podstawowa powinna być wykonywana przy każdej nowo tworzonej stronie internetowej. Dla większości stron internetowych będzie wyglądać identycznie.
Są jednak elementy strony internetowej WordPressa, które będą zauważalnie różne dla każdej ze stron.
- Header (nagłówek strony)
- Footer (stopka strony)
- Sidebar (panel boczny)
Header (nagłówek strony)
W nagłówku strony znajdziemy zazwyczaj takie elementy jak:
- Logo
- Menu
- Przyciski, ikonki social media, ikonki koszyka
Aby zmodyfikować nagłówek naszej strony internetowej, musimy zajrzeć do zakładki „Header” z menu bocznego.
Konfigurowanie nagłówka dla motywu Kadence przedstawia się w następujący sposób.
U góry naszej strony internetowej mamy żywy podgląd naszego nagłówka, na dole strony mamy nagłówek w postaci bloczków.
Do ustawień każdego z bloczków prowadzi ikonka zębatki pomiędzy krzyżykiem, a nazwą bloczka.
Logo
Logo naszej strony, zazwyczaj plik graficzny. Jeżeli ktoś nie posiada żadnego loga dla swojej strony internetowej, to warto skorzystać z Google i poszukać logo creator free.
Możemy ustawiać maksymalną szerokość loga korzystając z opcji „Logo Max Width”. Ewentualnie, zamiast loga możemy umieścić Tytuł witryny + Slogan wybierając odpowiedni Logo Layout.
Menu nawigacyjne
W nagłówkach znajdziemy bardzo często menu nawigacyjne, ułatwiające poruszanie się po naszej stronie internetowej. Tworzeniem menu nawigacyjnego zajmiemy się za chwilę.
Dodatkowe elementy w nagłówku
Do nagłówka możemy wrzucić praktycznie wszystko. Popularne są dodatkowe przyciski, ikonki social media, numery telefonów.
Nagłówek w motywie Kadence posiada trzy wiersze możliwe do zapełnienia, do każdego możemy dodać ograniczoną ilość dostępnych elementów.
Sticky Header – przyklejony nagłówek
Motyw Kadence umożliwia opcje przyklejenia nagłówka do górnej krawędzi naszej strony internetowej. W momencie, gdy ktoś będzie przewijał naszą stronę w dół, nagłówek pozostanie cały czas przy górnej krawędzi.
W zależności od urządzenia – komputer, telefon, tablet, na którym ktoś będzie wyświetlał naszą stronę internetową WordPress, możemy zdecydować jaki header zostanie użyty – sticky czy klasyczny, chowający się przy scrollu. Dodatkowo możemy wybrać, który wiersz ma zostać przyklejony i pozostać przy górnej krawędzi.
Footer (stopka strony)
Analogicznie do nagłówka, nasza strona internetowa posiada również stopkę, przy dolnej krawędzi.
Stopka składa się również z bloczków, tzw. widżetów.
Niektóre widżety składają się z pisanego HTML’a, ale bez obaw. Możemy tworzyć widżety przy pomocy bloczków typu „obrazek”+„paragraf”, efekt będzie identyczny.
W stopce mamy nieco większe możliwości konfiguracji jednego z trzech wierszy. Możemy wybrać ilość kolumn, rozkład procentowy kolumn (Layout), kierunek treści, odstępy, wysokość.
Strona na WordPress – dodawanie menu
Kolejnym krokiem w poradniku Strona na WordPress – Jak zacząć jest dodawanie menu. W panelu administracyjnym klikamy na „Wygląd”, a następnie „Menu”.
Nadajemy nazwę, wybieramy lokalizację i potwierdzamy przyciskiem „Utwórz menu”.
Przejdźmy na zakładkę „Zobacz wszystko”, następnie „Wybierz wszystko” lub wybieramy tylko to, co chcemy, aby znalazło się w naszym menu. Potwierdzamy przyciskiem „Dodaj do menu” oraz „Zapisz menu”.
Wszystkie strony, które wybraliśmy pojawią się w naszym menu w nagłówku na naszej stronie internetowej.
Jeżeli chcielibyśmy stworzyć rozwijane podmenu, pod którąś ze stron w menu, należy przesunąć wybrane strony o jeden krok w prawo. Strona, z której będą rozwijać się wybrane strony musi być nadrzędna, jest to pewnego rodzaju hierarchia.
Strony przesuwamy najeżdżając kursorem na stronę, przytrzymując lewy przycisk myszy i przesuwając w prawo.
Sidebar – Panel boczny
Strony internetowe na WordPress posiadają również panel boczny, zwany Sidebar’em. Zazwyczaj znajduje się on w określonych miejscach, nie na każdej stronie. Najczęstszym miejscem są archiwa blogów, czyli strony, na których wyświetlane są posty.
Aby dostać się konfiguracji archiwów, należy z głównego menu kliknąć w zakładke „Blog Posts”, następnie „Archive Layout”.
Jeżeli na podglądzie na żywo po prawej przejdziecie na stronę „Blog”, aby skonfigurować panel boczny, a komuś nie wyświetlają się posty, należy ustawić „Stronę z wpisami”. Z menu głównego wybieramy „Ustawienia strony głównej” i „Blog” jako stronę z wpisami. Nie zapomnijcie „Opublikować” zmian.
Po dostaniu się do konfiguracji archiwów, zauważymy, że layout jest ustawiony jako „NORMAL”. Ten układ nie posiada panelu bocznego, obviously.
Ale pod układem „NORMAL”, znajduje się układ o nazwie „LEFT SIDEBAR”. Po jego wybraniu, nasz układ rozszerzy się o panel boczny.
Jak kontrolować zawartość naszego panelu bocznego? Panel możemy kontrolować wchodząc w menu „Widżety” z menu głównego.
Opcja wyboru personalizacji panelu bocznego „Sidebar 1” pojawi się jedynie, gdy na podglądzie będzie otwarta strona, na której jest widoczny panel boczny, w naszym przypadku jest to strona „Blog”.
W panelu bocznym znajdziemy widżety, które możemy dowolnie wybierać z tych dostępnych w WordPressie.
Wygląd archiwów
Archiwa stron internetowych WordPress możemy globalnie personalizować zaczynając od:
- ilość kolumn
- wyróżnione zdjęcie główne
- kategorii
- tytułów postów
- meta danych, data publikacji, autor
- tzw. zajawek, czyli pierwszych kilku zdań naszych postów
- przycisk czytaj dalej, który przenosi nas do posta
Nawigacja – breadcrumbs / okruszki
Przy okazji jak już jesteśmy przy personalizacji archiwów, mały szczegół, który jest dosyć pomocny w nawigacji dla użytkowników, to okruszki. To nic innego jak określenie dokładnej lokalizacji, w której się aktualnie znajdujemy na stronie internetowej. Mały szczegół, który warto włączyć.
Dla naszych postów również polecam włączenie nawigacji okruszkami.
Strona na WordPress – jak zacząć?
Materiał jest dosyć obszerny, a jeszcze czeka nas praktyczne tworzenie stron internetowych WordPress. Na chwilę obecną poczyniliśmy spore przygotowania do kolejnego kroku.
Mam nadzieję, że poradnik nie jest zawiły, jeżeli coś jest nie jasne, to koniecznie proszę zostawić komentarz.
Zostawcie również ocenę, będę wdzięczny.