Möchten Sie Twitter-Share- und Retweet-Buttons zu Ihrer WordPress-Website hinzufügen?
Das Hinzufügen von Schaltflächen für soziale Netzwerke zu Ihren Beiträgen und Seiten ist eine gute Möglichkeit, Leser zum Teilen und Retweeten Ihrer Inhalte zu ermutigen. So können Sie mehr Follower, Engagement und Besucher gewinnen.
In diesem Artikel zeigen wir Ihnen, wie Sie Twitter-Share- und Retweet-Buttons in WordPress hinzufügen können.
Warum Twitter Share und Retweet Buttons in WordPress hinzufügen?
Unseren Marketingstatistiken zufolge hat Twitter über 217 Millionen monatlich aktive Nutzer. Das macht es zu einem großartigen Ort, um Ihre Website zu bewerben.
Das Teilen Ihrer Inhalte in den sozialen Medien erreicht jedoch nur Nutzer, die Ihrem Konto bereits folgen. Wenn Sie ein neues Publikum erreichen wollen, müssen Sie die Leute dazu bringen, Ihre Inhalte zu teilen und zu retweeten.
Dies kann den Traffic in Ihrem Blog erhöhen, da Ihre Marke auch Menschen bekannt wird, die Ihre Website bisher nicht kannten. Das Wiederveröffentlichen Ihrer Inhalte ist auch eine wirksame Form des sozialen Nachweises. Wenn jemand einen Beitrag oder einen Tweet mit seinen Followern teilt, wird dies oft als Bestätigung angesehen.
Sehen wir uns also an, wie einfach es ist, Twitter-Share- und Retweet-Buttons in WordPress hinzuzufügen. Verwenden Sie einfach die unten stehenden Links, um direkt zu der gewünschten Methode zu gelangen:
Methode 1: Gemeinsame Zählungen verwenden (schnell und einfach)
Der einfachste Weg, einen Twitter-Share-Button zu WordPress hinzuzufügen, ist die Verwendung des Shared Counts-Plugins. Shared Counts ist eines der besten Social-Media-Plugins für WordPress, mit dem Sie alle Arten von Sharing-Buttons zu Ihrer Website hinzufügen können.
Im Gegensatz zu einigen anderen Social-Sharing-Plugins verwendet Shared Counts eine einzigartige Caching-Methode, so dass es keine großen Auswirkungen auf die Geschwindigkeit und Leistung Ihrer Website hat.
Zunächst müssen Sie das Plugin installieren und aktivieren. Wenn Sie Hilfe benötigen, lesen Sie bitte unsere Anleitung zur Installation eines WordPress-Plugins.
Nach der Aktivierung gehen Sie zu Einstellungen “ Gemeinsame Zählungen, um die Einstellungen des Plugins zu konfigurieren.
Um zu beginnen, blättern Sie zu ‚Anzuzeigende Freigabe-Schaltflächen‘.
Shared Counts fügt standardmäßig Schaltflächen für Facebook, Pinterest und Twitter hinzu.
Wenn Sie den Facebook- oder Pinterest-Sharing-Button löschen möchten, klicken Sie einfach auf das „x“-Symbol.
Sie können auch Social-Sharing-Buttons für andere Plattformen hinzufügen, indem Sie in das Feld tippen. Eine Schritt-für-Schritt-Anleitung finden Sie in unserem Leitfaden zum Hinzufügen von Social-Share-Buttons in WordPress.
Danach müssen Sie auswählen, welche Art von Schaltfläche Sie in Ihrem WordPress-Blog verwenden möchten. Es gibt 8 Stile zur Auswahl, und Sie können Beispiele für jede Schaltfläche auf der Shared Counts Plugin-Seite sehen.
Wenn Sie sich entschieden haben, öffnen Sie einfach das Dropdown-Menü „Stil der Freigabe-Schaltfläche“ und wählen den gewünschten Stil aus.
Danach müssen Sie auswählen, wo der Twitter-Button in Ihrem WordPress-Theme angezeigt werden soll, indem Sie das Dropdown-Menü „Theme Location“ öffnen.
Hier können Sie „Vor dem Inhalt“, „Nach dem Inhalt“ oder „Vor und nach dem Inhalt“ auswählen.
Wenn Sie die Schaltfläche oben auf der Seite einfügen, wird sie von mehr Besuchern gesehen. Die meisten Leute wollen einen Beitrag jedoch erst lesen, bevor sie ihn teilen. Aus diesem Grund sollten Sie „Nach dem Inhalt“ oder „Vor und nach dem Inhalt“ wählen.
Schließlich müssen Sie entscheiden, ob Sie die Twitter-Schaltfläche zu Ihren Seiten oder Beiträgen hinzufügen möchten.
Standardmäßig fügt Shared Counts die Schaltfläche nur zu Ihren Beiträgen hinzu. Sie können sie jedoch auch zu Ihren Seiten hinzufügen, insbesondere wenn Sie viele Landing Pages oder Verkaufsseiten erstellen.
In diesem Fall können Sie das Kästchen neben „Seite“ ankreuzen.
Wenn Sie mit der Einrichtung der Schaltfläche „Twitter teilen“ zufrieden sind, klicken Sie auf „Änderungen speichern“.
Wenn Sie nun Ihre WordPress-Website besuchen, werden Sie die Schaltfläche zum Teilen in Aktion sehen.
Methode 2: Verwendung von Twitter Feed Pro (am besten für Retweets)
Wenn Sie einer Seite oder einem Beitrag eine einfache Schaltfläche zum Teilen hinzufügen möchten, dann ist Shared Counts eine gute Option. Vielleicht möchten Sie Ihre Besucher aber auch dazu ermutigen, Ihre letzten Tweets zu retweeten. So können Sie mehr Engagement erzielen und Ihre Inhalte noch weiter verbreiten.
Die beste Möglichkeit, mehr Retweets zu erhalten, ist die Verwendung von Smash Balloon Twitter Feed Pro. Mit diesem Twitter-Feed-Plugin können Sie Ihren gesamten Twitter-Feed auf jeder Seite, jedem Beitrag oder in einem Widget-bereiten Bereich einfügen.
Jeder Tweet hat seine eigene Reihe von Twitter-Aktionen.
Das bedeutet, dass Besucher einen Tweet einfach durch Anklicken der Schaltfläche „Retweet“ erneut veröffentlichen können.
Noch besser: Der Feed wird automatisch aktualisiert, so dass die Besucher immer neue Tweets lesen können. Dies kann dazu beitragen, dass Ihre Website auch für regelmäßige Besucher frisch und interessant bleibt.
Weitere Informationen über das Plugin finden Sie in unserem vollständigen Smash Balloon Test.
Hinweis: Es gibt tatsächlich ein kostenloses Smash Balloon Twitter Feed Plugin. Wir werden jedoch die Pro-Version verwenden, da sie mehr Funktionen bietet, z. B. mehr Feed-Vorlagen und die Möglichkeit, Hashtag-Feeds anzuzeigen.
Twitter Feed Pro einrichten
Zuerst müssen Sie Smash Balloon’s Twitter Feed Pro installieren und aktivieren. Wenn Sie Hilfe benötigen, lesen Sie bitte unsere Anleitung zur Installation eines WordPress-Plugins.
Nachdem Sie das Plugin installiert haben, gehen Sie zu Twitter Feed “ Einstellungen. Sie können nun Ihren Smash Balloon-Lizenzschlüssel in das Feld „Lizenzschlüssel“ eingeben.
Sie finden diese Informationen in der Bestätigungs-E-Mail, die Sie beim Kauf von Smash Balloon erhalten haben, und in Ihrem Smash Balloon-Konto.
Nachdem Sie Ihren Lizenzschlüssel hinzugefügt haben, klicken Sie auf die Schaltfläche „Aktivieren“.
Einen Live-Twitter-Feed für WordPress erstellen
Wenn Sie das getan haben, können Sie einen benutzerdefinierten Twitter-Feed erstellen. Gehen Sie dazu auf Twitter Feed “ Alle Feeds und klicken Sie dann auf die Schaltfläche „Neu hinzufügen“.
Wenn Sie zum ersten Mal einen Twitter-Feed mit Smash Balloon hinzufügen, werden Sie aufgefordert, Ihre E-Mail-Adresse zu bestätigen.
Klicken Sie dazu einfach auf die Schaltfläche „Verbinden“ und folgen Sie den Anweisungen auf dem Bildschirm.
Danach kehren Sie zur Plugin-Seite zurück. Smash Balloon zeigt nun alle verschiedenen Arten von Twitter-Feeds an, die Sie erstellen können.
Da Sie mehr Retweets wünschen, wählen Sie einfach „User Timeline“ und klicken Sie auf „Weiter“.
Auf dem nächsten Bildschirm müssen Sie das @-Symbol gefolgt von dem Namen Ihres Twitter-Kontos eingeben.
Wenn Sie fertig sind, klicken Sie auf „Weiter“, um den Haupteditor von Smash Balloon zu öffnen.
Als Nächstes können Sie die Vorlage auswählen, die Sie in Ihrem Twitter-Feed verwenden möchten.
Sie können zum Beispiel Ihre Tweets in einem responsiven Slider anzeigen, indem Sie „Einfaches Karussell“ auswählen. Wenn Sie nur Ihren neuesten Tweet anzeigen möchten, können Sie stattdessen die Vorlage „Letzter Tweet“ auswählen.
Wir werden für alle unsere Bilder die Vorlage „Standard“ verwenden, aber Sie können jede beliebige Vorlage wählen.
Nachdem Sie Ihre Entscheidung getroffen haben, klicken Sie auf „Weiter“.
Smash Balloon zeigt nun eine Vorschau des Social Media Feeds an, die Sie anpassen können.
Anpassen Ihres WordPress-Twitter-Feeds
Sind Sie mit dem Aussehen der Vorlage nicht zufrieden? Um sie zu ändern, wählen Sie einfach „Vorlage“ aus dem linken Menü.
Sie können dann auf die Schaltfläche „Ändern“ klicken.
Es öffnet sich ein Popup, in dem Sie ein neues Layout auswählen können.
Wählen Sie einfach eine neue Vorlage aus und klicken Sie dann auf „Aktualisieren“.
Danach müssen Sie auf den Link „Anpassen“ klicken.
Dadurch gelangen Sie zurück zu den Haupteinstellungen von Smash Balloon.
Die nächste Option im linken Menü ist „Feed-Layout“, also klicken Sie darauf.
Hier können Sie die Höhe des Twitter-Feeds und die Anzahl der Tweets, die der Besucher zunächst sieht, ändern. Sie können auch zwischen einem Raster-, Masonry- oder Karussell-Layout wechseln.
Wenn Sie Änderungen vornehmen, wird die Vorschau automatisch aktualisiert, so dass Sie verschiedene Einstellungen ausprobieren können, um zu sehen, was am besten aussieht.
Je nachdem, welches Layout Sie verwenden, können Sie die Anzahl der Spalten, die Smash Balloon auf Desktop-, Tablet- und Mobilgeräten anzeigt, ändern.
Smartphones und Tablets haben in der Regel kleinere Bildschirme und weniger Rechenleistung, so dass Sie auf mobilen Geräten möglicherweise weniger Spalten anzeigen möchten.
Verwenden Sie dazu einfach die Dropdown-Menüs im Bereich „Spalten“.
Wenn Sie mit der Einrichtung des Feed-Layouts zufrieden sind, klicken Sie erneut auf den Link „Anpassen“, um zum Hauptbildschirm der Einstellungen zurückzukehren.
Hier können Sie auf „Farbschema“ klicken.
Standardmäßig verwendet Smash Balloon die von Ihrem WordPress-Theme übernommenen Farben, aber Sie können stattdessen zu einem „hellen“ oder „dunklen“ Farbschema wechseln.
Sie können auch Ihr eigenes Farbschema erstellen, indem Sie „Benutzerdefiniert“ auswählen und dann die Steuerelemente verwenden, um die Hintergrundfarbe zu ändern, die Textfarbe in WordPress zu ändern und vieles mehr.
Wenn Sie mit Ihren Änderungen zufrieden sind, klicken Sie noch einmal auf den Link „Anpassen“. Zurück auf dem Hauptbildschirm der Einstellungen müssen Sie auf „Kopfzeile“ klicken.
Standardmäßig fügt Smash Balloon dem Feed eine „Standard“-Überschrift hinzu, die eine „Folgen“-Schaltfläche und Ihre Twitter-Bio enthält, falls vorhanden.
Wenn Sie die Twitter-Bio ausblenden möchten, deaktivieren Sie den Schalter „Bio anzeigen“.
Eine weitere Option ist die Auswahl von „Text“, die dem Feed eine Überschrift „Wir sind auf Twitter“ hinzufügt.
Sie können diese durch Ihre eigene Nachricht ersetzen, indem Sie sie in das Feld „Text“ eingeben.
Wenn Sie mit der Nachricht zufrieden sind, können Sie die Größe und Farbe der Kopfzeile ändern.
Kehren Sie danach zum Hauptbildschirm der Smash Balloon-Einstellungen zurück und wählen Sie „Tweets“. Hier können Sie zwischen „Tweet-Stil“ und „Einzelne Elemente bearbeiten“ wählen.
Wenn Sie die Option „Tweet-Stil“ wählen, können Sie zwischen einem Kasten- und einem normalen Layout wählen.
Wenn Sie „Umrandet“ wählen, können Sie für jeden Tweet einen farbigen Hintergrund erstellen. Sie können auch den Radius des Rahmens vergrößern, um geschwungene Ecken zu erzeugen, oder einen Rahmenschatten hinzufügen.
Wenn Sie „Regelmäßig“ wählen, können Sie die Dicke und Farbe der Linie ändern, die Ihre verschiedenen Beiträge in sozialen Medien voneinander trennt.
Wenn Sie mit Ihren Änderungen zufrieden sind, klicken Sie einfach auf „Tweets“.
Damit kehren Sie zum vorherigen Bildschirm zurück.
Diesmal können Sie auf „Einzelne Elemente bearbeiten“ klicken.
Sie sehen nun alle Inhalte, die Twitter Feed Pro in jedem Tweet enthält, wie z. B. den Autor, den Text des Tweets, das Twitter-Logo und mehr.
Um möglichst viele Retweets zu erhalten, empfiehlt es sich, das Retweet-Symbol hervorzuheben. Klicken Sie dazu auf den Pfeil neben „Tweet-Aktionen“.
Hier können Sie die Tweet-Aktionen über die Dropdown-Liste „Größe“ vergrößern und die Farbe ändern.
Beachten Sie jedoch, dass Smash Balloon diese Änderungen auf alle Tweet-Aktionen anwendet und nicht nur auf das Retweet-Symbol.
Wenn Sie mit dem Aussehen der Tweet-Aktionen zufrieden sind, klicken Sie einfach auf den Text „Elemente“.
Dadurch gelangen Sie zum vorherigen Bildschirm zurück.
Wiederholen Sie diesen Vorgang einfach, um jedes der anderen Elemente individuell anzupassen.
Sie können ein Element auch ausblenden, indem Sie das entsprechende Kontrollkästchen deaktivieren.
Das Ausblenden unnötiger Inhalte ist ein weiterer Trick, der dazu beitragen kann, dass die Retweet-Aktion auffällt.
Wenn Sie mit dem Aussehen der Tweets zufrieden sind, kehren Sie zum Hauptbildschirm für die Smash Balloon-Einstellungen zurück und wählen Sie „Load More Button“.
Da es sich um eine so wichtige Schaltfläche handelt, möchten Sie sie vielleicht anpassen, indem Sie die Hintergrundfarbe, den Hover-Status, die Beschriftung und mehr ändern, um sie an das Design Ihrer Website anzupassen.
Sie können auch den Standardtext „Mehr laden“ durch Ihre eigene Nachricht ersetzen, indem Sie ihn in das Feld „Text“ eingeben.
Eine weitere Option ist die Aktivierung des unendlichen Scrollens, damit neue Tweets automatisch erscheinen, wenn Besucher das Ende des Feeds erreichen. Dies ermutigt die Besucher, mehr von Ihren Tweets zu lesen und kann Ihnen zusätzliche Retweets bescheren.
Um diese Funktion zu aktivieren, klicken Sie einfach auf den Schieberegler „Unendlicher Bildlauf“, so dass er von grau (deaktiviert) auf blau (aktiviert) wechselt.
Sie können auch den „Auslöseabstand“ ändern, der Smash Balloon mitteilt, wann neue Tweets geladen werden sollen. Die Standardeinstellungen sollten jedoch für die meisten WordPress-Websites gut funktionieren.
Danach ist die letzte Option auf dem Hauptbildschirm der Smash Balloon-Einstellungen „Leuchtkasten“.
Standardmäßig ermöglicht Twitter Feed Pro den Besuchern, in einem Leuchtkasten durch die Bilder und Videos des Feeds zu blättern.
Dies kann Ihnen einige zusätzliche Retweets einbringen, da die Besucher die Bilder des Feeds näher betrachten und Ihre Videos ansehen können, ohne die Website zu verlassen.
Aus diesem Grund empfehlen wir, das Leuchtpult aktiviert zu lassen.
Wenn Sie diese Funktion jedoch deaktivieren möchten, klicken Sie einfach auf den blauen Kippschalter „Aktivieren“, so dass er grau wird.
Wenn Sie mit dem Aussehen des Twitter-Feeds zufrieden sind, vergessen Sie nicht, auf „Speichern“ zu klicken. Danach können Sie den Twitter-Feed und die Retweet-Schaltflächen in Ihre WordPress-Website einbetten.
Fügen Sie Ihren Twitter-Feed zu WordPress hinzu
Sie können den Feed entweder über einen Shortcode oder den Twitter Feed-Block zu Ihrer Website hinzufügen. Da dies die einfachste Methode ist, sehen wir uns zunächst an, wie Sie den Feed mithilfe des Smash Balloon-Blocks zu jeder Seite oder jedem Beitrag hinzufügen können.
Wenn Sie mehr als einen Feed erstellt haben, müssen Sie den Code für den Feed finden, den Sie einbetten möchten.
Um diese Informationen zu erhalten, gehen Sie zu Twitter Feeds “ All Feeds und kopieren Sie den Code in der Spalte „Shortcode“. Sie müssen diesen Code in Ihre Website einfügen, also notieren Sie ihn sich.
Im folgenden Bild müssen wir [custom-twitter-feeds feed=2]
verwenden.
Danach öffnen Sie einfach die Seite oder den Beitrag, in den Sie den Twitter-Feed einbetten möchten. Klicken Sie dann auf das „+“-Symbol, um einen neuen Block hinzuzufügen, und beginnen Sie mit der Eingabe von „Twitter Feed“.
Wenn der richtige Block angezeigt wird, klicken Sie darauf, um ihn zum Blogbeitrag hinzuzufügen.
Der Block zeigt standardmäßig einen Ihrer Twitter-Feeds an. Wenn Sie einen anderen Feed verwenden möchten, finden Sie im rechten Menü „Shortcode-Einstellungen“.
Fügen Sie hier einfach den Shortcode hinzu und klicken Sie dann auf „Änderungen übernehmen“.
Der Block zeigt nun Ihren Twitter-Feed an, und Sie können den Beitrag einfach veröffentlichen oder aktualisieren, um ihn auf Ihrer Website zu veröffentlichen.
Eine weitere Möglichkeit ist das Hinzufügen des Feeds zu einem beliebigen Widget-fähigen Bereich, z. B. der Seitenleiste oder einem ähnlichen Bereich. So können Besucher Ihre neuesten Beiträge von jeder beliebigen Seite Ihrer Website aus retweeten.
Gehen Sie einfach im WordPress-Dashboard auf Darstellung “ Widgets und klicken Sie dann auf die blaue Schaltfläche „+“.
Sobald Sie das getan haben, müssen Sie „Twitter Feed“ eingeben, um das richtige Widget zu finden.
Ziehen Sie sie dann einfach auf den Bereich, in dem Sie die Schaltflächen für Feed und Retweet anzeigen möchten.
Das Widget zeigt einen der Feeds an, die Sie mit Smash Balloon erstellt haben.
Um stattdessen einen anderen Twitter-Feed anzuzeigen, geben Sie den Code des Feeds in das Feld „Shortcode-Einstellungen“ ein und klicken Sie dann auf „Änderungen übernehmen“.
Sie können nun auf die Schaltfläche „Aktualisieren“ klicken, um das Widget zu aktivieren. Weitere Informationen finden Sie in unserer Schritt-für-Schritt-Anleitung für das Hinzufügen und Verwenden von Widgets in WordPress.
Schließlich können Sie die Feed- und Retweet-Schaltflächen mithilfe eines Shortcodes in jede Seite, jeden Beitrag oder jeden Widget-bereiten Bereich einbetten.
Gehen Sie einfach auf Twitter Feed „ Alle Feeds und kopieren Sie den Code in der Spalte „Shortcode“. Sie können den Shortcode nun in einen beliebigen Widget-Bereich auf Ihrer Website einfügen.
Weitere Informationen finden Sie in unserer ausführlichen Anleitung zum Hinzufügen eines Shortcodes in WordPress.
Weitere Möglichkeiten zur Verwendung von Twitter in WordPress
Möchten Sie Ihr Twitter-Profil optimal nutzen, um Ihre WordPress-Website zu bewerben? Oder möchten Sie vielleicht mehr Twitter-Inhalte auf Ihrer Website hinzufügen? Sehen Sie sich die folgenden Anleitungen an:
- Wie man automatisch tweetet, wenn man einen neuen Beitrag in WordPress veröffentlicht
- Anleitung für Anfänger zum Hinzufügen von Twitter-Karten in WordPress
- Wie man die letzten Tweets in WordPress anzeigt (Schritt für Schritt)
- Hinzufügen von „Click to Tweet“-Boxen in Ihren WordPress-Posts
- Wie man Twitter und Facebook des Autors auf der Profilseite anzeigt
- Wie man kaputte Twitter-Kartenbilder in WordPress repariert
Wir hoffen, dass dieser Artikel Ihnen geholfen hat, Twitter-Share- und Retweet-Buttons in WordPress hinzuzufügen. Vielleicht möchten Sie auch unsere Anleitung zum Erstellen eines E-Mail-Newsletters lesen oder unsere Expertenauswahl für die beste Web-Push-Benachrichtigungssoftware ansehen.
Wenn Ihnen dieser Artikel gefallen hat, dann abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Videotutorials. Sie können uns auch auf Twitter und Facebook finden.
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!
Jiří Vaněk says
I can only recommend buttons for Twitter and Facebook. They will increase your reach and possibly backlinks. Additionally, creating profiles for your website where people can find you and where you can provide more information is a great way to make yourself known. I have it implemented on my website as well; I would just appreciate some statistics. How many times has someone clicked on the button and made a tweet, and for which article, so I can have a better overview.
WPBeginner Support says
To help track that we would recommend taking a look at our guide for how to track button and link clicks with MonsterInsights below:
https://www.wpbeginner.com/wp-tutorials/how-to-track-link-clicks-and-button-clicks-in-wordpress/
Admin
Jiří Vaněk says
So, I understand it well that a similar thing cannot be done using Google Analytics, for example, and an external plugin such as Monster Sight is required for this? I ask because I try to use as few plugins as possible and use them for as many things as possible. That’s why I thought if I could solve a similar thing, for example, using Google Analytics.
WPBeginner Support says
It is possible but you would need to manually set up the markup in Google Analytics to add to your button which is why we recommend the plugin
Konrad says
Adding Twitter share and retweet buttons can indeed boost your social media presence. One thing to consider is the placement of these buttons for maximum engagement. It’s beneficial to conduct A/B testing to determine the most effective positions on your site. Additionally, make sure the buttons are clearly visible but not intrusive to the user experience.
THANKGOD JONATHAN says
This post has opened my eyes.
I was reluctant to create a twitter account because I think I will not have the time to engage compared to other social sites I love using.
But now I thing I will give it a try after reading this article.
jafar says
thank man
RandyDueck says
Thanks for the quick response. I’m not a programmer, do you know where I can get a peice of code and paste it in? Re: Count, I’m thinking then that when testing, If I use the tweet button to post to post to my own page, then twitter doesn’t tink it’s legit? However, I have another twitter acc’t that I tried tweeting to and it didn’t increase. Is there a way I can test it to see that it’s working? How do I know it’s a legit tweet or not? I’m surpirsed that Twitter seems difficult compared to FB @wpbeginner
wpbeginner says
@RandyDueck Twitter uses the new t.co shortner which only shorten links for their algorithm to make sure it is not SPAM… then it pastes the unshortened version… You have to utilize another API and write a bit of custom code to get the custom short URLs to work there…As far as the count, twitter button only shows count that it thinks are legit.
RandyDueck says
Thanks for this great little code snippet. I want the twitter button to be in the post excerpt and below the title of the single-post page. the code works fine. gives the correct title etc. however, it does not shorten the link, and after tweeting, the tweet count doesn’t go up. the site is thinkactloveloseweight.com Thank your response
KatrinaMoody says
Gretchen – all links should trace back to your permalink – so your permalink should be the source URL, not your short link … make sense? YOu can’t yet change the URL shortener if you use the official Tweet button ( I looked into it because I wanted to do a shortlink).
Adding this so long after the original was posted because others might have that question!
KatrinaMoody says
I thought I would note that some themes change the value for the title and post url – meaning that the code will tweet with your code in quotes. I got a couple questions on Twitter over that one. I just found the different variables that worked for my site and replaced them. So …
Line three: data-url=““
was changed to %permalink% – which was my theme’s replacement
Line five: data-text=““
was changed to %post-title% – again my theme’s replacement
I wouldn’t have been able to do this without your tutorial! Thanks SOOOO much! You are now my go-to resource!
idowebmarketing says
@wpbeginner @idowebmarketing Okay, there are two locations of this code, and I had only updated one!
wpbeginner says
@idowebmarketing @wpbeginner data-via is the only thing that needs to be modified in order to make the change.
idowebmarketing says
@wpbeginner @idowebmarketing Thanks – I added new blog posts to two of my blogs yesterday after implementing the updated code, however it still recommended wpbeginner on both. Is there any section of code that also needs to be updated?
wpbeginner says
@idowebmarketing On old posts it takes twitter while to figure it out. On new posts it should be fine.
idowebmarketing says
My blog is still recommending wpbeginner and I have updated the code. Here is the edited code:
<script src=“http://platform.twitter.com/widgets.js“ type=“text/javascript“></script> <a href=“http://twitter.com/share“ data-url=“<?php the_permalink(); ?>“ data-via=“idowebmarketing“ data-text=“<?php the_title(); ?>“ data-related=“imnewsdaily:Daily updates from the internet marketing industry“ data-count=“vertical“>Tweet</a>Any idea what I am doing wrong?
Richard says
Thank you for posting this!! I have been trying to slove this problem for about three days now…
do you have the same code for the facebook like button?
Gretchen says
I use the WP-generated shortlinks when tweeting about my posts, and have had troubles with those always showing in my Tweet count. The final bit of code on this site seems to work, though if you click to view the search results in Twitter it only shows the links to the actual permalink, not the links to the shortlink as well: http://bavotasan.com/tutorials/adding-tweet-button-wordpress/ It’s too bad WordPress and Twitter don’t count those as the same link somehow…
Zakir says
I can add javascript in header but it will degrade YSlow rating, currently it is B rating. I really work hard to make B from D. I opened a ticket to twitter technical team, they just sent me email providing some links which may help me to get my answer or open a new ticket if not. Thats so stupid. Twitter people think we didn’t see other answers! thats so frustating. Linkedin doing quite well , their share button updates within a minute.
Deepanshu says
hello sir sir how do i use this for pages ? i was able to do it for posts
Zakir says
In my above mentioned website, i used your code, index.php, single.php and other php file within loop.
I can click the twitter tweet button and it shows count number, but if i refresh the page, that value goes away. Now after may be 1 hour if i check that article page, i can see the new count value. e.g. before i clicked the button it was 0, after almost 1 hour it shows 1. My question is why it took 1 hour to update. it should be updated immediately isn’t it?
Now in front page which index.php, i used the code and again i used in single.php. User clicks an article from index.php and comes article page which is in single.php. The problem: count value is not synchronising the count from the index.php to single.php. I check it later it is but after almost 1 hour. so it is synchronising after almost 1 hour.
Why? any idea.
Recently I changed the .htaccess file to add expire headers to get some speed. i am getting that but today i removed that line and back to default .htaccess file. Do you think its something with .htaccess where caching is controlled by hour, minutes, seconds, months or even year. Even though if I enable caching, the twitter java script which is twitter server can’t force to use caching.
Now I am not sure where I should look for to get immediate count value. client wants to see immediate count and synchronise with article page.
Please check the http://www.bizgene.com to get an idea.
Any clue or idea will be a great favour.
I used following code for tweet count button:
<a href="http://twitter.com/share" class="twitter-share-button"
data-url="“
data-via=“bizgene“
data-text=““
data-count=“horizontal“>Tweet
Zakir
Editorial Staff says
Zakir, We think this is a common bug going on with twitter API. We have been noticing a similar thing with our tweetmeme button regarding the count. It synchornizes the count almost after 20 – 30 minutes. Perhaps try adding the script part in your head codes and then display the a href part where you want the button to display might help.
Admin
Simon says
I don’t get it. Using the data url link/button above gives just a t.co link and nothing else. Has something changed there or why doesn’t it output the values?
Editorial Staff says
Note, to get the_title(); or the_permalink(); you have to place this code inside the loop. If you place it outside a loop, then it will not give you a desired value.
Admin
coz says
ARGH. This is what I tried but im replacing the greater-than/less-than symbols with brackets so it will hopefully show:
[?php the_title(); ?] #[?php the_category(‚,‘); ?]
coz says
um… last comment isn’t displaying the php… sorry. This is what i tried: (hopefully this will work)
#
coz says
For DataText, im looking to add the title and category of the post as a hashtag. I can’t seem to figure out how to do it, being that I’m not too familiar with php.
I tried: >>> data-text=“ #“
but that didn’t work. Any idea of how to do this?
S.Pradeep Kumar says
Nice tutorial. Finally I implemented that button on my blog. It will be nice if you can make a tutorial on how to customize it. I hate the default color. : |
Calítoe.:. (Cristina MJ) says
I’ve noticed that the count displays horizontally even if one specifies data-count=“vertical“. Does anyone know what’s wrong with that?
NG says
I’m having the exact same problem. Any idea how to fix it?
Editorial Staff says
Refresh the page… This usually happens when the twitter script is not loading fine. Try placing the twitter script part in the head section.
Admin
CharityHisle says
I think I’ll stick to the tweetmeme version until the plugin is completely developed with all of the options for placement.
Rarst says
There isn’t much sense in filling out every setting, most of them work just fine without being set and will pick things like current URL and page title by default.
Non-standard tag attributes will not validate (at least not as XHTML Transitional in my experience so far). Query arguments may not look as tidy, but they are more established and reliable.
Konstantin says
Alternatively, you could use WordPress‘ very own add_query_arg() function, to create the url.
Nice post though, and quick, too.
Editorial Staff says
Yup, we had to put it out quick because a lot of our twitter users said they wanted it.
Admin
Amie says
Is there any chance I don’t have „The Loop“ because I keep looking for this (or even a part of it) in my index file and it’s not there. Gah, I was hoping this would be easy!
Editorial Staff says
That really depends on what theme you are using. Every theme must have the loop to show the recent posts. You can try Otto’s plugin.
Admin
DJ NightLife says
I used to have Topsy buttons… was about to switch for the official button but… It seems this version have a problem recognizing the real count of tweets. I had a post of 52 tweets and now it shows 8.
Otto says
They’re only counting tweets since July.
BTW, the new tweet button is fully supported by my Simple Twitter Connect plugin for WordPress. Just so you know.
http://ottopress.com/wordpress-plugins/simple-twitter-connect/
Editorial Staff says
Thanks Otto for updating your plugin. Your work is truly awesome Jut added the link in the post.
Admin
Ted Thompson says
Helpful article, many thanks!
josemv says
Excellent, thanx !
Any chance to include custom url shorteners, such as cli.gs or bit.ly ?
Editorial Staff says
No, twitter is using their very own service to verify the quality of link that is being tweeted.
Admin