Comutați la meniu

Cum se creează anteturi și subsoluri cu Beaver Themer

Publicat: 2024-10-03

Reducere de 25% la toate produsele Beaver Builder... Grăbește-te, reducere se termină în curând! Află mai multe

how to create headers and footers using beaver themer
  • Beaver Themer

Cum se creează anteturi și subsoluri cu Beaver Themer

Creatorii de pagini sunt excelente pentru a crea pagini frumoase, dar adesea nu extind personalizarea la anteturi și subsoluri. Această limitare poate duce la inconsecvențe vizuale care influențează negativ experiența utilizatorului (UX) și coeziunea mărcii.

Din fericire, pluginul nostru de creare a temei Beaver Themer oferă o modalitate ușoară de a crea anteturi și subsoluri personalizate, menținând întregul tău site consistent vizual.

În acest ghid, vom explora patru pași simpli pentru a crea antete și subsoluri cu Beaver Themer. Să ne scufundăm!

Cuprins

  • O introducere în Beaver Themer
  • Cum se creează anteturi cu tema Beaver (în 4 pași)
  • Cum se creează subsoluri cu tema Beaver (în 4 pași)
  • Gânduri finale
  • Întrebări înrudite

O introducere în Beaver Themer

Beaver Themer duce construirea paginii la un nivel cu totul nou, permițându-vă să personalizați zonele site-ului adesea definite de tema dvs., cum ar fi anteturile, subsolurile și multe altele. Acest lucru deschide posibilitatea unui aspect coeziv, de marcă pe întregul dvs. site:

Beaver Themer Theme Builder Plugin

Cu Beaver Themer, puteți:

  • Ajustați anteturile, subsolurile, barele de anunțuri și CTA.
  • Creați machete personalizate pentru 404 pagini, pagini de căutare și arhive de blog.
  • Creați șabloane pentru tipuri de postări personalizate.
  • Controlați setările de afișare pe toate paginile sau numai pe paginile selectate.

Cu editorul drag-and-drop al Beaver Builder, adăugarea și stilizarea elementelor este la fel de ușoară precum construirea unei pagini standard, completă cu opțiuni de culoare, machete și module precum butoane și formulare de contact.

Obțineți acces la Beaver Themer cu planuri premium

Vestea bună este că Beaver Themer este inclus cu orice plan premium Beaver Builder:

Prețuri Beaver Builder pentru 2024

Aceasta înseamnă că atunci când investești într-un plan premium, obții acces la opțiuni avansate de personalizare.

Acum că am explorat beneficiile Beaver Themer, haideți să trecem la procesul pas cu pas de a crea antete cu Beaver Themer.

Cum se creează anteturi cu tema Beaver (în 4 pași)

Un antet personalizat vă poate ajuta să vă prezentați brandingul, să vă faceți site-ul mai ușor de navigat și să evidențiați indemnurile cheie. Iată cum să creați unul cu Beaver Themer:

Pentru a începe, asigurați-vă că aveți instalate, activate și licențiate generatorul de pagini premium Beaver Builder și pluginurile Beaver Themer. De asemenea, creați un meniu pentru site-ul dvs. accesând Aspect > Meniuri în tabloul de bord WordPress.

Pasul 1: Creați un aspect nou al temei

Pentru a crea un nou aspect Themer, faceți clic pe Beaver Builder > Themer Layouts din zona dvs. de administrare WordPress. Apoi, selectați Adăugați nou :

creați anteturi și subsoluri cu tema castorului; pasul 1: creați un aspect nou al temei

Aici, puteți da aspectului dvs. un Titlu :

creați anteturi și subsoluri cu tema castorului; Adăugați un antet la WordPress cu Beaver Themer

Pentru Tip , selectați Aspect tematică . Pentru Aspect , utilizați meniul drop-down pentru a alege Antet . Faceți clic pe Adăugați aspectul tematic pentru a continua.

Pasul 2: Configurați setările

Apoi, pe pagina de setări, definiți unde și cum va afișa antetul:

creați anteturi și subsoluri cu tema castorului; Editează-ți antetul cu Beaver Themer
  • Antet lipicios : acest stil de antet rămâne fix în partea de sus a ferestrei browserului pe măsură ce derulați în jos în pagină.
  • Antet suprapus : selectați această opțiune pentru a face fundalul antetului transparent, permițând conținutului să se așeze în partea de sus a ecranului.
  • Locație : alegeți dacă antetul ar trebui să fie afișat pe întregul site sau numai pe anumite pagini.
  • Reguli : controlați vizibilitatea pe baza stării de conectare a utilizatorului sau a altor criterii.

Faceți clic pe Publicare pentru a salva aceste setări.

Pasul 3: personalizați aspectul antetului

