Cum să adăugați o casetă de aprecieri / fan box Facebook în WordPress

Ați muncit din greu pentru a vă construi audiența pe Facebook, dar vizitatorii site-ului dvs. nu se conectează cu pagina dvs. Frustrant, nu-i așa?

Am testat diverse moduri de a integra Facebook cu WordPress și am constatat că un simplu Like Box poate face o diferență reală în creșterea numărului de urmăritori pe rețelele sociale.

O casetă Facebook Like Box plasată corespunzător face legătura între site-ul dvs. și rețelele sociale, permițând vizitatorilor să interacționeze cu pagina dvs. de Facebook fără a părăsi site-ul. Este una dintre acele mici adăugiri care pot avea un impact mare asupra dovezii sociale.

În acest ghid, vă vom arăta două metode simple pentru a adăuga o casetă de Like-uri Facebook pe site-ul dvs. WordPress: o abordare cu un plugin pentru caseta de Like-uri Facebook și o soluție bazată pe cod.

De ce să adăugați o casetă de Like-uri Facebook pe site-ul dvs. WordPress?

Adăugarea unei casete de apreciere Facebook pe site-ul dvs. WordPress are câteva avantaje grozave.

În primul rând, ajută la implicarea oamenilor, permițându-le să aprecieze cu ușurință pagina dvs. de fani sau pagina de afaceri de pe Facebook. Acest lucru înseamnă că postările dvs. vor apărea în fluxul lor de Facebook, astfel încât să puteți continua să ajungeți la oameni dincolo de site-ul dvs. web.

De asemenea, Facebook Like Box-ul paginii arată câte persoane au apreciat pagina dvs. de Facebook. Acest lucru poate funcționa ca dovadă socială și poate încuraja mai mulți vizitatori să facă clic pe „Apreciază”.

Acest tutorial vă va arăta două modalități de a adăuga un Facebook Like Box: una folosind un plugin social și cealaltă cu cod. Puteți utiliza linkurile rapide de mai jos pentru a naviga prin articolul nostru:

• Metoda 1: Utilizarea unui plugin pentru caseta de Like-uri Facebook în WordPress (Ușor pentru începători)
• Method 2: Adding a Facebook Like Box With Code

Metoda 1: Utilizarea unui plugin pentru caseta de Like-uri Facebook în WordPress (Ușor pentru începători)

Această primă metodă este cea mai ușoară și recomandată pentru începători pentru a adăuga o casetă de like-uri Facebook pe site-urile lor. De asemenea, îți va permite să afișezi fluxul tău de Facebook pe site-ul tău, dacă dorești.

Această metodă folosește Smash Balloon, un plugin WordPress ușor de utilizat, care vă permite să încorporați diverse fluxuri de social media în WordPress, împreună cu un Like Box.

Pentru acest tutorial, puteți utiliza versiunea gratuită a pluginului Smash Balloon Social Post feed. Dar dacă doriți mai multe funcționalități dincolo de Caseta de aprecieri (cum ar fi afișarea videoclipurilor, fotografiilor și evenimentelor), atunci vă recomandăm să faceți upgrade la versiunea Pro.

Configurați pluginul Smash Balloon Facebook Feed

Mai întâi, trebuie să instalezi pluginul WordPress din zona de administrare. După aceea, mergi la Facebook Feed » Toate fluxurile și apasă pe „Adaugă nou”.

Acum, selectați tipul de flux „Cronologie”.

Apoi, pur și simplu faceți clic pe butonul „Următorul”.

În acest stadiu, va trebui să conectați pagina dvs. de Facebook la site-ul dvs. WordPress.

Ceea ce trebuie să faceți este să faceți clic pe butonul „Adăugare nou”.

Smash Balloon te va direcționa către un nou ecran.

Aici, selectați doar „Pagină” pentru tipul de sursă și apoi faceți clic pe „Conectare la Facebook”.

Acum, trebuie să vă conectați la contul dvs. de Facebook.

După aceea, alegeți ce pagină(e) pentru care doriți să afișați Like Box pe blogul dvs. WordPress sau pe site-ul dvs. web. Apoi, faceți clic pe „Next”.

Veți vedea acum setările de permisiuni ale Smash Balloon. Recomandăm activarea tuturor pentru a vă asigura că totul funcționează bine.

Acum, continuați și faceți clic pe „Terminat”.

Ultima fereastră pop-up va confirma pur și simplu că ai conectat cu succes Smash Balloon cu Facebook.

Pur și simplu faceți clic pe „OK” pentru a continua.

Smash Balloon te va redirecționa acum către zona de administrare, unde trebuie să selectezi o pagină de Facebook pe care să o folosești în fluxul tău de timeline.

