Vill du enkelt kunna displayed antalet följare på sociala media som text i WordPress?
Displaying social media followers count allows you add social proof to your website, strengthens your brand identity, and helps you grow your business.
I den här artikeln kommer vi att visa dig hur du enkelt kan visa antalet följare på sociala medier som text i WordPress.
Why Show Social Media Followers Count on Your Website?
You may have noticeed that many of the popular blogs, influencers, and brands proudly display their social media follower count on their websites.
Followers count hjälper dig att add to social proof till din website WordPress. This allows you to earn users’ trust and build brand identity by showing your previous customers and followers as proof.
Dessutom hjälper det dig att få fler följare på dina profiler på sociala media samtidigt som du ger användarna praktiska sätt att hålla kontakten.
Tyvärr är det inte så enkelt eller enkelt att visa antalet följare på sociala medier som vi gillar att det ska vara, men det är definitivt möjligt.
Många sociala media-plattformar kräver API keys för att hämta denna information, och var och en av dem har olika sätt att göra detta.
Lyckligtvis finns det flera WordPress tillägg och lösningar som gör det möjligt för dig att visa antalet följare på sociala medier.
Med detta sagt kommer vi att visa dig olika sätt att displayed ditt antal följare på sociala media på din WordPress website. Du kan välja det som fungerar bäst för dig:
Metod 1: Visa antal följare på sociala medier med hjälp av ett plugin
Den här metoden är enklare och allow you att hoppa över kravet på API Keys om du inte kan få tag på dem.
Det är dock lite opålitligt och kanske inte kan hämta antalet följare i realtid. Det beror på att plattformar för sociala medier ändrar sina API key-metoder ganska ofta, vilket bryter applikationer som använder de gamla metoderna.
Det som är bra är att pluginet ger ett alternativ för att enter dina följare på sociala medier manuellt som text.
Först måste du installera och aktivera Wp Social Login och Register Social Counter plugin. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett WordPress plugin.
Efter aktivering, gå till WP Social ” Social Counter page från WordPress dashboard och växla till fliken Providers.
Härifrån slår du på varje social media-plattform som du vill visa och klickar sedan på knappen Settings för att ställa in den.
Detta kommer att ge upphov till en popup där du kan ange dina sociala media profil detaljer för den plattformen. Du hittar också ett alternativ för att manuellt enter ett standardantal följare på Facebook.
Upprepa processen för alla social media-plattformar som du vill visa.
När du är slutförd kan du gå till sidan Appearance ” Widgets och lägga till WSLU Social Counter-widget i din sidebar.
Glöm inte att save dina ändringar och previewa din website.
Vill du visa antalet följare på sociala media i ett post eller en page? Edit bara posten eller sidan där du vill visa antalet följare och add to följande shortcode i content editor.
[xs_social_counter]
Efter det kan du klicka på knappen ”Publicera” eller ”Updated” för att lagra dina settings.
Du kan nu besöka din WordPress site för att view your social media follower count in action.
Metod 2: Display Social Media Feeds med Smash Balloon
Ett enklare alternativ till att visa antalet följare på sociala medier är att visa dina sociala feeds med Smash Balloon.
Smash Balloon är det bästa tillägget för sociala media för WordPress. Det allow you to display content from your social media as feeds with beautiful layouts.
Först måste du besöka Smash Balloon website. De erbjuder olika sociala media feed plugins för Instagram, Twitter, Facebook, YouTube, och en kombinerad Social Wall feed.
Vi rekommenderar att du skaffar All Access Bundle, som ger dig alla plugins.
När du har registrerat dig kan du logga in på ditt account på Smash Balloon och downloada tilläggen till din dator.
Därefter kan du gå vidare och installera Smash Balloon feed tillägg ett efter ett. För mer detaljer, se vår Step-by-Step guide om hur du installerar ett tillägg till WordPress.
För denna tutorial kommer vi att visa dig hur du skapar en social wall som hjälper dig att ansluta alla dina sociala media-flöden och visa dem som en.
Obs/observera : För att göra detta behöver du plugin-programmet Social Wall från Smash Balloon samt plugin-programmet feed.
Efter aktivering, besök Social Wall menu tab från WordPress dashboard och klicka på ”Add New” knappen högst upp.
Detta tar dig till en ny vy där du ser listan över plattformar för sociala medier med knappar för att ansluta dem. Gå vidare och klicka på knappen ”Add to Wall” för plattformen med de feeds du vill visa på din sociala vägg.
Detta kommer att visa en lista över de feeds som du redan har skapat och vill add to till din sociala vägg.
För detaljerade instruktioner kanske du vill se våra Följer tutorials om hur man skapar flöden på sociala medier med Smash Balloon:
- Så här visar du Instagram feed i WordPress
- Så här visar du Facebook-posts i WordPress
- Så här visar du de senaste tweetsen i WordPress
När du har valt feeds klickar du högst upp på knappen ”Create Wall”.
Detta kommer att starta Smash Balloon visual editor, där du kommer att se en preview av din sociala vägg till höger med customize-inställningar till vänster.
Härifrån kan du ändra layout och färgpalett, add to fler knappar och mycket mer. För detaljer, se vår tutorial om hur du lägger till dina social media feeds till WordPress.
Slutligen klickar du på knappen ”Save” högst upp för att spara dina settings. Klicka sedan på knappen ”Embed”.
Detta kommer att öppna en prompt på vyn där du kan kopiera shortcode för den sociala vägg som du skapade.
Därefter lämnar du feed editor och öppnar sidan eller posten där du vill lägga till den sociala väggen i block editor.
Härifrån klickar du på knappen ”Add Block” (+) högst upp till vänster på vyn för att öppna menyn med block. Lägg sedan till Social Wall-blocket på sidan / posten.
Gå vidare och klistra in shortcoden som du kopierade tidigare i ”Shortcode Settings” boxen i block panelen till höger.
Klicka slutligen på knappen ”Publicera” eller ”Update” för att spara dina settings. Du har nu utan problem lagt till en social vägg med feeds för dina Facebook-, Twitter- och Instagram accounts på din website.
Metod 3: Hämta och visa antalet följare manuellt med kod
Denna metod är lite avancerad och kanske inte fungerar särskilt bra för Beginner. Det kommer dock att hjälpa dig att hämta antalet följare på sociala medier som text.
I grund och botten kräver de flesta plattformar för sociala medier att du skapar en app och API-nycklar för användare för att hämta data som gillar antal följare från deras servrar.
I den här metoden visar vi dig hur du får ett antal följare för Twitter och Facebook med API-nycklar.
Du måste add to custom code till din website i WordPress. Om du inte har gjort det tidigare kan du läsa vår guide om hur du copy and pastear kod i WordPress.
Visa antal följare på Facebook med hjälp av kod
För att hämta antalet följare på Facebook måste du göra följande:
- Skapa en app för Facebook för att få tillgång till Facebooks API:er.
- Generera en access token. Detta fungerar som ett password och låter dig hämta den information du behöver.
- Använd Facebook-appen och token för att få Facebook gillar på WordPress.
1. Skapa en app för Facebook
Låt oss börja med att skapa en Facebook-app. Gå bara till webbplatsen Meta Developers och klicka på knappen ”Skapa app”.
Efter det blir du ombedd att välja en typ av app.
Klicka på ”Business” och klicka sedan på knappen ”Next” för att fortsätta.
Efter det kommer du att bli ombedd att ange namnet på din app (det kan vara vad du vill) och din email address.
Du kan hoppa över alternativet business account och klicka på knappen ”Create App”.
You may be prompted to enter your Facebook password.
You will then be redirected to your app dashboard.
På den här vyn ser du flera alternativ, men eftersom vi använder appen för personligt bruk behöver vi inte dessa alternativ för tillfället.
2. Hämta Access Tokens för Facebook API
Därefter måste du heada över till Graph API utforska sidan för att generera vår åtkomsttoken och få vårt sid-ID.
Först väljer du den app som du skapade under Facebook App section.
Efter det klickar du på rullgardinsmenyn ”Get Token” och väljer alternativet ”Page Access Token”.
Detta kommer att visa popup-fönstret för behörigheter, där du måste fortsätta som ditt personliga konto och sedan välja den sida du vill få en åtkomsttoken för.
Därefter visas några behörigheter och varningar för you.
Du kan ignorera dessa och clicka på ”Done”.
Facebook kommer nu att generera en access token för you.
Bara copy and paste access token till din dator med hjälp av en plain text editor som gillar Notepad eller TextEdit.
Innan du går, nästa sak du behöver är ID:n för Page.
För att få detta måste du enter din page URL slug i formuläret ovan och sedan klicka på knappen ”Submit”.
Du kan nu copy and paste Page ID:n på din dator med hjälp av en plain text editor som Notepad eller TextEdit.
3. Display Facebook Likes i WordPress
Först kopierar du och klistrar in följande kod i ditt WordPress temas functions.php-fil eller använder WPCode (rekommenderas):
function getFacebookLike( $fbid, $token ){
$json_string = @file_get_contents('https://graph.facebook.com/v14.0/'. esc_attr( $fbid ) .'/?fields=fan_count&access_token='. esc_attr( $token ) );
$json = json_decode($json_string, true);
$like_count = isset( $json['fan_count'] ) ? $json['fan_count'] : 0;
return $like_count;
}
För mer details, you can see our guide on how to add custom code in WordPress.
Följer, du måste klistra in följande kod i din WordPress templates där du vill visa antalet Facebook gillar som text:
<?php
echo "<p>More than <strong>" . getFacebookLike( $fbid = 'Facebook page ID', 'access token' ) . "</strong> users follow us on Facebook.</p> ";
?>
Glöm inte att ersätta ID:n för Facebook page och access token med de värden som du kopierade tidigare.
You kan nu besöka din website för att se din kod i action. Så här såg det ut på vår test website.
Visa antal följare på Twitter som text
För att få Twitters följare att räknas som text måste du följa dessa steg:
- Skapa en app för Twitter.
- Hämta API key för Twitter.
- Följer antalet följare i WordPress.
1. Skapa en Twitter-app och hämta API Keys
Först måste du besöka webbplatsen Twitter Developer och skapa en ny fristående app.
Du kommer att bli ombedd att ange ett namn för din app.
Du kan välja vilket namn du vill.
Därefter kommer du att se API keys för din app.
Gå vidare och kopiera dessa nycklar på din dator med hjälp av en plain text editor som Notepad eller TextEdit.
2- Hämta antal följare på Twitter i WordPress
Följaktligen måste du add to följande kod till ditt temas functions.php-fil eller använda WPCode (rekommenderas):
function getTwitterFollowers($screenName = 'wpbeginner')
{
// some variables
$consumerKey = 'API key';
$consumerSecret = 'API key secret';
$token = get_option('cfTwitterToken');
// get follower count from cache
$numberOfFollowers = get_transient('cfTwitterFollowers');
// cache version does not exist or expired
if (false === $numberOfFollowers) {
// getting new auth bearer only if we don't have one
if(!$token) {
// preparing credentials
$credentials = $consumerKey . ':' . $consumerSecret;
$toSend = base64_encode($credentials);
// http post arguments
$args = array(
'method' => 'POST',
'httpversion' => '1.1',
'blocking' => true,
'headers' => array(
'Authorization' => 'Basic ' . $toSend,
'Content-Type' => 'application/x-www-form-urlencoded;charset=UTF-8'
),
'body' => array( 'grant_type' => 'client_credentials' )
);
add_filter('https_ssl_verify', '__return_false');
$response = wp_remote_post('https://api.twitter.com/oauth2/token', $args);
$keys = json_decode(wp_remote_retrieve_body($response));
if($keys) {
// saving token to wp_options table
update_option('cfTwitterToken', $keys->access_token);
$token = $keys->access_token;
}
}
// we have bearer token wether we obtained it from API or from options
$args = array(
'httpversion' => '1.1',
'blocking' => true,
'headers' => array(
'Authorization' => "Bearer $token"
)
);
add_filter('', '__return_false');
$api_url = "https://api.twitter.com/1.1/users/show.json?screen_name=$screenName";
$response = wp_remote_get($api_url, $args);
if (!is_wp_error($response)) {
$followers = json_decode(wp_remote_retrieve_body($response));
$numberOfFollowers = $followers->followers_count;
} else {
// get old value and break
$numberOfFollowers = get_option('cfNumberOfFollowers');
// uncomment below to debug
die($response->get_error_message());
}
// cache for an hour
set_transient('cfTwitterFollowers', $numberOfFollowers, 1*60*60);
update_option('cfNumberOfFollowers', $numberOfFollowers);
}
return $numberOfFollowers;
}
Glöm inte att ersätta wpbeginner med ditt eget användarnamn på Twitter och API keys med dina egna API keys.
Följaktligen kan du add to följande kod till ditt WordPress theme där du vill visa antalet Twitter följare:
<p>
More than <strong><?php echo getTwitterFollowers(); ?></strong> users follow us on Twitter.
</p>
You can now visit your website and see your Twitter follower count in action.
Bonus: Add Social Share Buttons i WordPress
Förutom att visa antalet följare på dina sociala medier kan du också visa delningsknappar för sociala medier. Detta gör det möjligt för användare att dela innehållet på din WordPress blogg med sina vänner och familj och hjälpa dig att nå en bredare publik.
Du kan enkelt add to sociala delningsknappar genom att installera och aktivera pluginet Social Snap. För detaljer, se vår guide för nybörjare om hur man installerar ett plugin för WordPress.
Efter aktivering, besök Social Snap ” Settings page och växla till fliken ”Social Sharing” från den vänstra colonnen. Detta öppnar new settings där du måste select tabben ”Hantera nätverk”.
Välj sedan de social media-plattformar som du vill ha från prompten och avsluta tabben.
Förstora nu tabben ”Inline Buttons” och konfigurera knapparnas position, justering, etikett, form och storlek.
När du har gjort det rullar du ner till ”Display On” section och väljer de platser där du vill visa knapparna. Här kan du kontrollera boxen ”Posts” om du bara vill visa de sociala delningsknapparna på dina post.
Slutligen klickar du på knappen ”Save Changes” för att lagra dina inställningar.
Besök nu ett post på din website för att se de sociala delningsknapparna i action. För detaljer, se vår tutorial om hur man lägger till sociala delningsknappar i WordPress.
Vi hoppas att den här artikeln hjälpte dig att visa antalet följare på sociala medier i WordPress. Du kanske också vill se vår kompletta fusklapp för sociala media för WordPress eller vår guide till sökmotorsoptimering för WordPress för att få mer organisk trafik från search engines.
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!
alselon says
The plugin is not available anymore on wordpress
WPBeginner Support says
Thank you for letting us know, we will be sure to look into alternative options.
Administratör
Priyanka says
In my wordpress website I am not able to trace from where the social counter is working. The FB, twitter and other are showing but with zero value.
JK says
Hi,
First of all thank you for your tips and tricks.![:)](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%200%200'%3E%3C/svg%3E)
I have from nowhere lost all my twitter and pinterest and some google+ social counts in my posts. Facebook still works. I haven’t changed permalinks.
Rachel Wojnarowski says
wish this included Pinterest!
Colin says
Great tutorial. I’ve managed to get everything working in my blog page, reglazeglasses4u.co.uk/blog.html using the widgets but I can’t get any of the icons to show up on either pages or posts using the shortcodes. Any ideas?
Me , The Man & The Baby says
Anyone else struggle with the G+ API?
pseudepigrapher says
I was able to generate a G+ API, but it’s not displaying my G+ follower count. Bummer.
Stephanie Riggs says
Wow! This is very easy tutorial to install Social Count Plus plugin and then develop application on Twitter in order to display social media followers count as text. I didn’t try this on my blog but after finding this tutorial I will experience it on my blog to make it prettier
Ravi Chahar says
It is always a keen query done by bloggers. The main point is about designing the website in which social media icons helps a lot. The question asked by many about arranging these buttons followed by the number count under them is a matter to solve. I hope the plugin about which you have explained will work properly.
Thanks for sharing.
Sandrine says
Hi, and please excuse my english… I’m fighting with this plugin that seems really good but the facebook counter doesn’t grow up![:-(](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%200%200'%3E%3C/svg%3E)
![:-(](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%200%200'%3E%3C/svg%3E)
I tried with my facebook id, and with before my id like recommended here : http://wordpress.org/support/topic/fb-not-updating but my facebook count is frozen at 85 therefore it’s now 97
so I’m searching for another one…
WPBeginner Support says
We think that plugin author can help you better, we did not face this issue while testing the plugin.
Administratör
Renan Lara says
The Claudio Sanches is really magnificent! Success guy, congratulations!
netto says
This plugin is very good, I use it on my blog since the first version. Thanks, Claudio Sanches available for it.
Claudio Sanches says
I never imagined that someday my plugin would have some here: D
Many thanks for talking about my plugin *____*
WPBeginner Support says
The pleasure is ours, thanks for writing this useful plugin
Administratör
Sü Smith says
Nice plugin! Thanks for sharing.
Gary Neal Hansen says
Thanks for the info.
This seems very complicated for something one sees on many sites. My old wordpress.com site displayed total followers automatically if I used its publicize function.
Isn’t there an easier way with a plugin?
WPBeginner Support says
We found this to be the easiest way to accomplish this. Just follow through the instructions step by step. Let us know which part feels more complicated to you and we will try to further explain it for you.
Administratör