Acum că setările dvs. sunt configurate, faceți clic pe Lansare Beaver Builder pentru a deschide noul antet în editor:

creați anteturi și subsoluri cu tema castorului; Accesați editorul Beaver Builder pentru a vă personaliza antetul Beaver Themer

Aici, Beaver Builder vă oferă automat un șablon de antet implicit cu mai multe module, inclusiv cele pentru detalii de contact, pictograme sociale, un titlu și un meniu:

creați anteturi și subsoluri cu tema castorului; Opțiuni implicite furnizate cu antetul Beaver Themer

Puteți șterge aceste module pentru a vă construi antetul de la zero sau, dacă preferați, puteți începe cu un alt șablon de antet prestabilit disponibil în panoul Conținut:

creați anteturi și subsoluri cu tema castorului; Alegeți dintre șabloanele disponibile pentru aspectul antetului Beaver Themer

De asemenea, puteți personaliza fiecare modul cu propriile detalii. De exemplu, puteți adăuga link-uri către conturile dvs. sociale sau puteți edita titlul site-ului. Doar faceți clic pe modulul pe care doriți să îl editați, iar caseta pop-up de setări va apărea pentru personalizare ușoară.

creați anteturi și subsoluri cu tema castorului; Editați titlul site-ului dvs. cu Beaver Builder

Unele module folosesc o conexiune de câmp pentru a genera dinamic conținut. De exemplu, titlul site-ului dvs. poate extrage automat din Titlul site- ului dvs. din setările WordPress. Pentru a elimina această conexiune de câmp, faceți clic pe „X” de lângă ea.

creați anteturi și subsoluri cu tema castorului; Ștergeți conexiunea de câmp din antetul Beaver Themer

Apoi, introduceți pur și simplu titlul preferat în câmpul de text Titlu :

creați anteturi și subsoluri cu tema castorului; Adăugați un nou titlu la antetul dvs. Beaver Themer

În fila Stil, puteți ajusta culorile, fonturile și multe altele pentru a se potrivi cu aspectul mărcii dvs. Utilizați selectorul de culori pentru a selecta nuanța ideală și alegeți un font care se aliniază cu personalitatea mărcii dvs. În cele din urmă, ajustați dimensiunea fontului folosind glisorul pentru o potrivire perfectă.

creați anteturi și subsoluri cu tema castorului; Personalizarea titlului antetului Beaver Themer

Dacă doriți să rearanjați modulele din antet, faceți clic pe pictograma Mutare și trageți fiecare modul în poziția preferată din aspect:

creați anteturi și subsoluri cu tema castorului; Mutarea modulelor Beaver Builder în antetul dvs

Pentru a actualiza culoarea de fundal a rândului dvs., faceți clic pe pictograma Cheie . În fereastra pop-up Setări rând, accesați fila Stil, apoi derulați la Culoare de fundal și alegeți nuanța dorită:

creați anteturi și subsoluri cu tema castorului; Schimbarea culorii de fundal a antetului dvs

Rețineți că puteți edita orice rând, coloană sau modul în același mod făcând clic pe pictograma Cheie .

Pasul 4: Adăugați conținut la antetul dvs

De asemenea, puteți lua în considerare adăugarea mai multor module la antetul dvs. După cum sa menționat mai devreme, Beaver Builder permite conținut dinamic prin conexiuni pe teren.

Pentru a vă configura propriile conexiuni de câmp, faceți clic pe pictograma + de lângă casetă pentru a vedea câmpurile disponibile:

creați anteturi și subsoluri cu tema castorului; Crearea unei conexiuni de câmp cu Beaver Builder

Apoi, faceți clic pe Conectare pentru a genera conținutul dinamic.

Una dintre cele mai bune părți despre crearea unui antet cu Beaver Builder este că puteți alege oricare dintre modulele pe care să le adăugați la antet. Pentru a accesa modulele disponibile, faceți clic pe pictograma + :

creați anteturi și subsoluri cu tema castorului; Deschiderea barei laterale Beaver Builder

Această acțiune deschide panoul Conținut. Dacă doriți să adăugați sloganul companiei dvs. la antet, pur și simplu găsiți modulul Editor de text și trageți-l în aspectul dvs.:

creați anteturi și subsoluri cu tema castorului; Folosind modulul editor de text Beaver Builder

Când îl plasați pe pagină, va apărea o fereastră pop-up în care puteți adăuga textul dvs. Apoi, treceți la fila Stil pentru a schimba fontul, culoarea și dimensiunea textului:

creați anteturi și subsoluri cu tema castorului; Editarea editorului de text în Beaver Builder

Pentru a ajusta umplutura, pentru a adăuga CSS personalizat sau pentru a încorpora animații în modulul de text, faceți clic pe fila Avansat.