Doar alegeți o pagină și faceți clic pe „Adăugați”.

Veți vedea acum pagina de Facebook pe care tocmai ați conectat-o ca sursă în pagina plugin-ului Smash Balloon.

Pur și simplu selectați aceasta și faceți clic pe „Următorul”.

Personalizați caseta de Like-uri Facebook

În această etapă, Smash Balloon vă va duce la editorul de fluxuri Facebook.

Primul pas este să faceți clic pe „Feed Layout” deasupra opțiunii Color Scheme.

Derulați pur și simplu în jos la secțiunea „Număr de postări”.

După aceea, setați numărul atât pentru Desktop, cât și pentru Mobile la 0. Acest lucru va elimina afișarea tuturor postărilor dvs. recente și va face ca fluxul să afișeze doar Like Box-ul.

Alternativ, dacă doriți să afișați și fluxul dvs. de Facebook împreună cu Like Box, atunci puteți urma tutorialul nostru despre cum să creați un flux personalizat de Facebook în WordPress.

Acum, reveniți sus.

Apoi, faceți clic pe „Personalizare” pentru a reveni la pagina editorului de feed.

În această etapă, puteți elimina antetul fluxului dvs. Facebook.

Ceea ce trebuie să faceți este să coborâți la secțiunea „Sections” și să selectați „Header”.

Această setare de antet determină cum va arăta antetul fluxului dvs. Facebook.

Dar, în acest caz, trebuie să o ascundeți, așa că pur și simplu dezactivați comutatorul „Activare”.

Să ne întoarcem acum la pagina principală de editare a fluxului și să deschidem setarea „Like Box”. După aceea, pur și simplu activați funcția „Like Box”.

Pe această pagină, puteți ajusta, de asemenea, dimensiunea Like Box-ului, poziția, afișarea fotografiei de copertă, lățimea personalizată, textul personalizat al apelului la acțiune și așa mai departe.

Odată ce ați terminat, apăsați butonul „Salvare” din colțul din dreapta sus.

Încorporați caseta Facebook Like Box pe pagina sau postarea dvs. WordPress

În această etapă, puteți afișa Facebook Like Box pe o pagină sau într-o zonă pregătită pentru widget-uri, cum ar fi o bară laterală.

Pentru a face acest lucru, faceți clic pe „Încorporați” în colțul din dreapta sus. Acum, va apărea fereastra pop-up Încorporați flux, oferindu-vă două opțiuni pentru a afișa Caseta de aprecieri.

Una este să folosiți un shortcode, iar cealaltă este să o adăugați direct într-o pagină sau într-o zonă pregătită pentru widget. A doua opțiune este mult mai ușoară, așa că vă vom arăta mai întâi acea metodă.

Dacă doriți să adăugați Caseta de aprecieri la o anumită pagină, faceți clic pe butonul „Adăugați la o pagină”.

Acum, selectați doar o pagină la care doriți să adăugați funcționalitatea și faceți clic pe „Adăugare”.

Veți ajunge acum la editorul de blocuri Gutenberg.

Continuați și faceți clic pe butonul „+ Adăugați un bloc”, așa cum a fost indicat de Smash Balloon.

Odată ce biblioteca de inserare a blocurilor este deschisă, trebuie să găsiți blocul Facebook Feed.

Apoi, pur și simplu trageți-l și plasați-l oriunde arată cel mai bine pe pagină.

În bloc, selectați fluxul Facebook cu Like Box-ul pe care tocmai l-ați creat anterior.

Blocul va afișa apoi Like Box-ul.

Dar ce se întâmplă dacă aveți mai multe pagini de Facebook și ați configurat un Like Box pentru fiecare dintre ele folosind Smash Balloon?

De asemenea, puteți comuta între ele în bara laterală a setărilor blocului, selectând un feed din meniul derulant „Selectați un feed”.

Tot ce trebuie să faci acum este să dai clic pe butonul „Actualizare” pentru a face modificările oficiale.

Iată cum arată Like Box-ul nostru pe site-ul nostru demo:

Dacă utilizați o temă WordPress de tip bloc, atunci puteți folosi și Editorul complet al site-ului pentru a adăuga blocul Facebook Like Box la șabloanele de pagină ale temei dvs.

Pentru mai multe informații despre Editorul Complet al Site-ului, citește ghidul nostru pentru începători despre Editarea Completă a Site-ului.

Încorporați widgetul Facebook Like Box în WordPress

Dacă folosești o temă WordPress clasică, atunci s-ar putea să vrei să afișezi caseta de like-uri Facebook într-o zonă pregătită pentru widget-uri, cum ar fi o bară laterală, un antet sau un subsol. Este o modalitate excelentă de a afișa caseta de like-uri fără a distrage utilizatorii de la conținutul principal de pe pagină.

