Gillar du att ta med det dynamiska engagemanget i din Facebook-grupp direkt till din WordPress webbplats?
Att bädda in ett Facebook-gruppflöde kan vara ett bra sätt att visa upp interaktioner i gruppen, dela uppdateringar och hålla innehållet på din webbplats uppdaterat. Denna integration hjälper till att överbrygga dina onlinegemenskaper och kan öka besökarnas engagemang.
Under årens lopp har vi använt olika Sociala medier för att driva trafik till våra webbplatser. Det är därför vi förstår styrkorna och utmaningarna med att lägga till ett flöde för sociala medier.
I den här artikeln visar vi dig hur du enkelt lägger till ett Facebook-gruppflöde i WordPress, steg för steg.
Varför add to Facebook Group Content till din site i WordPress?
Facebook är världens mest populära plattform för social media och har 2,9 miljarder användare som är aktiva varje månad, enligt vår statistik från marknadsundersökningar.
Detta gör Facebook-grupper perfekta för att engagera sig med människor som redan känner till ditt varumärke och ansluta till en ny publik.
Faktum är att vår WPBeginner Engage Facebook-grupp har över 98 000 aktiva användare och växer i en otrolig takt.
Facebook-grupper kan hjälpa dig att bygga upp en gemenskap, skapa en känsla av lojalitet och bygga en positiv relation med dina användare.
När folk går med i din grupp kan du främja blogginlägg, företagsuppdateringar eller till och med WooCommerce-produkter utan att behöva spendera några pengar på onlineannonser.
När du har skapat din Facebook-grupp kommer du att vilja främja den och driva människor till den. Det bästa sättet att få din Facebook-grupp att växa är genom att embedda gruppens feed på din WordPress website.
På så sätt kan besökare på din webbplats se allt bra innehåll som du publicerar på Facebook. Detta kommer att uppmuntra dem att kontrollera din grupp, engagera sig i ditt innehåll och kanske till och med klicka på knappen ”Gå med”.
Med detta i åtanke, låt oss se hur man embedar ett Facebook-gruppfeed i WordPress.
Hur man installerar ett Custom Facebook Feed Plugin
Det bästa sättet att embeda ett Facebook gruppflöde i WordPress är att använda Smash Balloon Facebook Feed plugin.
Detta plugin låter dig embed Facebook videoklipp, comments, reviews, community posts, och mer på din WordPress site.
Om du publicerar videoklipp i din Facebook-grupp låter Smash Balloon användarna titta på mediet i en popup med en lightbox utan att lämna din webbplats.
När du har embedat gruppfeeden kommer nya posts att visas på din site automatiskt. Detta gör det till ett enkelt sätt att hålla din site fräsch, även för vanliga besökare.
Obs/observera: I den här przewodniken kommer vi att använda Pro-versionen av Smash Balloon, eftersom den tillåter dig att visa Facebook-album, videoklipp och foton på din WordPress-webbplats. Det finns dock även en gratis version som låter dig enkelt bädda in inlägg med Facebook-status i WordPress.
Först måste du installera och aktivera Smash Balloon Facebook Feed-pluginet. För mer detaljer, se vår guide om hur du installerar ett plugin för WordPress.
Vid aktivering, besök Facebook Feed ” Settings page och enter din licensnyckel i fältet ’License Key’.
Du hittar den här informationen på din webbplats på Smash Balloon.
När du har enter nyckeln klickar du bara på knappen ”Activate”.
Så här addar du appen Smash Balloon till din Facebook-grupp
Nu måste du add to Smash Balloons Facebook app till den Facebook grupp som du vill visa på din WordPress website.
Note: På grund av hur Facebook API är inställt kan Smash Balloon bara visa posts som gjordes efter att du addade appen till din Facebook-grupp.
Med det i åtanke, låt oss gå vidare och installera appen innan vi gör något annat. I en ny tabs, logga bara in på Facebook och gå till din Facebook-grupp.
I menyn till vänster klickar du sedan på ”Group settings”.
Efter det måste du rulla till sektionen ”Hantera avancerade inställningar”.
Här klickar du på ikonen med pennan bredvid ”Apps”.
Detta öppnar en popup som visar alla de appar som du redan har addat till den här gruppen.
Eftersom vi vill installera appen Smash Balloon måste du klicka på ”Add Apps”.
I sökfältet skriver du in ”Smash Balloon WordPress”.
När rätt app dyker upp är det bara att ge den ett click.
Nu visas en popup med all information som appen kan komma åt och alla actions som den kan utföra.
Om du vill fortsätta och installera appen klickar du på ”Add”.
Efter några ögonblick bör du se ett message som säger att du utan problem har addat appen Smash Balloon till din Facebook-grupp.
Anslut Smash Balloon till din Facebook-grupp
Nu är det dags att ansluta din Facebook-sida till WordPress. För att göra detta, besök Facebook Feed ” Alla fl öden och klicka på ” Lägg till nytt”.
Med Smash Balloon kan du visa foton, händelser, videoklipp, album och mycket mer.
Eftersom vi vill embeda vår Facebook group feed, click on ’Timeline’ and then select ’Next’.
Efter det måste du välja den Facebook-grupp där du kommer att få timeline från.
För att komma igång klickar du bara på ”Add New”.
På nästa vy väljer du alternativknappen bredvid ”Grupp”.
Efter det klickar du bara på ”Anslut till Facebook”.
Detta öppnar en popup där du kan logga in på ditt Facebook-konto. Välj sedan den grupp som du vill använda.
När du har kontrollerat boxen bredvid en eller flera grupper klickar du bara på ”Next”.
Du bör nu se en popup som ber dig att installera appen Smash Balloon WordPress.
Eftersom vi redan installerat den här appen kan du gå vidare och klicka på ”Klar”.
Så här skapar du ett Facebook Group Feed i WordPress
Nu har du lagt till din Facebook-grupp i Smash Balloon, den kommer att visas som ett alternativ. Klicka bara för att selecta gruppen och klicka sedan på ”Next”.
På den här vyn kan du välja en template som du vill använda för att skapa en custom Facebook Feed i WordPress.
Alla dessa templates är helt anpassningsbara, så du kan finjustera designen beroende på hur du vill visa status updates, videoklipp och foton från din Facebook-grupp.
Vi använder templaten ”Simple Masonry”, men du kan välja vilken template du vill.
Smash Balloon kommer nu att gå vidare och skapa flödet för sociala medier baserat på din Facebook-grupp och den template du har valt.
Detta är en bra början, men Smash Balloon har massor av settings som du kan använda för att customize hur detta gruppflöde ser ut på din WordPress blogg.
Hur man Customize din Facebook Group Feed
Tillägget Smash Balloon ger dig många sätt att anpassa hur flödet visas på din webbplats. Det är värt att utforska vilka ändringar du kan göra.
På vyn Facebook Feed ” All Feeds, hitta ditt gruppflöde och klicka sedan på knappen ”Edit”, som gillar en liten penna.
Detta öppnar Smash Balloon Facebook Feed Editor, som visar en preview av din Facebook timeline i WordPress.
På vänster sida ser du alla de olika settings som du kan använda för att customize hur posts visas på din site. De flesta av dessa inställningar är självförklarande, men vi kommer snabbt att täcka några viktiga områden.
Om du vill ändra den template du använder klickar du bara på ”Template”.
Välj sedan knappen ”Change”.
Till att börja med kan du ändra hur dina gruppinlägg visas genom att clicka på ’Feed Layout’.
På den här vyn kan du växla mellan layouts för masonry och lista och ändra höjden på feeden. När du gör ändringar uppdateras previewen automatiskt, så att du kan prova olika settings för att se vad som ser bäst ut för din Facebook-grupp.
Som standard visar Facebook-gruppfeeden olika antal posts på stationära datorer och mobila enheter.
You can preview how your feed will look on desktop computers, tablets, and smartphones using the row of buttons in the upper-right corner.
När du har testat mobilversionen av din website WordPress kanske du vill ändra antalet posts som du visar på smartphones och surfplattor.
För att göra denna ändring, hitta bara ”Number of Posts” section och skriv in ett annat nummer i ”Mobile” fältet.
Du kanske också vill visa färre Column på smartphones och surfplattor genom att ändra inställningarna för ”Column”.
I Följer image delar vi till exempel upp innehållet i 3 columns på desktop, 2 columns på tablets och 1 column på mobile devices.
När du är nöjd med layouten klickar du på länken ”Customize”.
Detta kommer att ta dig tillbaka till huvud Smash Balloon editor, redo för dig att gå vidare till nästa inställningar vy, som är ”Färgschema”.
Som standard använder Smash Balloon samma färgschema som ditt theme i WordPress, men på den här vyn kan du byta till ett ”Light” eller ”Dark” färgschema.
Ett annat alternativ är att designa ditt eget färgschema genom att välja ”Customize” och sedan använda kontrollerna för att ändra bakgrundsfärgen, ändra textfärgen i WordPress och mer.
Du kan add to en header ovanför ditt gruppfeed, som kan innehålla content såsom din grupps profilbild och namn. Detta kan hjälpa besökarna att förstå vilket content de ser och hur de kan hitta din grupp på Facebook.
För att add to en header section klickar du på ”Header” i menyn till vänster.
På den här vyn klickar du på slidern ”Aktivera” för att ändra den från grå till blå.
När du har lagt till en header section kan du använda kontrollerna för att ändra storleken på headern, ändra bakgrundsfärg, dölja eller visa din Facebook-profilbild med mera.
Om du vill ta bort headern när som helst, klicka bara på för att stänga av ”Enable” toggle.
Efter det kan du ändra hur de enskilda posterna ser ut i ditt gruppflöde genom att välja ”Post Style” i menyn till vänster.
Till att börja med kan du välja mellan layouts för inläggsminiatyrer, halvbredd och full width.
Layouten thumbnail visar din WordPress Facebook Feed med små images.
Du kan se ett exempel på detta i följande image.
Vill du visa större images istället?
Sedan kan du välja halvbredd som layout för din post.
Slutligen, om du vill visa ditt Facebook feed med de största möjliga images, då kan du välja full width layout.
Här är ett exempel på hur detta kommer att se ut på din WordPress website:
När du är nöjd med den allmänna layouten är det dags att finjustera det specifika innehållet i varje post.
För att komma igång klickar du på ”Post Style”.
På den här vyn kan du välja mellan en vanlig layout och en boxad layout.
Om du selectar ”Boxed” kan du skapa en bakgrundsfärg för varje post. You can also make the border radius larger to create curved corners and add to a box shadow.
Om du väljer ”Regular” kan du ändra tjockleken och färgen på den linje som separerar dina olika posts på social media.
I Följer image har vi lagt till en tjockare linje i gruppfeeden och ändrat dess färg.
Du kan också customize de enskilda delarna i varje post genom att gå tillbaka till huvudinställningsvyn.
Markera återigen ”Post Style”, men den här gången väljer du istället ”Edit Individual Elements”.
Du kommer nu att se alla de olika content som Smash Balloon innehåller i varje post, till exempel postens författare, datum, delning av länk box, och mer.
För att remove ett content från dina posts, clickar du bara för att avmarkera dess box.
Du kan också customize hur varje content type ska se ut genom att clicka på den.
I följande image kan du till exempel se inställningar för att ändra storlek och färg på links för ”post action”, som gillar, delar och comment.
You can also change the ”View on Facebook” text by typing into the ”Customize Text” field.
Som standard lägger Smash Balloon inte till en ” Gilla”-knapp på Facebook i ditt feed. Den här knappen gör det lättare för besökare att gå med i din grupp, så du kanske vill lägga till den i ditt feed genom att välja inställningarna för ”Gilla box”.
Sedan klickar du bara på ”Aktivera” så att toggeln blir blå.
Du kan nu använda dropdown ’Position’ för att add to like box under eller ovanför gruppfeeden.
Du kan också använda dessa settings för att ändra bredden på boxen eller add to gruppens cover photo.
Ett stort antal följare är ett bra socialt bevis som kommer att uppmuntra fler människor att gå med i din Facebook-grupp. Med det i åtanke kanske du vill klicka för att aktivera knappen ”Visa fans”.
När du är nöjd med hur knappen ”Gilla” är konfigurerad kan du gå vidare till inställningarna för ”Ladda mer-knappen”.
Knappen ”Load More” ger besökarna ett enkelt sätt att rulla igenom mer av ditt feed. Om de gillar det här innehållet kanske de bestämmer sig för att gå med i din Facebook-grupp.
Med detta i åtanke kanske du vill få den här knappen att sticka ut genom att ändra bakgrundsfärg, hovering och textfärg.
Den här knappen visar ”Load More” som standard, men du kan add to ett custom message genom att skriva det i fältet ”Text”.
Smash Balloon har en utvald lightbox-funktion som allow besökarna att titta på din grupps videoklipp och ta en närmare titt på dina foton utan att lämna WordPress.
Besökare kan helt enkelt clicka på en video thumbnail eller foto thumbnail för att öppna lightbox popup.
De kan sedan rulla genom resten av bilderna och videoklippen i your feed med hjälp av pilarna, på samma sätt som när du embedar ett Facebook-album i WordPress.
För att customize standard lightbox, välj ”Lightbox” i menyn till vänster.
Här kan du ändra färgen på lightboxens text, links och bakgrund.
Popupen (okno) lightbox gör det enkelt för besökare att utforska ditt flöde och tillåter dem att rulla genom dina foton och videoklipp utan att besöka din Facebook-grupp.
Om du vill få fler besökare till din Facebook-grupp kanske du vill inaktivera funktionen lightbox. För att göra detta klickar du helt enkelt på ”Aktivera”-togglet så att det går från blått till grått.
Nu, om en visitor klickar på ett foto eller videoklipp i gruppfeeden, kommer de att tas till din Facebook-grupp i en new tab.
När du är nöjd med hur gruppflödet på Facebook ser ut, kom ihåg att klicka på ”Spara” för att butik dina ändringar.
Du är nu redo att add to denna feed till din WordPress website.
Så här embedar du din Facebook Group Feed i WordPress
Du kan add your Facebook group feed till WordPress med hjälp av ett block, widget eller shortcode.
Om du har skapat mer än ett feed med Smash Balloon måste du känna till feedens kod om du ska använda ett block eller widget.
För att få den här informationen går du helt enkelt till Facebook Feed ” All Feeds och kopierar sedan texten under ”Shortcode”.
I följande image måste vi använda custom-facebook-feed feed=1
.
Om du vill embeda ditt Facebook-gruppflöde på en page eller i ett post kan du använda blocket ”Custom Facebook Feed”.
Öppna bara den page eller det post där du vill embedda Facebook feed. Klicka sedan på ikonen ”+” för att lägga till ett nytt block och börja skriva ”Custom Facebook Feed”.
När Facebook-blocket visas klickar du för att add to din page eller post.
Blocket kommer att visa ett av dina Smash Balloon feeds som standard. Om detta inte är ditt Facebook-gruppfeed hittar du sektionen ”Shortcode Settings” i den högra menyn.
Du kan nu gå vidare och add to thecustom-facebook-feedfeed=1code
och sedan click på knappen ”Tillämpa ändringar”.
Efter det är det bara att publicera eller updating sidan för att göra gruppfeeden live på din website.
Ett annat alternativ är att add the feed to any widget-ready area, such as the sidebar or similar section. This allows visitors to see your group feed no matter where they are on your website.
För att komma igång går du bara till Appearance ” Widgets i WordPress dashboard och klickar sedan på den blå ”+”-knappen.
När du har gjort det, börja skriva ”Custom Facebook Feed” i sökfältet.
När rätt widget visas drar du den till den plats där du vill visa feeden.
Widgeten visar ett av de feeds som du skapade med Smash Balloon.
Om detta inte är ditt Facebook-gruppflöde, skriv sedan feedens kod i boxen ”Shortcode Settings”. Klicka sedan på ”Tillämpa Changes”.
Du kan nu clicka på knappen ”Update” för att göra widgeten Live. För mer information, se vår kompletta guide om hur du lägger till och använder widgetar i WordPress.
Slutligen kan du embed Facebook grupp feed på någon page, post, eller widget-ready area med hjälp av en shortcode.
Gå bara till Facebook Feed ” All Feeds och kopiera all kod i kolumnen ’Shortcode’. Du kan nu add to denna kod till alla shortcode block.
För mer information, vänligen se vår detaljerade guide om hur du lägger till en shortcode i WordPress.
Obs: Om du använder ett blockaktiverat tema kan du använda hela Site Editor för att add to blocket ”Custom Facebook Feed” var som helst på din webbplats.
Bonus: Få fler Facebook gillar med hjälp av WordPress
Om du har en Facebook page för din online store eller ditt företag vill du att användarna besöker den och gillar ditt Facebook content för att add to social proof och få fler följare.
Ett sätt att göra detta är att lägga till din Facebook Group feed på din website. Men du kan också add to en Facebook gilla och delningsknapp nästa inlägg på din blogg för att uppmuntra användare att dela ditt content med sina vänner.
För att ytterligare öka dina följare på Facebook kan du skapa ett automatiserat arbetsflöde med Uncanny Automator. På så sätt kommer ett Facebook-post automatiskt att gå live varje gång du publicerar ett post på din website.
För detaljer, se vår tutorial om hur du automatiskt postar till Facebook från WordPress.
Du kan också run giveaways och tävlingar på din Facebook-grupp, svara på kommentarer på dina inlägg och till och med lägga till en Facebook kalender för händelser på din website.
Detta kommer att bidra till att lägga till socialt bevis och öka dina följare på din Facebook-grupp eller sida.
För fler förslag, se vår guide för nybörjare om snabba sätt att få fler Facebook gillar med WordPress.
Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till en Facebook-grupp på din WordPress webbplats. Du kanske också vill se vår kompletta fusklapp för Sociala medier eller se våra expertval för de bästa Facebook-tilläggen för din blogg.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Syed Balkhi says
Hey WPBeginner readers,
Did you know you can win exciting prizes by commenting on WPBeginner?
Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
You can get more details about the contest from here.
Start sharing your thoughts below to stand a chance to win!
Klaus Juhl says
Can you add a private Facebook group to a website? Or does it have to be public?
WPBeginner Support says
Due to Facebook’s restrictions the group would need to be public.
Administratör
Jiří Vaněk says
Previously, I displayed Instagram and Twitter on my website. Eventually, through speed testing, I found out that it significantly slowed down the website loading because it fetched data from additional third-party servers. So, I moved the feeds from the right menu to their dedicated pages, linked separately, to prevent these feeds from being everywhere and slowing down the site. It’s essential to be cautious about this and measure speed. Additionally, I use Smash Baloon for feeds, and I’m satisfied with it.
Matt says
Thanks guys, I’ve been waiting to do something like this for a while.
WPBeginner Support says
Glad to hear our guide was helpful!
Administratör
Steph says
Can you add a private Facebook group to a website? Or does it have to be public?
Chloe says
Question about the below tip from your article. How do I set my privacy settings to allow the app to access my photos? Is this a Facebook setting? Thanks!
Tip: Are some photos or posts missing from your feed? This means those users have set their privacy settings to prevent apps from accessing some or all of their content.
WPBeginner Support says
Unless we hear otherwise, when setting up the plugin you are setting up your access.
Administratör
Amy says
i love that i can integrate my facebook group (not just Facebook pages) with my site!
WPBeginner Support says
Glad we could share how to do this
Administratör
TemidayoRiches says
Thanks for this. Can the same be done with a Facebook page
WPBeginner Support says
Yes, you should have the option to select a Facebook page as well
Administratör