Poate doriți să includeți și un CTA în antet. Pentru a face acest lucru, adăugați un modul Button, apoi utilizați fila General pentru a personaliza textul, introduceți linkul și adăugați o pictogramă:

creați anteturi și subsoluri cu tema castorului; Modul de butoane Beaver Builder

În fila Stil, puteți ajusta lățimea, puteți alege textul și culorile de fundal, inclusiv culorile de trecere cu mouse-ul, și puteți modifica alinierea și umplutura:

creați anteturi și subsoluri cu tema castorului; Personalizați butonul din antet

Procesul este consecvent în toate modulele, indiferent dacă doriți să adăugați o fotografie, un carusel post sau un cronometru.

Cum se creează subsoluri cu tema Beaver (în 4 pași)

Proiectarea unui subsol personalizat pentru site-ul dvs. este, de asemenea, o mișcare inteligentă. Poate ajuta la respectarea reglementărilor și poate îmbunătăți experiența utilizatorului. De exemplu, dacă colectați informații personale, adăugarea unui link către politica dvs. de confidențialitate este benefică. Includerea unei hărți a site-ului poate facilita navigarea utilizatorilor pe site-ul dvs.

În plus, puteți afișa detaliile dvs. de contact pe toate paginile, făcându-le ușor accesibile. S-ar putea chiar să luați în considerare adăugarea unui formular de înscriere pentru a încuraja conversiile.

Pentru a vă crea subsolul personalizat, veți urma un proces similar ca atunci când vă construiți antetul, utilizând pluginul premium de generare a paginii Beaver Builder împreună cu Beaver Themer.

Pasul 1: Configurați un aspect nou al temei

La fel ca în cazul antetului, veți începe prin a crea un aspect pentru subsol. Accesați Beaver Builder > Aspecte tematice și faceți clic pe Adăugați nou .

creați anteturi și subsoluri cu tema castorului; Configurați un aspect nou al temei

Pașii sunt aproape aceiași ca înainte: denumește-ți subsolul, selectează Aspect tematică pentru Tip și alege Subsol pentru aspect :

creați anteturi și subsoluri cu tema castorului; Adăugați un nou subsol cu ​​Beaver Themer

Apoi, faceți clic pe Adăugați aspectul tematicii .

Pasul 2: Configurați setările de subsol

Veți ajunge la o nouă pagină pentru a vă edita aspectul subsolului. Aceste setări sunt mai simple decât cele ale antetului.

Selectați unde doriți să fie afișat subsolul dvs. pe site-ul dvs. web. Utilizați meniul drop-down Locație pentru a seta acest lucru:

creați anteturi și subsoluri cu tema castorului; Editați aspectul subsolului cu Beaver Themer

Faceți clic pe butonul relevant pentru a adăuga reguli de locație și excludere. Alegeți paginile specifice pe care doriți să le includeți sau să le excludeți.

Repetați acest lucru în secțiunea Reguli. După ce sunteți mulțumit de setările pentru subsol, faceți clic pe Publicare .

Pasul 3: Personalizați-vă aspectul subsolului

Acum, selectați Lansați Beaver Builde r pentru a deschide editorul:

Lansați Beaver Builder pentru a vă edita subsolul

Ca și în cazul antetului, Beaver Builder a furnizat un șablon de aspect implicit pentru subsolul dvs.:

Module de subsol Beaver Builder implicite

De exemplu, există o secțiune în care puteți include detaliile de contact ale companiei, linkuri de navigare către resurse utile și o scurtă descriere a afacerii dvs. Puteți fie să ștergeți aceste coloane și să vă creați subsolul de la zero, fie să modificați conținutul existent.

De exemplu, în loc de Resurse suplimentare, ați putea dori să prezentați cele mai populare postări de blog sau pagini de produse. Puteți face acest lucru navigând la pictograma Cheie și selectând Setări titlu :

Setări antet în Beaver Builder

Apoi, în fila General , puteți introduce noul titlu. Comutați la fila Stil pentru a aplica culori personalizate, selecta fonturi unice și ajustați dimensiunea titlului:

Editați titlurile din subsolul dvs. Beaver Themer

Faceți clic pe Salvare pentru a aplica modificările.

Acum, va trebui să adăugați linkurile în caseta de text de mai jos. Din nou, plasați cursorul peste pictograma Cheie și alegeți Setări editor de text .

Aici, puteți șterge intrările curente și le puteți înlocui cu propriile pagini. În editorul de text, puteți adăuga titlurile paginilor dvs. și puteți adăuga link-uri făcând clic pe pictograma Link :

Adăugați linkuri la subsolul dvs. Beaver Themer

Inserați adresa URL și selectați Salvare . De asemenea, puteți adăuga numărul dvs. de contact și adresa de e-mail a companiei în același mod.

