Divi Layout Block hap derën për shumë mënyra të përshtatshme për të integruar veçoritë e fuqishme të dizajnit të Divi Builder me redaktorin e paracaktuar të bllokut të WordPress (Gutenberg). Kjo ju lejon të shkruani shumicën e përmbajtje e postimit të blogut tuaj duke përdorur ndërfaqen e njohur të bllokut Gutenberg, më pas injektoni paraqitjet Divi ku nevojitet dizajni ose funksionaliteti i personalizuar. Një bllok i paraqitjes Divi mund të përfshijë gjithçka që mund të krijoni në Divi Builder, por është gjithashtu i shkëlqyeshëm për të përfshirë diçka kaq të thjeshtë dhe thelbësore si një formë të abonimit.

Në këtë tutorial, ne do të shohim se si të shtojmë një formë abonim në një postim në blog të Gutenberg duke përdorur bllokun e paraqitjes Divi.

Rezultati i mundshëm

Ndarja e rezultatit përfundimtar

Importimi i bllokut të paraqitjes JSON

Shkarkoni paraqitjen në bibliotekën Divi

Për të importuar skedarin JSON që keni mundur të shkarkoni më lart, shkoni në bibliotekën tuaj Divi në pjesën e prapme të panelit tuaj të WordPress dhe klikoni në 'Import dhe eksport'.

Import Divi

Pastaj zgjidhni skedarin JSON në dosjen tuaj të shkarkimit dhe klikoni në "Importoni Layouts Builder Divi".

Importo json divi 1

Shtoni një Bllok të ri Divi brenda postimit të Gutenberg

Pasi të jetë importuar faqosja juaj, mund të hyni në mesazhin tuaj Gutenberg dhe të shtoni një bllok të ri të paraqitjes së Divi.

Dizajni Divi

Importoni një skedar JSON nga prezantimet e ruajtura

Pastaj, kliko në "Ngarko nga biblioteka", shko te "Paraqitjet e tua të ruajtura" dhe zgjidh paraqitjen për të importuar bllokun e paraqitjes Divi CTA në postimin tënd të blogut. Kjo eshte !

Injekto një formë në gutenberg
Abonimi i postës elektronike të paraqitjes Divi

Dhe kjo eshte e gjitha!

Injekto një modul të formës divi

Le të kalojmë në tutorial, në rregull?

Shtoni një modul të postës elektronike Optin në postimin tuaj në blogun Gutenberg

Krijoni ose modifikoni një postim në blog

Për të filluar, duhet të krijojmë një postim të ri në blog ose të modifikojmë një ekzistues. Për këtë shembull, le të shtojmë përmbajtje kopjoni titullin dhe trupin e artikullit duke përdorur disa blloqe koke dhe paragrafësh. Më pas, shtoni një imazh të veçuar dhe zgjidhni "Pa shirit anësor" për paraqitjen nën cilësimet e faqes Divi.

Dizajni i artikullit

Shtoni një bllok të paraqitjes në internet Divi

Pasi të keni krijuar pjesën më të madhe të postimit, gjithçka që duhet të bëjmë është të shtojmë një bllok të ri të paraqitjes Divi kudo që duam në zonën e postimit. përmbajtje të botimit. Mund ta shtojmë diku më afër fundit të mesazhit për të kapur një drejtues të kualifikuar, i cili është padyshim i interesuar për përmbajtjen e mesazhit.

Për ta shtuar atë, vendosni miun mbi zonën ku dëshironi të shtoni opsionin email, pastaj klikoni në ikonën blu plus për të shtuar një bllok të ri. Në listën e blloqeve kontekstuale, zgjidhni bllokun e Layout Divi.

Shto bllokun e dizajnit divi

Krijoni një plan urbanistik të ri në bllokun e faqosjes Divi

Pasi të jetë zgjedhur blloku i paraqitjes Divi, ne do të kemi mundësinë e "Krijo një paraqitje të re" ose "Ngarko nga biblioteka". Meqenëse na duhet të krijojmë opsionin e postës elektronike nga e para, zgjidhni optin "Krijo një paraqitje të re".

Dizajnoni dizajn të ri divi

Dizajni i seksionit

Në redaktorin e faqosjes, ne mund të fillojmë të hartojmë emailin optin që do të përfshihet në postimin tonë. Gjithçka që ne krijojmë në këtë redaktor do të shfaqet në zonën e Bllokut të Layout Divi të postimit.

Për të filluar, hapni cilësimet e seksionit të seksionit të paracaktuar tashmë atje.

Për paraqitjen, ne do të zgjedhim një plan urbanistik me dy kolona.

Zgjidhni paraqitjen divi

Pastaj ne do të shtojmë modulin Email Optin në një nga kolonat, zgjedhjen e kolonës jua lë juve.

Optin modulin e divi emailit

Tjetra, ne do ta rregullojmë sfondin e seksionit. Ju gjithmonë mund të ndryshoni vlerat për ta bërë dizajnin tuaj unik. Sidoqoftë, ne përdorëm vlerat e mëposhtme:

  • Sfondi: # ff6100
  • Ndarësi i nivelit të lartë dhe të poshtëm: numërimi i 13-të nga maja.
Ndarësi i modulit Divi
  • Gjerësia e elementit pjesëtues: 40px (sipër dhe poshtë).

Tani do të shtojmë tekst në kolonën e kundërt. Këtu, ju do të përdorni tekstin nxitës për të sjellë vizitor për t'u abonuar.

Moduli i tekstit Divi

Më pas do të duhet të bëni modifikime të ndryshme:

  • Teksti i shkronjave: Montserrat
  • Ngjyra e shkronjave: #FFF
  • Shkronja e shkronjave të tekstit Titra H2: Montserrat
  • Teksti Titra H2 Madhësia: 2.5em
  • Teksti Titra H2 Ngjyra: #FFF
Personalizimi i titullit Divi

Mos harroni të konfiguroni sistemin e postës elektronike që do të përdorni. Duhet ta dini që Gutenberg është i pajtueshëm me të MailChimp.

Mendimet e fundit

Shtimi i një emaili optin në mesazhin tuaj Gutenberg është bërë tepër i lehtë me bllokun e paraqitjes në Divi. Jo vetëm që mund të shtoni një opsion email plotësisht funksional (dhe të lehtë për t'u përdorur) në sekonda, por gjithashtu mund të përdorni Divi Builder për të shtuar dizajnin e personalizuar, efektet e rri pezull dhe animacionin. E gjithë kjo pa pasur nevojë të përdorni një shtojcë!