În fereastra pop-up Embed Feed, selectați „Adăugare la un widget” pentru a accesa editorul de widgeturi bazat pe blocuri.

Acum, la fel ca în metoda anterioară, faceți clic pe butonul „+ Add Block”, găsiți blocul Facebook Feed și trageți-l în zona dorită.

Pe site-ul nostru demo, dorim să folosim Like Box ca un widget de bară laterală WordPress.

În bloc, selectați Fluxul Facebook cu Caseta de aprecieri pe care l-ați creat anterior.

Apoi, faceți clic pe „Actualizare” pentru a face modificările live.

Și ați terminat!

Iată cum arată bara laterală pe site-ul nostru de test cu widgetul Caseta de aprecieri:

Încorporați widgetul Facebook Like Box cu un Shortcode

Dacă cele două metode anterioare nu funcționează, atunci recomandăm adăugarea Facebook Like Box sau Fan Box folosind un shortcode.

Pur și simplu copiați shortcode-ul din fereastra pop-up Embed Feed de mai devreme și adăugați-l oriunde pe site-ul dvs.

Pentru mai multe informații despre utilizarea shortcodurilor, poți citi ghidul nostru despre cum să adaugi shortcoduri în WordPress.

Metoda 2: Adăugarea unui Facebook Like Box cu cod

Dacă sunteți interesat doar de afișarea unei cutii de fani Facebook sau a unei cutii de aprecieri fără a adăuga alte tipuri de fluxuri Facebook, atunci utilizarea unui plugin pentru pagina Facebook poate părea exagerată. În acest caz, puteți adăuga cutia de aprecieri folosind cod în schimb.

Această metodă poate părea intimidantă pentru începători, dar vă vom arăta o modalitate sigură de a insera cod folosind WPCode. Este un plugin WordPress care facilitează adăugarea de fragmente de cod personalizate în WordPress fără a vă afecta site-ul.

Pentru acest ghid, versiunea gratuită WPCode este suficientă, deși puteți face upgrade la versiunea Pro pentru funcții avansate, cum ar fi modul de testare și o bibliotecă de fragmente de cod bazată pe cloud.

Mai întâi, să instalăm pluginul în WordPress. Odată activat, accesează Code Snippets » + Add Snippet. Apoi, selectează „Add Your Custom Code (New Snippet)” și apasă pe „+ Add Custom Snippet”.

Veți ajunge acum la editorul de cod. Să dăm mai întâi un nume fragmentului dvs. de cod personalizat, astfel încât să îl puteți identifica ușor mai târziu. Pentru acesta, îl vom numi „Facebook JavaScript SDK”, deoarece acesta este ceea ce vom adăuga aici.

Acum, păstrează această filă deschisă și creează o filă nouă în browser pentru a accesa pagina Dezvoltatori Facebook.

În meniu, faceți clic pe „Autentificare” pentru a vă conecta la contul dvs. de Facebook.

Dacă este prima dată când accesați pagina, completați expertul de onboarding pentru a crea un cont gratuit.

Veți fi apoi direcționat către tabloul de bord al dezvoltatorilor Facebook. Să facem clic pe butonul „Creare aplicație”.

Pe pagina următoare, selectați doar „Altele” pentru cazul de utilizare.

După aceea, faceți clic pe butonul „Next”.

Acum, veți vedea toate aplicațiile diferite pe care le puteți crea pentru pagina dvs. de Facebook.

Pentru a crea un Like Box, puteți selecta pur și simplu „Business” și apoi faceți clic pe „Next”.

Acum să dăm un nume aplicației noastre. Poate fi orice doriți, deoarece acesta este doar pentru referință. Puteți introduce, de asemenea, adresa dvs. de e-mail și selectați un Cont de Afaceri opțional.

În cele din urmă, faceți clic pe „Creați aplicația”.

Să mergem acum la pagina Dezvoltatori Facebook pentru pluginuri sociale.

Apoi, derulați în jos până când găsiți o secțiune similară cu cea din captura de ecran de mai jos:

Aici, asigurați-vă că completați pagina dvs. de Facebook URL, goliți câmpul „Tabs” și specificați lățimea și înălțimea Like Box-ului, dacă este necesar.

De asemenea, puteți alege să utilizați un antet mai mic, să dezactivați fotografia de copertă și multe altele. Am ales, de asemenea, să adaptăm Like Box pentru a se potrivi lățimii containerului, astfel încât dimensiunea să se ajusteze în mod responsiv la locul unde este plasat pe site.

Odată terminat, faceți clic pe butonul „Obțineți codul”. Veți vedea apoi o fereastră pop-up care vă arată două tipuri de fragmente de cod: JavaScript SDK și iFrame. Ambele vor afișa Caseta de aprecieri, dar, în general, JavaScript SDK este o opțiune mult mai bună.

