Jak korzystać z modułu treści postów w Divi Theme Builder?

Opublikowany: 2019-11-01

Moduł Post Content to specjalny moduł dostępny podczas tworzenia układu obszaru ciała dla szablonu w Divi Theme Builder. Zrozumienie, czym jest moduł treści posta i jak z niego korzystać, będzie niezwykle pomocne podczas projektowania niestandardowych szablonów za pomocą Divi Theme Builder.

W tym samouczku omówimy, jak działa moduł treści posta i jak najlepiej go używać podczas projektowania szablonów w Divi.

Zanurzmy się!

Subskrybuj nasz kanał YouTube

O module zawartości postów Divi

Moduł treści Divi Post

Podstawową funkcją modułu treści posta jest wyświetlanie (i stylizacja) treści postu lub strony w ramach danego szablonu posta lub strony. Moduł jest przeznaczony wyłącznie do pracy z Theme Builder, więc nie będzie dostępny przy użyciu Divi Builder do edycji zwykłej strony lub postu.

W Theme Builder moduł Post Content tworzy obszar dla Divi Builder, który ma być używany w obszarze treści szablonu Theme Builder. Może być również używany do wyświetlania i stylizowania treści postów lub stron utworzonych za pomocą domyślnego edytora WordPress. Dzięki temu doskonale nadaje się do tworzenia szablonów postów na blogu.

Moduł można dodać do układu obszaru ciała dowolnego szablonu przy użyciu normalnego procesu dodawania nowego modułu w Divi. Wystarczy kliknąć ikonę dodawania modułu i wybrać z listy moduł treści posta.

Moduł treści Divi Post

Spowoduje to wyświetlenie modalnego ustawienia treści posta, które zawiera wszystkie dostępne opcje projektowania, aby dodać domyślne elementy stylu, które mają być dziedziczone przez posty lub strony przypisane do szablonu.

Moduł treści Divi Post

Treść makiety jest po to, aby dać nam pomocną wizualizację tego, jak te elementy będą wyglądać na aktywnej stronie lub poście.

Teraz, gdy mamy krótkie wprowadzenie do modułu treści postów, przyjrzyjmy się, jak możemy go użyć na naszej własnej witrynie Divi.

Korzystanie z modułu treści postów dla szablonów postów

Korzystanie z modułu treści posta do wyświetlania treści posta utworzonych za pomocą klasycznego lub domyślnego edytora (nie Divi)

Bardzo praktycznym zastosowaniem modułu treści postów jest użycie modułu do dodawania stylów do treści postów w szablonie w celu opublikowania treści, które zostały utworzone za pomocą domyślnego edytora postów WordPress (bez korzystania z Divi Builder).

Na przykład możemy stworzyć nowy szablon przypisany do wszystkich postów na naszej stronie Divi.

Moduł treści Divi Post

Następnie użyj Edytora układu szablonu, aby zaprojektować szablon postu na blogu, korzystając ze statycznych elementów projektu i zawartości dynamicznej.

Zidentyfikuj obszar szablonu, w którym chcesz wyświetlić rzeczywistą treść posta z jednego posta. Następnie dodaj moduł Treść posta do układu szablonu.

Moduł treści Divi Post

Następnie otwórz ustawienia modułu treści wpisu, aby dodać styl, który chcesz zastosować do dowolnej treści wpisu dodanej do nowego lub istniejącego wpisu w Twojej witrynie. Moduł Post Content ma wbudowaną mock content z różnymi elementami, które można stylizować. Ta pozorowana treść zostanie zastąpiona rzeczywistą treścią posta podczas przeglądania posta w witrynie.

Moduł treści Divi Post

Po dodaniu modułu treści posta do szablonu ze stylami dodanymi do ustawień modułu postów szablon posta jest gotowy do użycia w naszych postach na blogu w aktywnej witrynie.

Możemy stworzyć nowy post lub edytować i istniejący post za pomocą domyślnego edytora lub klasycznego edytora w WordPressie.

