Jeśli blog ma być czymś więcej niż dodatkiem do strony, pojedynczy wpis nie może wyglądać jak przypadkowa strona z domyślnym układem WordPressa.
W Divi 5 szablon wpisu budujesz w Theme Builderze. Dzięki temu nie ustawiasz osobno każdego artykułu, tylko tworzysz jeden układ dla typu Single Post, a Divi automatycznie podmienia treść, tytuł, obrazek wyróżniający, autora, datę i resztę danych dla każdego wpisu. To dokładnie ten przypadek użycia, do którego Theme Builder został przewidziany, obok nagłówka, stopki i innych szablonów powtarzalnych treści.
W tym poradniku budujesz prosty, czytelny szablon wpisu blogowego od zera. Bez wtyczek, bez kombinowania z osobnym layoutem dla każdego artykułu i bez ręcznego przepisywania tych samych elementów w kółko.
Zanim zaczniesz
Zanim wejdziesz do buildera, dobrze mieć przygotowane trzy rzeczy:
-
kilka prawdziwych wpisów testowych z tytułem, treścią i obrazkiem wyróżniającym,
-
ustawione kategorie i autora,
-
ogólny pomysł, czy wpis ma być prosty i czytelny, czy bardziej „magazynowy”.
To ważne, bo szablon single posta ma sens dopiero wtedy, gdy naprawdę korzysta z danych dynamicznych: tytułu wpisu, featured image, metadanych i treści artykułu. Właśnie taki układ jest już zarysowany w Twoim obecnym wpisie o blogu w Divi 5.
Krok 1 — otwórz Theme Builder
W panelu WordPress przejdź do:
Divi → Theme Builder
Jeśli masz już globalny układ strony, zobaczysz listę szablonów. Theme Builder w Divi 5 służy właśnie do budowania szablonów dla powtarzalnych elementów i typów treści, takich jak header, footer, pojedynczy wpis, archiwum kategorii czy wyniki wyszukiwania.
Kliknij:
Add New Template
Następnie wybierz warunek dla:
All Posts
To oznacza, że każdy zwykły wpis blogowy będzie korzystał z tego samego szablonu.
Krok 2 — dodaj Body i zacznij od zera
W nowym szablonie kliknij:
Add Custom Body
i wybierz budowanie od zera.
To ważne: tutaj nie budujesz treści jednego wpisu, tylko ramę, do której Divi będzie podstawiał dane z każdego artykułu. W praktyce to ta sama logika, która przewija się już u Ciebie przy nagłówku i innych elementach tworzonych w Theme Builderze: budujesz strukturę raz, a potem zarządzasz nią centralnie.
Krok 3 — zbuduj górę wpisu: tytuł, meta i obrazek
Najprostszy i najbezpieczniejszy układ na start to trzy sekcje:
-
sekcja nagłówkowa wpisu,
-
sekcja z właściwą treścią,
-
sekcja kończąca, np. z autorem albo CTA.
W pierwszej sekcji dodaj jeden wiersz i zacznij od:
-
Heading Module dla tytułu,
-
Text Module dla metadanych,
-
Image Module dla obrazka wyróżniającego.
Do każdego z tych elementów podepnij dane dynamiczne:
-
tytuł wpisu,
-
data publikacji,
-
autor,
-
kategoria,
-
featured image.
W Twoim obecnym wpisie o blogu dokładnie te elementy są wymienione jako typowy header pojedynczego wpisu: tytuł artykułu, featured image i meta informacje pobierane z pól dynamicznych.
Na tym etapie nie komplikuj layoutu. Najpierw sprawdź, czy dane podpinają się poprawnie.
Krok 4 — dodaj moduł z treścią wpisu
To jest najważniejszy element całego szablonu.
Dodaj nową sekcję albo nowy wiersz pod headerem i wstaw moduł odpowiedzialny za wyświetlanie właściwej treści posta. Ten fragment musi pobierać zawartość konkretnego wpisu dynamicznie — inaczej zamiast szablonu zrobisz zwykłą stronę.
W praktyce to tutaj kończy się „projektowanie”, a zaczyna sensowna praca z dynamicznym contentem. Wpis o blogu na Webfluxie dobrze to sugeruje: pojedynczy wpis działa dlatego, że układ jest stały, a dane zmieniają się automatycznie dla każdego artykułu.
Najlepiej zostawić tej sekcji trochę powietrza:
-
sensowną szerokość tekstu,
-
dobry line-height,
-
większy odstęp pod nagłówkiem niż między zwykłymi sekcjami.
To właśnie tutaj użytkownik spędza najwięcej czasu.
Krok 5 — nie przesadzaj z metadanymi
Na starcie kuszące jest wrzucenie wszystkiego:
-
autora,
-
daty,
-
kategorii,
-
czasu czytania,
-
tagów,
-
breadcrumbs,
-
social share,
-
bio autora,
-
related posts,
-
komentarzy.
Da się, ale nie trzeba od razu.
W obecnym wpisie o blogu zwracasz uwagę, że przy archiwach i blogu trzeba podejmować decyzje o tym, co rzeczywiście jest potrzebne użytkownikowi. Ta sama zasada działa przy single poście: im prostszy pierwszy layout, tym łatwiej go później sensownie rozwijać.
Na wersję 1.0 naprawdę wystarczy:
-
tytuł,
-
meta,
-
obrazek,
-
treść.
Resztę można dołożyć później.
Krok 6 — dodaj sekcję kończącą wpis
Po treści warto dodać prosty dół artykułu. Najczęściej dobrze działa jedna z trzech opcji:
Opcja 1: krótki box autora
Dobre, jeśli blog ma osobisty charakter.
Opcja 2: CTA do kontaktu lub usługi
Dobre, jeśli blog wspiera sprzedaż i ma prowadzić dalej.
Opcja 3: link do kolejnych artykułów
Dobre, jeśli chcesz wydłużać ścieżkę czytania.
To nie dubluje archiwum bloga — raczej domyka pojedynczy wpis i pomaga użytkownikowi nie kończyć wizyty na końcu tekstu. Na poziomie struktury całej sekcji /divi/ dobrze wpisuje się to w Wasz styl: budować rzeczy praktycznie i z myślą o realnym użyciu, a nie tylko o samym „żeby było”.
Krok 7 — zapisz szablon i sprawdź kilka wpisów, nie jeden
Po zapisaniu szablonu nie oceniaj go na podstawie jednego idealnego artykułu testowego.
Sprawdź od razu:
-
długi wpis,
-
krótki wpis,
-
wpis bez dobrego obrazka,
-
wpis z dłuższym tytułem,
-
wpis w innej kategorii.
To ważne, bo Theme Builder ma działać globalnie i dobrze znosić różne przypadki, a nie tylko jeden dopracowany przykład. Ta logika przewija się już w Twoich tekstach o Theme Builderze i o myśleniu systemowym w Divi 5: najpierw budujesz system, potem dopiero pojedyncze strony i treści.
Krok 8 — dopiero potem rozbudowuj szablon
Kiedy podstawowy single post działa, możesz dołożyć kolejne elementy:
-
box autora,
-
sekcję „czytaj dalej”,
-
powiązane wpisy,
-
komentarze,
-
CTA,
-
breadcrumbs.
Ale dopiero wtedy, gdy masz pewność, że fundament jest dobry.
W przeciwnym razie kończysz z sytuacją, w której szablon robi dużo rzeczy naraz, ale żadnej naprawdę dobrze. To dokładnie ten sam problem, który pojawia się przy zbyt wczesnym wchodzeniu w bardziej złożone funkcje Divi 5 zamiast najpierw ogarnąć prostą strukturę.
Najczęstszy błąd przy budowie single posta w Divi 5
Najczęstszy błąd nie polega na złym module.
Polega na tym, że ktoś buduje pojedynczy wpis jak zwykłą stronę:
-
ręcznie wpisuje tytuł,
-
ręcznie wstawia obrazek,
-
układa treść „na sztywno”,
-
a potem próbuje to kopiować do kolejnych artykułów.
Wtedy cały sens Theme Buildera znika. A przecież jego rola w Divi 5 jest dokładnie odwrotna: zdefiniować szablon raz i używać go automatycznie w wielu miejscach serwisu.
Jak powinien wyglądać dobry pierwszy szablon wpisu
Dobry pierwszy single post w Divi 5 nie musi być efektowny. Ma być:
-
czytelny,
-
spójny z resztą strony,
-
oparty o dane dynamiczne,
-
łatwy do rozwijania.
