Cum să creați o pagină de destinație la Summit virtual cu Divi
Publicat: 2020-07-02Promovarea unui eveniment virtual implică o serie de strategii promoționale. Crearea unei pagini de destinație primitoare este una dintre ele. Crearea unei pagini de destinație pentru summitul virtual este modalitatea perfectă de a-ți face publicul curios. Cu combinația corectă de secțiuni, puteți invita, informa și colecta participanți înregistrați. Astăzi vă vom arăta cum să creați o pagină de destinație virtuală cu cinci secțiuni. Designul include imagini cu două tonuri și separatoare de secțiuni de defilare. De asemenea, am inclus un fișier JSON descărcabil dacă doriți să ignorați tutorialul pas cu pas. În dosar, veți găsi, de asemenea, grafica antet și subsol atât în PNG, cât și în AI.
Să ajungem la asta!
previzualizare
Să aruncăm o privire la designul paginii de destinație pe diferite dimensiuni de ecran.
Desktop
Comprimat
Mobil
Descărcați pagina de destinație a Summitului Virtual GRATUIT
Pentru a pune mâna pe aspectul paginii de destinație virtuale gratuite, va trebui mai întâi să o descărcați folosind butonul de mai jos. Pentru a avea acces la descărcare, va trebui să vă abonați la lista noastră de e-mail Divi Daily folosind formularul de mai jos. Ca nou abonat, veți primi și mai multe bunătăți Divi și un pachet Divi Layout gratuit în fiecare luni! Dacă sunteți deja pe listă, pur și simplu introduceți adresa de e-mail mai jos și faceți clic pe descărcare. Nu veți fi „resubscris” și nu veți primi e-mailuri suplimentare.
Descarcă gratis
Înscrieți-vă la buletinul informativ Divi și vă vom trimite prin e-mail o copie a pachetului final de planificare a paginii de destinație Divi, plus o mulțime de alte resurse, sfaturi și trucuri uimitoare și gratuite Divi. Urmăriți-vă și veți fi un maestru Divi în cel mai scurt timp. Dacă sunteți deja abonat, pur și simplu introduceți adresa de e-mail de mai jos și faceți clic pe descărcare pentru a accesa pachetul de aspect.
V-ați abonat cu succes. Vă rugăm să verificați adresa de e-mail pentru a vă confirma abonamentul și pentru a obține acces la pachetele de layout Divi săptămânale gratuite!
Secțiuni ale paginii de destinație a Summitului virtual
Pentru ca pagina dvs. de destinație să își facă treaba, are nevoie de un set specific de secțiuni. În afară de a atrage privirea privitorului, paginile de destinație trebuie, de asemenea, să convertească. O pagină de destinație a summitului virtual, de exemplu, trebuie să includă informații relevante și un îndemn la acțiune. Toate secțiunile trebuie să curgă de la una la cealaltă pentru ca spectatorul să se simtă inspirat să acționeze și să se înscrie.
Am inclus următoarele secțiuni în pagina de destinație a summitului virtual:
Antet
Secțiunea antet include informații importante, cum ar fi titlul summitului și data evenimentului. Aceasta este cea mai importantă informație, de aceea se află chiar în vârf. Niciun antet nu este complet fără un apel la acțiune și o navigare ușoară către restul paginii.
În designul nostru, am inclus două butoane cu legături de ancorare care navighează către difuzoare și secțiuni de programare. Cel mai important, am inclus un buton cu un link către secțiunea de înregistrare. Pe toată pagina, toate butoanele „înregistrare” arată la fel, pentru a avea unitate vizuală în design.
informație
A doua secțiune este o secțiune informațională care îl incită pe spectator să ia în considerare participarea la summit-ul virtual. În design, am adăugat patru blurbs și o imagine care poate fi transformată cu ușurință într-un videoclip. Blurbs enumeră patru motive pentru a participa la summit, iar imaginea (sau videoclipul) este imaginea care susține decizia.
Difuzoarele
În secțiunea următoare, veți găsi un set de module de șase persoane. Aici prezentați vorbitorii care vor participa la summit. Fiecare modul include următoarele elemente:
- Imagine
- Nume
- Poziţie
- Descriere
- Link-uri de socializare
Asigurați-vă că introduceți toate informațiile relevante pentru fiecare difuzor. De asemenea, încercați să utilizați aceeași cantitate de linii în textul corpului pentru a menține designul clar. După cum puteți vedea, am folosit un efect de culoare duoton pe toate fotografiile difuzoarelor pentru a oferi designului un aspect și o senzație interesante. Mai jos este un tutorial pas cu pas despre cum să obțineți acest efect în Photoshop.
Dacă aveți mai mult de șase difuzoare, pur și simplu duplicați rândul sau clonați modulele în rânduri cu mai multe sau mai puține coloane.
Programul
Urmează secțiunea de programare. În această zonă, am împărtășit elegant programul summitului și ne-am asigurat că este structural. Pentru a păstra stilul designului textului, asigurați-vă că modificați conținutul, dar nu nivelurile de titlu. Încercați să păstrați conținutul la aproximativ aceeași lungime, astfel încât designul să rămână îngrijit.
Rândurile sunt organizate pe zile, cu o imagine de titlu și un grup de blurbs. În partea de jos a ultimei coloane puteți găsi un buton de îndemn pentru ca publicul să se înregistreze.
Inregistreaza-te
Nu în ultimul rând este secțiunea de înregistrare. Am inclus un cronometru pentru a adăuga un sentiment de urgență. Formularul de contact ar trebui să fie legat direct de lista dvs. RSVP, astfel încât fiecare invitat să fie înregistrat automat.
De-a lungul designului paginii de destinație a summitului virtual, veți găsi trei butoane care navighează la această secțiune pentru o generație optimizată de clienți potențiali.
Creați o hartă de gradient Duotone cu Photoshop
Deschideți imaginea în Adobe Photoshop
Dacă doriți să imitați imaginile duotone din designul nostru, urmați pașii de mai jos. Mai întâi, deschideți o imagine în Photoshop.
Deschideți ajustările și selectați Harta de gradient
Deschideți bara de instrumente de ajustări și faceți clic pe harta de gradient. În fila Proprietăți, faceți dublu clic pe bara de gradient pentru a deschide fereastra pop-up de setări.
Reglați culorile gradientului
În setările de gradient, faceți dublu clic pe fiecare culoare pentru a personaliza setările.
Pentru a obține efectul proiectării noastre, ajustați gradientul după cum urmează:
- Tipul de gradient: solid
- Netezime: 100%
- Opacity Stop # 1: 100%
- Color Stop # 2
- Violet închis # 202060
- Poziție: 19%
- Punct de mijloc:
- Punctul de mijloc al opacității: 85%
- Punctul de mijloc al culorii: 50%
- Opacity Stop # 2: 55%
- Color Stop #
- Violet # f895f8
- Poziție: 100%
Salvați ca hartă gradient personalizată
Adăugați un nume pentru gradientul dvs. și faceți clic pe nou pentru a-l salva. Apoi va fi stocat în biblioteca dvs. de gradient. Salvați imaginea pentru web la 700px înălțime. Repetați procesul cu câte imagini aveți nevoie. După aplicarea hărții de gradient, selectați gradientul salvat.
1. Creați secțiunea antet
Adăugați o secțiune nouă
fundal
Să începem să recreăm pagina de destinație a summitului virtual. Creați o pagină nouă și deschideți-o cu Divi Builder. Înainte de a adăuga rânduri, adăugați o imagine de fundal și un gradient într-o secțiune nouă. Veți găsi imaginea de fundal în folderul descărcabil de mai sus.
- Gradient de fundal
- Culoare 1: # 1f4068
- Culoare 2: # 202040
- Imagine de fundal: grafic antet
Dimensionare
Reglați înălțimea minimă în continuare.
- Înălțime minimă: 1050 px
Spațiere
Distanța, de asemenea.
- Căptușeala superioară și inferioară
- Masă și telefon: 90 px
Vizibilitate
În cele din urmă, ajustați setările de vizibilitate în fila avansată.
- Depășire orizontală și verticală: ascunsă
Adăugați un rând nou
Structura coloanei
Adăugați un rând cu trei coloane. Selectați structura coloanei 1/2, 1/4, 1/4.
Dimensionare
Reglați dimensiunea rândului după cum urmează:
- Lățime: 90%
- Lățime maximă: 1800 px
- Aliniere: centru
Spațiere
\ Adăugați și o marjă de sus.
- Marja superioară: 200 px
Coloana 2, 3 Setări
Spațiere
Reglați setările pentru coloanele 2 și 3. Mai întâi distanța
- Marja superioară: 30 px
Vizibilitate
Apoi, ascundeți coloanele de pe telefon.
- Dezactivați pe: Telefon
Adăugați primul modul de text la coloana 1
Text
Adăugați un prim modul de text în coloana 1. Introduceți titlul ca conținut H1.
- Corp: Conținut H1
Text de antet
În fila de proiectare, stilizați următorul text al antetului.
- Nivel de titlu: H1
- Font: Alata
- Greutate: îndrăzneț
- Aliniere: centru
- Culoare: Alb stins #eaeaea
- mărimea
- Desktop: 85 px
- Tabletă: 70 px
- Telefon: 44 px
- Spațierea literelor: 2 px
- Înălțimea liniei: 1.1em
- Text Shadow: prima opțiune
- Culoare umbră: rgba (o, 0,0,0.26)
Adăugați al 2-lea modul de text la coloana 1
Text
Adăugați un al doilea modul de text. Introduceți data ca conținut H2.
- Corp: Conținut H2, 15 + 16 iulie 2020
Text de antet
Stilează textul antetului în continuare.
- Nivel de titlu: H2
- Font: Alata
- Greutate: regulat
- Aliniere: centru
- Culoare: Fucshia # b030b0
- mărimea
- Desktop și tabletă: 60 px
- Telefon: 45 px
- Înălțimea liniei: 1.3em
Spațiere
Adăugați și spațiu.
- Căptușeală inferioară: 20 px
Adăugați modulul buton la coloana 1
Text
Adăugați un modul buton pentru îndemnul la acțiune.
- Buton: Înregistrați-vă
Legătură
Adăugați linkul de ancorare.
- Adresa URL a linkului: #Register
Aliniere
Treceți la fila de proiectare și setați alinierea.
- Aliniere buton: centru
Butoane Stiluri personalizate
Stilizați și butonul.
- Mărimea textului
- Desktop: 30 px
- Tabletă: 25 px
- Telefon: 20 px
- Culoarea textului: alb #ffffff
- Fundal: Violet # 602080
- Raza de frontieră: 35 px
- Spațierea literelor: 1 px
- Font: Alata
Spațiere
În cele din urmă, reglați distanța.
- Marja superioară
- Tabletă și telefon: 15 px
- Căptușeală superioară: 2 px
Adăugați un modul buton la coloana 2
Text
Treceți la coloana 2 și adăugați un modul buton. Adăugați copia la alegere.
- Buton: Boxe
Legătură
Apoi, adăugați un link de ancorare.
- Adresa URL a linkului: #Speakers
Aliniere
În fila de proiectare, setați alinierea.
- Aliniere buton
- Desktop: Corect
- Tabletă și telefon: centru
Buton Stil personalizat
Ajustați și stilurile de butoane personalizate.
- Dimensiune text: 24 px
- Culoarea textului: alb #ffffff
- Fundal: transparent
- Spațierea literelor: 1 px
- Buton Font: Alata
- Raza de frontieră: 0 px
Box Shadow
În cele din urmă, adăugați o umbră de cutie.
- Box Shadow: opțiunea a 4-a
- Poziție orizontală: 0 px
- Poziție verticală: 5 px
- Culoare umbră: Fuchsia: # b030b0
Clonați butonul Modul la coloana 3
Buton Clonare
Clonați butonul din coloana 2 și plasați modulul duplicat în coloana 3.
Modificați butonul de reglare
Text
Schimbați textul din butonul clonat.
- Buton: Programare
Legătură
Schimbați și legătura de ancorare.
- Adresa URL a linkului: #Schedule
Aliniere
Nu uitați să schimbați și alinierea.
- Aliniere buton
- Desktop la stânga
Adăugați un rând nou
Structura coloanei
Adăugați un rând nou cu două coloane egale.
Dimensionare
Reglați mai întâi lățimea jgheabului.
- Lățime personalizată a jgheabului: 2
Spațiere
Adăugați spațiu în continuare.
- Marja superioară
- Telefon: -35px
Vizibilitate
Apoi reglați vizibilitatea rândului.
- Dezactivați pe: tabletă și desktop
Modul buton clonare și plasare duplicat în coloana 1
Buton Clonare
Clonați modulul buton din coloana 2 a rândului anterior și plasați modulul duplicat în coloana 1 a noului rând.
Modificați butonul de reglare
Buton Stil personalizat
Ajustați textul din noul buton.
- Dimensiune text: 20 px
Box Shadow
Modificați și umbra cutiei.
- Poziție verticală: 4 px
Adăugați modulul buton clonat în coloana 2
Buton Clonare
Duplicați modulul buton din coloana 3 din rândul anterior. Lipiți-l în coloana 2 a acestui rând.
Modificați butonul de reglare
Text
Reglați conținutul textului în butonul clonat.
- Text: Program
2. Creați secțiunea de informații
Adăugați o secțiune nouă
fundal
Pentru a crea secțiunea de informații, adăugați o nouă secțiune și stilizați mai întâi fundalul.
- Gradient de fundal
- Culoare 1: # 202040
- Culoare 2: # 202060
Spațiere
Adăugați și niște umplutură.
- Căptușeală superioară: 170 px
- Căptușeală inferioară: 5 px
Vizibilitate
În cele din urmă, ajustați setările de vizibilitate în fila avansată.
- Depășire orizontală și verticală: ascunsă
Adăugați un rând nou
Structura coloanei
Adăugați un rând nou cu o coloană. Vom numi acest rând rândul titlului.
Dimensionare
Setați dimensiunea în continuare.
- Lățime: 80%
- Lățime maximă: 1800 px
Adăugați un modul de text
Text
Adăugați un modul text.
- Corp: Conținut H2 - De ce să participați la Summitul Virtual Marketing Digital?
Text de antet
În fila Design, stilizați textul antetului.
- Nivel de titlu: H2
- Font: Alata
- Culoarea textului: alb #ffffff
- mărimea
- Desktop: 55 px
- Tabletă: 45 px
- Telefon: 40 px
- Spațierea literelor: 2 px
- Înălțimea liniei: 1,1 em
Adăugați un modul divizor
Linia
Acum adăugați un modul divizor și stilizați linia în fila de proiectare.
- Culoare linie: Fuchsia # b030b0
Dimensionare
Reglați dimensiunea în continuare.
- Greutatea divizorului: 50 px
- Înălțime maximă: 50 px
Efecte derulare
În fila avansată, adăugați un efect de derulare orizontală.
- Activați mișcarea orizontală
- Desktop
- Offset de pornire: -6
- Decalaj mediu: 50% / 0
- Decalare finală: 6
- Tabletă și telefon
- Decalare declarativă: -4
- Decalaj mediu: 50% / 0
- Offset final: 4
Adăugați un rând nou
Structura coloanei
Acum adăugați un rând nou cu trei coloane. Selectați structura coloanei 1/2, 1/4, 1/4.
Dimensionare
Înainte de a adăuga module, ajustați dimensiunea rândului.
- Lățime: 80%
- Lățime maximă: 1800 px
Setări coloana 1
Spațiere
De asemenea, reglați spațiul primei coloane.
- Căptușeală superioară: 20 px
Adăugați modulul de imagine în coloana 1
Imagine
Acum adăugați un modul de imagine în coloana 1. Utilizați una dintre imaginile dvs. cu efect duoton.
- Imagine: fotografie cu efect duoton
Frontieră
Reglați și marginile.
- Colțuri rotunjite: 15 px
Adăugați Blurb Module în coloana 2
Text
Treceți la coloana 2 și adăugați un modul blurb. Introduceți conținutul.
- Titlu: Faceți conexiuni noi
- Corp: conținut descriptiv
Imagine
Încărcați imaginea numărul 1 pe care o puteți găsi în folderul descărcabil.
- Imagine: PNG din # 1
Imagine și pictogramă
Reglați următoarea plasare a imaginii.
- Amplasare: sus
- Aliniere: la stânga
Textul titlului
Stilizați și textul titlului.
- Nivel de titlu: H4
- Font: Alata
- Culoare: alb #ffffff
- Dimensiune: 23 px
Corpul textului
Nu uitați să stilizați textul corpului.
- Font: Deschideți Sans
- Culoare: alb #ffffff
- Dimensiune: 14 px
- Spațierea literelor: 1 px
CSS personalizat
În cele din urmă, adăugați câteva umpluturi suplimentare cu CSS personalizat la titlul blurb din fila avansată.
- Titlu Blurb: fund de umplutură: 15 px;
padding-bottom: 15px;
Clonați modulul Blurb și plasați duplicatul în coloana 2
Clone Blurb
Duplicați prima blurb în coloana 2.
Conţinut
Actualizați conținutul.
- Titlu: Titlu nou
- Corp: nou text descriptiv
Imagine
Apoi, schimbați imaginea numerică. Pe cel nou îl puteți găsi în folderul descărcabil.
- Imagine: PNG din # 2
Ștergeți coloana 3 și clonați coloana 2
Clona Coloana
În setările de rând, ștergeți a treia coloană și copiați a doua. Asigurați-vă că reveniți la structura coloanei la 1/2, 1/4, 1/4.
Reglați Blurb 1 în coloana 3
Conţinut
Actualizați conținutul textului din textul clonat.
- Titlu: Titlu nou
- Corp: nou text descriptiv
Imagine
Schimbați și imaginea numerică.
- Imagine: PNG din # 3
Reglați Blurb 2 în coloana 3
Conţinut
Modificați și conținutul acestui text. Mai întâi textul.
- Titlu: Titlu nou
- Corp: nou text descriptiv
Imagine
Apoi, schimbați imaginea numerică.
- Imagine: PNG din # 4
3. Creați secțiunea Difuzoare
Adăugați o secțiune nouă
fundal
Trecând la secțiunea pentru difuzoare. Adăugați o nouă secțiune și stilizați fundalul.
- Gradient de fundal
- Culoare 1: # 202060
- Culoare 2: # 162447
Vizibilitate
Reglați setările de vizibilitate în fila avansată.
- Depășire orizontală și verticală: ascunsă
Clonează titlul rând și plasează duplicat în secțiunea nouă
Rând duplicat
Duplicați rândul de titlu din secțiunea de mai sus și plasați duplicatul în secțiunea clonată. Vom numi asta, titlul rândul 2.
Ajustați modulul text
Text
Apoi, stilizați setările de text H3 în fila de proiectare. Ajustați ID-ul CSS și în modulul de text clonat. Apoi, schimbați culoarea liniei modulului divizor. Acum adăugați un rând nou cu 5 module de dimensiuni egale. Reglați dimensiunea rândului după cum urmează: Adăugați și spațiu. Adăugați modulul pentru prima persoană în coloana 1. Încărcați imaginea difuzorului cu efect de culoare. Vă recomandăm o dimensiune a imaginii de 550 x 770 px. Adăugați câteva colțuri rotunjite la imaginea următoare. Apoi, stilizați textul titlului. Stilizați și textul corpului. Nu uitați textul poziției. În cele din urmă, adăugați câteva CSS personalizate pentru o umplutură suplimentară. În setările de rând, ștergeți coloanele 2-5. Duplicați coloana 1 de patru ori. Actualizați conținutul din toate modulele clonate. Mai întâi textul. Apoi imaginea. Acum vom crea secțiunea de programare. Adăugați o nouă secțiune și stilizați fundalul după cum urmează: Reglați setările de vizibilitate în fila avansată. Clonați rândul de titlu din secțiunea de mai sus și lipiți-l în această secțiune. Schimbați conținutul titlului. Schimbați ID-ul CSS în modulul de text clonat. Schimbați și culoarea separatorului. Acum, adăugați un rând nou cu trei coloane de dimensiuni egale. Reglați dimensiunea rândului. Adăugați și spațiu. Adăugați un modul text în prima coloană. Introduceți conținutul. Treceți la fila de proiectare și stilizați textul antetului. Adăugați câteva spații în continuare. Acum adăugați un modul de apel la acțiune cu un conținut la alegere. Adăugați și o imagine de fundal. În fila Design, stilizați textul antetului. Stilează textul corpului în continuare. Adăugați și spațiu. Apoi, stilizați marginea. În cele din urmă, adăugați CSS personalizat pentru un stil suplimentar. Treceți la coloana 2 și adăugați un modul text. Urmați această structură de conținut: În fila Design, stilizați textul. Apoi stilizați toate nivelurile de titlu. Stilizați și marginea. Duplicați de două ori modulul 1 de text. Schimbați conținutul din modulele de text clonate. Eliminați marginea ultimului modul din coloană. În setările de rând, ștergeți coloana 3. Duplicați coloana 2. Ștergeți al treilea modul de text din coloana clonată. Actualizați conținutul din fiecare nou modul de text. Copiați butonul „Înregistrați” din secțiunea antet și lipiți-l sub ultimul modul de text din coloana 3. Schimbați alinierea butonului la stânga. Reglați puțin dimensiunea textului. Duplicați primul rând în secțiunea de programare. Schimbați conținutul din modulul de text clonat. Ajustați conținutul modulului de îndemn. Schimbați și imaginea de fundal. Ajustați și conținutul din modulele text. Secțiunea finală este dedicată înregistrării. Adăugați o nouă secțiune și stilizați fundalul după cum urmează. Veți găsi graficul de subsol în folderul de descărcare de mai sus. Reglați și distanța secțiunii. Și modificați setările de vizibilitate din fila avansată. Acum adăugați un rând nou cu o singură coloană. Adăugați un divizor invizibil pentru a acționa ca legătura de ancorare a secțiunii. Introduceți codul CSS care face legătura cu toate butoanele „înregistrare”. Adăugați un al doilea rând cu două coloane egale. Reglați setările de dimensionare ale rândului. Adăugați un modul cu temporizator invers în prima coloană. Adăugați conținutul și data evenimentului. Stilizați fundalul în continuare. În fila Design, stilizați textul titlului. Stilizați și textul numerelor. De asemenea, textul etichetei. Apoi, ajustați dimensiunea rândului. Adăugați și niște umplutură. În cele din urmă, stilizați marginea. Adăugați un nou modul de formular de contact în coloana 2. Eliminați câmpul de mesaj. Introduceți setările pentru fiecare câmp. În fila de proiectare, sub aspect, faceți clic pe „faceți lățime completă”. Faceți același lucru pentru al doilea câmp. Reveniți la setările generale ale formularului de contact și adăugați conținut. Apoi, stilizați câmpurile după cum urmează: Stilizați și textul titlului. Ajustați și stilurile personalizate ale butonului. Nu uitați să reglați raza chenarului. În cele din urmă, adăugați CSS personalizat pentru o umplutură suplimentară. Au fost efectuate! Să aruncăm o privire la designul paginii de destinație din nou pe diferite dimensiuni de ecran. Ai făcut! Cum arată pagina dvs. de destinație virtuală? Utilizați acest design pentru propriul dvs. summit virtual sau pentru un client de web design. Navigarea este optimizată pentru conversie cu cantitatea corectă de informații. Am adăugat separatoare de secțiuni de derulare pentru un pic suplimentar vizual. Spuneți-ne ce părere aveți în comentarii. Ați descărcat aspectul sau ați urmat pașii?
Text de antet
CSS personalizat
Reglați divizorul
Linia
Adăugați un rând nou
Structura coloanei
Dimensionare
Spațiere
Adăugați modulul persoană la coloana 1
Text
Imagine
Imagine
Textul titlului
Corpul textului
Textul poziției
CSS personalizat
padding-bottom: 10px;
padding-bottom: 20px;
padding-bottom: 20px;
Duplicați coloana 1
Clona Coloana
Ajustați conținutul pentru modulele pentru o persoană nouă
Text
Imagine
4. Creați secțiunea Programare
Adăugați o secțiune nouă
fundal
Vizibilitate
Clonează titlul rândul 2
Rând duplicat
Ajustați modulul text
Text
CSS personalizat
Reglați divizorul
Linia
Adăugați un rând nou
Structura coloanei
Dimensionare
Spațiere
Adăugați un modul de text în coloana 1
Text
Text de antet
Spațiere
Adăugați îndemn la coloana 1
Text
fundal
Text de antet
Corpul textului
Spațiere
Frontieră
CSS personalizat
border-radius: 15px;
background-color: #162447;
margin-top: 500px;
padding-bottom: 40px;
padding-bottom: 40px;
background-color: #q62447;
margin-top: 500px;
padding-bottom: 40px;
padding-bottom: 40px;
Adăugați un modul de text în coloana 2
Text
Text
Text de antet
Frontieră
Clonează modulul de text de 2 ori
Clonați modulul text
Ajustați modulele de text noi
Text
Eliminați marginea celui de-al treilea modul de text
Frontieră
Ștergeți coloana 3 și clonați coloana 2
Clonați coloane
Eliminați și ajustați modulele de text
Ștergeți modulul text
Ajustați conținutul
Modul buton clonare și plasare duplicat în coloana 3
Buton Clonare
Modificați butonul de reglare
Aliniere
Buton Stil personalizat
Clonați primul rând al secțiunii Program
Clone Row
Ajustați modulul text în coloana 1
Text
Ajustați modulul Apel la acțiune
Text
fundal
Ajustați modulele de text
Text
5. Creați secțiunea de înregistrare
Adăugați o secțiune nouă
fundal
Spațiere
Vizibilitate
Adăugați un rând nou
Structura coloanei
Adăugați un modul divizor
Vizibilitate
ID CSS
Adăugați un rând nou
Structura coloanei
Dimensionare
Adăugați modulul temporizator invers în coloana 1
Text
fundal
Textul titlului
Text cu numere
Textul etichetei
Dimensionare
Spațiere
Frontieră
Adăugați modulul de formular de contact în coloana 2
Elemente
Aspectul câmpurilor
Text
Câmpuri
Textul titlului
Butoane Stiluri personalizate
Frontieră
CSS personalizat
padding-bottom: 30px;
previzualizare
Desktop
Comprimat
Mobil
Asta e un Wrap