Jeśli użyjemy edytora klasycznego, każda treść dodana do pola treści za pomocą edytora wysiwyg wypełni obszar szablonu stylizowany przez moduł Post Content.

Moduł treści Divi Post

Jeśli użyjemy domyślnego edytora WordPress (lub edytora bloków), każda treść, którą zbudujemy za pomocą edytora bloków, wypełni (i odziedziczy styl) obszar modułu Post Content w szablonie.

Moduł treści Divi Post

Blogerzy, którzy wolą edytor domyślny/klasyczny, nie będą musieli się martwić o stylizowanie treści, ponieważ odziedziczy on styl, który został ustawiony w module treści posta w szablonie. Dzięki temu pisarze mogą bardziej skoncentrować się na rzeczywistej treści. Dodatkowo szablon posta będzie miał dodatkowy projekt i dynamiczną zawartość otaczającą treść posta, aby uzupełnić ogólny projekt posta.

Oto spojrzenie na backend próbnego posta zbudowanego za pomocą domyślnego/klasycznego edytora.

Moduł treści Divi Post

Oto ten sam post, gdy oglądasz go z przodu.

Moduł treści Divi Post

Oprócz projektu i zawartości dynamicznej, która istnieje w szablonie, zwróć uwagę na stylizację treści posta za pomocą szablonu

Moduł treści Divi Post

Korzystanie z modułu treści postów do wyświetlania treści postów zbudowanych z Divi.

Używając szablonu postu do postów na blogu, możemy zdecydować się na użycie kreatora Divi do zaprojektowania jednego lub więcej naszych postów na blogu zamiast korzystania z domyślnego edytora. Da nam to większą kontrolę nad projektem każdego elementu treści posta, w przeciwieństwie do zwykłego korzystania z domyślnego edytora i stylizacji modułu treści posta w szablonie.

Pamiętaj, że nawet jeśli do zaprojektowania posta używamy Divi Buildera, całkowita przestrzeń projektu treści posta będzie zawarta w obszarze wyznaczonym przez moduł treści posta w szablonie posta.

Moduł treści Divi Post

Aby uzyskać więcej informacji, zapoznaj się z naszą dokumentacją dotyczącą tworzenia szablonu postu na blogu dla całej witryny.

Korzystanie z modułu treści posta dla szablonów stron

Pomimo nazwy, moduł Post Content może być używany zarówno do postów, jak i stron. Tak więc, jeśli chcielibyśmy stworzyć szablon treści dla jednej lub więcej stron w naszej witrynie, musielibyśmy użyć modułu treści posta, aby upewnić się, że treść strony jest wyświetlana.

W większości przypadków tworzenie szablonu treści dla jednej lub większej liczby stron jest niepotrzebne, ponieważ każda strona zwykle składa się z unikalnej zawartości statycznej, która jest budowana na podstawie strony po stronie. Może się jednak zdarzyć, że szablon treści przyda się również w przypadku stron. Może to być pomocne przy dodawaniu projektu na poziomie szablonu i treści, które chcemy automatycznie wyświetlać na stronach.

Na przykład możemy chcieć uwzględnić ten sam projekt tytułu strony dla wszystkich stron w naszej witrynie. Lub możemy chcieć dołączyć CTA, takie jak e-mail Optin, na dole wszystkich (lub niektórych) naszych stron.

Oto przykład, jak to działa na stronie internetowej.

Najpierw przejdź do Divi Theme Builder i utwórz nowy szablon. Następnie przypisz szablon do wszystkich stron i dodaj niestandardowy obszar treści do szablonu. Następnie kliknij, aby edytować niestandardowy obszar ciała.

Moduł treści Divi Post

W Edytorze układu szablonu użyj Divi Builder, aby zaprojektować sekcję tytułu strony za pomocą zawartości dynamicznej. Sugerujemy użycie modułu tekstowego i pobranie elementu treści dynamicznej Tytuł postu/archiwum dla treści treści modułu tekstowego. Tytuł posta/archiwum również wyświetli tytuły stron.

Moduł treści Divi Post

