Divi Plugin Highlight - Divi Blog Extras

Divi include un modul de blog pentru a afișa postările într-o lățime completă sau un aspect al grilei. Este un modul frumos și face treaba. Ce se întâmplă dacă doriți diferite machete și funcții? Acest lucru se poate face cu CSS, dar un plugin terță parte numit Divi Blog Extras face sarcina mult mai ușoară.

Divi Blog Extras este un plugin terță parte de la Divi Extended care adaugă un nou modul Divi Builder cu mai multe funcții noi pentru a afișa postările de pe blog. Acesta include șase modele de aspect diferite și adaugă o caracteristică de încărcare AJAX cu un buton de încărcare mai mult. Postările se încarcă pe măsură ce derulați și încărcarea este rapidă. Puteți schimba textul atât pentru butoanele de citit mai mult, cât și de încărcare mai mult.

În acest punct de evidențiere a pluginului, vom arunca o privire la Divi Blog Extras și vom obține câteva idei despre ceea ce se poate face cu acest plugin. Imaginile pentru aceste exemple au fost preluate de pe Unsplash.com.

Instalare și setări pentru Divi Blog Extras

Încărcați și activați în mod normal. Un nou modul numit Divi Blog Extras va fi apoi disponibil în Divi Builder. Pentru ao utiliza, pur și simplu lăsați-l într-un rând la fel ca orice modul. Deoarece opțiunile sunt aceleași cu modulele standard Divi Builder, utilizarea acestui modul este intuitivă.

Setările de conținut includ opțiunile familiare și au șase opțiuni de aspect, lungimea extrasului, culorile categoriei, încărcarea mai multor butoane, suprapunerea imaginilor, citirea mai multor butoane și opțiuni de culoare a textului. Setările de proiectare includ antetul, meta și textul corpului și stilul chenarului. Aspectul Block Extended adaugă poziția imaginii, iar Classic adaugă pictograme sociale. Să ne uităm mai atent la fiecare dintre machete.

Grilă extinsă

Aspectul implicit, Grid Extended, afișează postări de blog cu imagini și text alternativ. Imaginile se înseninează pe plan. Numele categoriilor sunt plasate într-o casetă. în modul receptiv imaginile sunt plasate deasupra.

În acest exemplu, am adăugat o suprapunere cu hover, pictogramă hover, am schimbat citirea mai multor texte, am limitat extrasul la 100 de caractere și am schimbat textul categoriei și culorile de fundal. Animația de deplasare se afișează atunci când treceți cu mouse-ul peste orice parte a postării.

Casetă extinsă

Caseta extinsă plasează extrasul într-o casetă care se suprapune peste imagine și elimină caseta din jurul numelui categoriei. Imaginea autorului este adăugată la secțiunea meta. Imaginile și textul alternează. Acesta este unul dintre cele mai elegante machete de blog.

În acest exemplu, am schimbat fontul categoriei și culorile de fundal, am limitat lungimea extrasului la 150 de caractere și am schimbat fontul în albastru și am schimbat textul butonului citire mai mult. Plasarea implicită luminează imaginea așa cum se vede în imaginea de sus de mai sus.

Lățime maximă

Lățimea completă plasează imaginile în stânga și extrasul în dreapta, adăugând o dată de stil în extrema stângă. Fiecare postare este separată printr-o linie. Numele categoriei este plasat în meta.

Acest exemplu dezactivează data și meta-informațiile. Textul folosește culori personalizate. Am schimbat citirea mai mult și am încărcat mai mult textul butonului. Fragmentul este limitat la 200 de caractere.

Toate aspectele sunt receptive. Iată o privire asupra aspectului receptiv al Full Width. Aceasta arată două module unul lângă altul într-un rând cu 2 coloane.

Blocare extinsă

Block Extended este o grilă de blog care adaugă numele categoriei peste imagine și meta în partea de jos a cardului. Imaginea se micșorează atunci când treceți cu mouse-ul peste orice parte a cardului. Îmi place acest tip de micro-interacțiune, deoarece arată că cardul este clicabil.