SDK-urile JavaScript sunt de obicei mai rapide deoarece sunt încorporate direct în pagina web, permițându-le să se încarce ca parte a documentului principal. iFrame-urile necesită încărcarea unui întreg document HTML, ceea ce poate încetini timpul de încărcare a paginii.

În fila SDK JavaScript, asigurați-vă că a fost selectat numele aplicației pe care l-ați creat anterior.

Apoi, copiați codul API al SDK-ului JavaScript din Pasul 2. Acum, păstrați această filă deschisă, dar comutați la fila WPCode și lipiți codul acolo.

Puteți lăsa tipul de cod ca „HTML Snippet”.

Acum, derulați în jos la secțiunea „Inserare”.

Metoda de inserare poate fi lăsată ca „Inserare automată”, în timp ce Locația ar trebui modificată în „Corpul întregului site”.

În final, pur și simplu activați codul și faceți clic pe „Salvează fragment”.

Apoi, veți crea un al doilea fragment de cod. Puteți urma aceiași pași ca înainte și să-l numiți ceva de genul „Facebook Like Box”.

După aceea, comutați la pagina Dezvoltatori Facebook pentru pluginuri sociale de mai devreme și copiați codul de la Pasul 3.

Navigați din nou la fila WPCode și lipiți codul Pasul 3 în caseta de previzualizare a codului. Tipul de cod poate fi „Fragment HTML”.

Să derulăm în jos la secțiunea „Inserare”.

Dacă utilizați „Inserare automată”, atunci puteți face ca fereastra de aprecieri să apară automat în mai multe locuri care se potrivesc categoriei Locație.

În exemplul nostru, am decis să alegem locația „Antetul întregului site”, ceea ce înseamnă că Like Box va apărea în antet.

Există și alte opțiuni, cum ar fi Insert Before Post, pentru a afișa caseta de like-uri înainte de toate postările de pe blogul tău WordPress.

Pe de altă parte, metoda „Cod scurt” vă permite să creați un cod scurt personalizat.

Puteți apoi să îl adăugați la anumite părți ale site-ului dvs. web folosind blocul shortcode.

Odată ce ați configurat setările de inserare, pur și simplu activați codul și faceți clic pe „Salvare fragment”.

Acesta este tot! Puteți apoi să vizitați site-ul dvs. pentru a vedea cum arată Like Box-ul:

Pentru mai multe ghiduri despre afișarea fluxurilor sociale pe site-ul dvs. WordPress, consultați articolul nostru despre adăugarea fluxurilor de social media în WordPress.

Bonus: Mai multe moduri de a integra Facebook cu WordPress

Doriți să duceți integrarea Facebook la nivelul următor? Consultați aceste ghiduri suplimentare:

• Cum să creați un popup Facebook Like Box în WordPress – Creșteți implicarea cu un popup Like Box cronometrat strategic.
• Cum să încorporați postări de status Facebook în WordPress – Partajați actualizări specifice de pe Facebook direct pe site-ul dvs.
• Cum să încorporezi un flux de grup Facebook în WordPress – Afișează discuțiile comunității tale pe site-ul tău.
• Cum să afișezi recenziile paginii tale de Facebook în WordPress – Prezintă dovada socială cu recenzii de la clienți de pe Facebook.
• Moduri rapide de a obține mai multe aprecieri pe Facebook folosind WordPress – Implementați aceste strategii pentru a vă crește numărul de urmăritori pe Facebook.
• Cum să afișați Twitter și Facebook-ul autorilor pe pagina de profil – Conectați-vă cititorii cu colaboratorii dvs. pe rețelele sociale.
• Cum să adăugați reacții de Like Facebook la postările dvs. WordPress – Aduceți funcționalitatea populară de reacții a Facebook la postările dvs. de blog.
• Cum să creezi o pagină de destinație pentru reclame Facebook în WordPress – Creează pagini de destinație cu conversie ridicată pentru campaniile tale de reclame Facebook.
• Cum să postezi automat pe Facebook din WordPress – Simplifică-ți strategia de social media cu postări automate.

Sperăm că acest articol v-a ajutat să învățați cum să adăugați o casetă de Like-uri Facebook sau o casetă de Fani în WordPress. De asemenea, ați putea dori să consultați fișa noastră completă de referință pentru rețelele sociale și lista celor mai bune plugin-uri pentru rețelele sociale pentru WordPress.

Dacă ți-a plăcut acest articol, te rugăm să te abonezi la canalul nostru de YouTube pentru tutoriale video WordPress. Ne poți găsi, de asemenea, pe Twitter și Facebook.