Następnie utwórz nową sekcję dla modułu treści posta. Ponownie jest to konieczne, ponieważ bez modułu treści posta szablon nie będzie wyświetlał żadnej indywidualnej treści ani projektu strony.

Ponieważ ten moduł treści posta będzie kontenerem nadrzędnym dla treści naszej strony, dobrym pomysłem jest umożliwienie modułowi treści postu rozciąganie się na całą szerokość strony. Zawsze możemy dostosować odstępy podczas projektowania zawartości poszczególnych stron, korzystając z Divi Builder.

Moduł treści Divi Post

Następnie możemy dodać sekcję na dole szablonu, która będzie wyświetlana na wszystkich stronach. Ponieważ chcemy, aby treść była wyświetlana pod rzeczywistą treścią posta/strony, musimy ją dodać poniżej sekcji zawierającej moduł treści posta.

Oto przykład sekcji utworzonej pod treścią posta zawierającej ikony społecznościowe i opcję e-mail.

Moduł treści Divi Post

Uwaga: Ponieważ będziemy używać Divi Buildera do projektowania rzeczywistych stron w Divi, tak naprawdę nie musimy dodawać stylizacji do modułu treści postów.

Teraz z naszym szablonem strony możemy utworzyć nową stronę w Divi, przechodząc do Strony> Dodaj nową. Następnie dodaj tytuł i wdróż Divi Builder. Moduł treści Divi Post

Następnie kliknij, aby zbudować z przodu.

Moduł treści Divi Post

Możesz zaprojektować zawartość strony na interfejsie za pomocą Divi. Zwróć jednak uwagę, że konstruktor frontonu (wizualny) będzie zawarty w obszarze modułu treści posta szablonu strony przypisanego do strony. Podczas edycji postu lub strony w Divi Builder cały interfejs Divi Builder jest wyświetlany w kolumnie, w której znajduje się moduł treści postu. Wszystko inne poza tym modułem jest statyczne i nie można go modyfikować poza Theme Builder.

W tym przykładzie strona składa się z następujących obszarów:

  1. Global Header (dodane do niestandardowego obszaru nagłówka szablonu strony)
  2. Sekcja tytułu (dodana do układu niestandardowego obszaru treści szablonu strony nad zawartością strony)
  3. Sekcja treści posta (dodana do układu niestandardowego obszaru treści szablonu strony; składa się z modułu treści posta, który określa przestrzeń konstrukcyjną dla Divi Builder)
  4. Sekcja CTA (dodana do układu niestandardowego obszaru treści szablonu strony pod treścią strony)
  5. Stopka globalna (dodana do obszaru stopki niestandardowej szablonu strony)

Oto, jak to wygląda podczas edycji strony w interfejsie użytkownika za pomocą Divi Builder.

Moduł treści Divi Post

Moduł Post Content dobrze sprawdza się przy projektowaniu stron WooCommerce generowanych przez Shortcodes.

Moduł treści posta przyda się również za każdym razem, gdy tworzymy szablony stron dla stron WooCommerce. Strony WooCommerce generują zawartość strony za pomocą skrótów. Te skróty znajdują się w polu treści strony WooCommerce.

Oto, jak domyślnie wygląda strona konta podczas edycji strony w Divi.

Moduł treści Divi Post

Aby zaprojektować szablon dla tej strony WooCommerce, nie musimy wdrażać Divi Builder w edytorze stron. Możemy stworzyć szablon w Divi Theme Builder i ukierunkować projekt treści strony generowanej przez shortcode (przynajmniej część) za pomocą modułu treści postu.

Podczas tworzenia szablonu pamiętaj, aby przypisać szablon do stron WooCommerce.

Moduł treści Divi Post

Ważne: Moduł treści posta nie wyświetla zawartości stron archiwum/kategorii. Upewnij się, że nie przypisujesz strony sklepu do szablonu, który zależy od modułu treści posta do wyświetlania treści. Strona sklepu nie będzie wyświetlać żadnej treści. Tak więc, ponieważ planujemy używać modułu treści posta w szablonie, będziemy musieli ograniczyć przypisanie szablonu do koszyka, kasy i/lub stron Moje konto.