Block Extended are trei opțiuni pentru afișarea imaginilor. Acest exemplu plasează imaginea prezentată în fundal cu textul într-o suprapunere.

Acest exemplu alternează imaginea de fundal între primele două opțiuni.

Fundal cu lățime completă

Fundalul cu lățime completă afișează o versiune decupată a imaginii în lățime maximă și plasează extrasul cu meta într-o suprapunere peste imagine. Plasarea extrasului alternează. Meta este separat de extras cu o linie.

Acest exemplu folosește o suprapunere întunecată peste imagine pentru a arăta că suprapunerea extrasului nu folosește aceeași suprapunere pe hover. Fundalul secțiunii este roșu pentru acest exemplu. Observați că roșul arată pe hover. De asemenea, am adăugat propriul text de citire a butonului și o margine de 2 pixeli.

Clasic

Aspectul clasic afișează postările de pe blog cu imagini de dimensiuni complete și fragmente de lățime completă sub imagini. Categoria și data sunt plasate deasupra titlului. Titlul include un separator de linii scurte pentru a-l deosebi de imagine. Sub extras se află numele autorului și numărul de comentarii separate printr-o bară. Un separator de linie mai subțire și mai larg separă posturile unul de celălalt.

Acest aspect are opțiunea de a afișa pictograme sociale. Dacă faceți clic pe Încărcați mai multe (sau așa cum l-am etichetat - Vedeți mai multe articole), se afișează următorul set de postări, care este egal cu numărul de postări pe care le-am selectat pentru afișare. În acest exemplu afișez două postări. Încărcați mai multe încarcă următoarele 2 postări.

Crearea unui aspect unic cu Divi Blog Extras

Mai multe module pot fi utilizate împreună pentru a crea machete de reviste. Acest aspect simplu include patru module care afișează aspectul Gird Extended. Fiecare modul afișează categorii diferite. Cei doi din mijloc afișează câte două postări.

Aceasta creează un aspect al revistei cu diferite categorii pentru diferitele secțiuni. Acest exemplu arată cum arată Grila extinsă ca fiind receptivă.

Acesta este același aspect Divi Builder, dar folosește fundalul cu lățime completă. Suprapunerile acoperă imaginile aproape complet atunci când sunt în modul receptiv.

Acest exemplu folosește aspectul clasic pentru modulul superior și Grid Extended pentru următoarele două module. Fiecare dintre module afișează categorii diferite și au propriul stil pentru textul categoriei. Modulul superior nu afișează un extras.

Acest lucru creează un aspect interesant al revistei. De asemenea, am setat rândurile să afișeze lățimea completă. Puteți amesteca și potrivi aspectele pentru a obține un design unic. Am creat machete cu categorii diferite pentru fiecare modul. Într-o actualizare viitoare, modulul va avea o caracteristică offset, astfel încât să puteți utiliza mai multe module din aceeași categorie.

Licență

Un singur site costă 15 USD. Licența extinsă este de 30 USD și poate fi utilizată pe site-uri nelimitate pentru dvs. și clienții dvs. Include actualizări pe viață.

Acest plugin nu funcționează cu Extra.

• Puteți achiziționa acest plugin de pe site-ul web Divi Extended.

Gânduri finale

Divi Blog Extras adaugă câteva caracteristici de design și design frumos pentru a oferi modulului blogului ceva pizazz. De asemenea, adaugă posibilitatea de a stiliza fundalurile și textul categoriilor. Folosește AJAX pentru încărcare și include un nou buton de încărcare. Puteți chiar să adăugați propriul text la încărcare mai mult și să citiți mai multe butoane. Fiecare dintre aceste modele este excelent pentru a oferi blogului dvs. un aspect unic de la blogul standard. Dacă doriți un design de blog care să depășească modulul standard de blog Divi Builder, Divi Blog Extras ar putea fi modulul pe care îl căutați.

Vrem sa auzim de la tine. Ați încercat Divi Blog Extras? Spuneți-ne despre experiența dvs. în comentariile de mai jos.

Imagine prezentată prin pulsar011 / shutterstock.com