Beaver Builder include o notificare privind drepturile de autor în mod implicit. Ajustați-l făcând clic pe modul și adăugând propria declarație:

Editați notificarea privind drepturile de autor în Beaver Themer

Cu aspectul subsolului configurat, este timpul să adăugați conținut care îmbunătățește navigarea și experiența utilizatorului.

Pasul 4: Adăugați conținut la subsolul dvs

Am acoperit elemente esențiale, cum ar fi detalii de contact, link-uri de resurse și o notificare privind drepturile de autor. Cu toate acestea, puteți adăuga orice modul Beaver Builder pentru a vă îmbunătăți aspectul subsolului.

De exemplu, luați în considerare adăugarea unui formular de înscriere pentru a stimula implicarea. Găsiți modulul Formular de abonare și trageți-l în subsol:

Adăugați un formular de abonare la subsolul dvs

Beaver Builder se integrează cu mulți furnizori de e-mail marketing, permițându-vă să alegeți serviciul preferat din meniul drop-down:

Adăugați furnizorul dvs. de e-mail marketing la formularul de înscriere

În această filă, puteți adăuga o casetă de selectare a termenilor și condițiilor sau puteți personaliza mesajul pe care utilizatorii îl văd după abonare.

Treceți la fila Buton pentru a edita textul butonului, pentru a ajusta culorile, pentru a adăuga umplutură și multe altele:

Editați butonul de abonare în formularul de înscriere

S-ar putea să găsiți utilă fila Captcha dacă doriți ca utilizatorii să verifice că nu sunt roboți.

Luați în considerare adăugarea de linkuri către conturile dvs. sociale. Utilizați modulul Icon Group și trageți-l în subsol:

Adăugarea modulului de grup de pictograme în Beaver Builder

Apoi, în fila Pictograme a ferestrei pop-up, faceți clic pe Editați pictograma :

Editați modulul grupului de pictograme Beaver Builder

Faceți clic pe Selectare pictogramă pentru a alege cea relevantă. Veți găsi pictograme pentru principalele platforme de social media precum Facebook, LinkedIn și Twitter. Apoi adăugați linkul la profilul dvs.:

Adăugați pictogramele sociale la subsol

Faceți clic pe Salvați pentru a reveni la locul unde puteți adăuga restul linkurilor sociale:

Adăugarea pictogramelor pentru rețelele sociale la subsol

Continuați să adăugați module la subsol. Când sunteți mulțumit de aspect, faceți clic pe Terminat > Publicați .

Gânduri finale

Creatorii de pagini simplifică designul postărilor și paginilor, dar adesea limitează personalizarea antetelor și subsolurilor. Din fericire, Beaver Themer vă oferă control deplin asupra designului site-ului dvs. web.

Iată o scurtă recapitulare a modului de a crea anteturi și subsoluri cu Beaver Themer:

  1. Creați un nou aspect Beaver Themer.
  2. Configurați setările dvs.
  3. Personalizați-vă aspectul antet și subsol.
  4. Adăugați conținut la antet sau subsol.

Cu acești pași, puteți îmbunătăți funcționalitatea site-ului dvs. și vă puteți asigura că reflectă identitatea dvs. unică de brand.

Întrebări înrudite

Care sunt beneficiile utilizării Beaver Themer pentru anteturi și subsoluri?

Beaver Themer oferă opțiuni extinse de personalizare, permițându-vă să creați anteturi și subsoluri unice care se potrivesc mărcii dvs. Oferă control asupra machetelor și abilitatea de a integra cu ușurință conținut dinamic.

Cum folosești Beaver Themer?

Beaver Themer vă oferă control deplin asupra designului site-ului dvs. web. Puteți edita cu ușurință anteturile, subsolurile, paginile 404 și alte secțiuni esențiale. Începeți prin a crea un nou aspect Themer și configurați setările pentru a gestiona modul în care se afișează conținutul dvs. După aceea, personalizați culorile și adăugați diverse module pentru a îmbunătăți aspectul site-ului dvs

Cum îmi fac antetul compatibil cu dispozitivele mobile?

Pentru a face antetul adaptabil pentru dispozitive mobile, verificați setările de răspuns din Beaver Builder. Puteți ajusta aspectul și dimensiunile fontului special pentru dispozitivele mobile pentru a îmbunătăți gradul de utilizare.

Despre Will Morris

Will Morris este scriitor personal la WordCandy. Când nu scrie despre WordPress, îi place să-și dea rutina de stand-up comedy în circuitul local.

Buletinul nostru informativ

Buletinul nostru informativ este scris personal și trimis aproximativ o dată pe lună. Nu este deloc enervant sau spam.
Promitem.

Alăturați-vă Newsletter-ului

Încercați Beaver Builder astăzi

Beaver Builder