Teraz możemy dodać niestandardowy obszar ciała do szablonu i zbudować go za pomocą edytora układu szablonu.

Moduł treści Divi Post

Następnie dostosuj szablon strony za pomocą Divi Builder. Po dodaniu modułu Post Content, upewnij się, że zaktualizowałeś ustawienia projektu, aby ukierunkować projekt elementów strony WooCommerce generowanych przez shortcode.

Moduł treści Divi Post

A oto jak strona Moje konto wyglądałaby na interfejsie użytkownika ze stylami modułu treści postów.

Moduł treści Divi Post

Niestety, moduł treści postów nie będzie w stanie bezpośrednio stylizować każdego elementu treści generowanej przez stronę WooCommerce. Ale zapewni to miłą premię podczas projektowania szablonów stron woocommerce.

Nie dla szablonów stron indeksu/archiwum/kategorii

Ponieważ moduł treści postu jest przeznaczony do wyświetlania zawartości określonej strony lub postu utworzonego w Divi, nie będzie działał z szablonami stron indeksu (archiwów). Jeśli szablon jest używany na stronie indeksu (archiwum), moduł nie jest renderowany w interfejsie użytkownika i dlatego nie jest wyświetlana żadna treść.

Jeśli ten moduł istnieje w obszarze treści, ale nie istnieje treść posta (lub jeśli szablon jest używany na stronie indeksu (archiwum), moduł nie jest renderowany w interfejsie użytkownika.

Krótko mówiąc, nie używaj zawartości modułu postów do wyświetlania zawartości stron archiwum, w tym strony wyników wyszukiwania i strony 404.

Użyj modułu blogu dla szablonów stron archiwum.

Jeśli chcemy zbudować szablon dla stron archiwum, moduł blogu Divi zawiera opcję wyświetlania zawartości bieżącej strony. Spowoduje to wygenerowanie treści powiązanej z kategorią lub stroną archiwum.

Aby uzyskać więcej informacji, zapoznaj się z tym postem na temat tworzenia szablonu strony kategorii dla swojego bloga.

Nie dla szablonów stron produktu

Podczas tworzenia szablonu strony produktu dla produktów WooCommerce w Divi najlepiej nie polegać na module treści posta, aby wyświetlić informacje o produkcie w obszarze treści szablonu. Divi ma wszystkie moduły Woo, których potrzebujemy, aby dynamicznie pobierać informacje o produkcie na poziomie szablonu. Użycie modułu Post Content na szablonie przypisanym do strony produktu spowoduje wyświetlenie tylko treści zawartej w polu treści (które domyślnie jest tylko opisem produktu).

Aby uzyskać więcej informacji, sprawdź, jak zbudować szablon strony produktu.

Ostrzeżenie, jeśli brakuje modułu treści posta

Jeśli moduł Treść posta nie jest zawarty w treści szablonu Theme Builder i wybierzemy opcję „Użyj Divi Builder”, aby edytować post przy użyciu tego szablonu, pojawi się wyskakujące okienko z ostrzeżeniem, które informuje nas, że brakuje nam Opublikuj moduł treści na używanym szablonie. Istnieje również przycisk, który przeniesie nas bezpośrednio do kreatora motywów, aby wprowadzić niezbędne zmiany w szablonie.

Moduł treści Divi Post

Końcowe przemyślenia

Projektując nowe szablony dla witryny Divi, ważne jest, aby zrozumieć, jak korzystać z modułu Post Content. Moduł jest prawdopodobnie najlepiej używany w połączeniu z dynamicznymi elementami treści do tworzenia szablonu dla postów na blogu, co może usprawnić przepływ pracy tworzenia postów na blogu bez konieczności wdrażania Divi Builder. Ale moduł treści postów może się również przydać w przypadku szablonów stron, nawet stron WooCommerce.

Jakie masz dotychczasowe doświadczenia z modułem treści posta?

Czekam na kontakt z Państwem w komentarzach.

Pozdrawiam!