After running WPBeginner for over a decade, we’ve learned that building a strong community is key to successful blogging. We owe our success to our loyal readers, and we’re always looking for new ways to connect with them.
One great way to build community is by showing your recent tweets on your WordPress site. This keeps your site fresh and lets visitors see what you’re up to on social media.
We’ve tried many ways to display tweets on WordPress sites, and we’ll share our top three methods to do exactly that. All of these methods are beginner-friendly, so you’ll be able to easily add your Twitter feed to your site.
Why Display Recent Tweets on Your WordPress Site?
X/Twitter is one of the most popular social media platforms on the market. Displaying recent tweets on your WordPress website can enhance your online presence and engagement in several ways.
For starters, when users visit your website and see your social media feed, they might be intrigued enough to click through to your Twitter account and follow you, increasing your reach.
Plus, tweets can serve as a real-time update about what’s happening on your website or company. This can encourage engagement among your audience, as they can interact with your tweets directly.
Recent tweets can also act as social proof on your WordPress site. You can retweet positive reviews or people recommending your products, helping build trust with subscribers or customers.
With this in mind, let’s look at the different methods of displaying recent tweets on your WordPress website. You can use the quick links below to skip to a specific method:
Method 1: Manually Embed Tweets in the Gutenberg Block Editor (No Plugin)
The first method to display your recent tweets in WordPress is by manually embedding your Twitter profile or timeline on your WordPress page, post, or widget (for classic theme users).
Just like adding a YouTube video, WordPress makes it easy to embed Twitter content like a single tweet or a timeline. Its oEmbed feature can automatically turn a content URL into an embed code when pasted into the block editor.
First, you need to find and copy the URL of the Twitter profile or tweet that you want to embed.
For example, the Twitter profile URL of WPBeginner is https://twitter.com/wpbeginner
Meanwhile, the URL of a single tweet looks like this: https://twitter.com/wpbeginner/status/1604852592827326464
Next, just follow one of the methods below:
Displaying Recent Tweets in a WordPress Post or Page
First, log into your WordPress dashboard and open the block editor for a WordPress post or page.
If you want to create a new post or page, you can do this by going to Posts/Pages » Add New.
Then, simply paste the Twitter profile URL that you copied earlier in the ‘Type / to choose a block’ area.
You can see this highlighted below.
Once you’ve done that, the block will immediately turn into a Twitter timeline block showing recent Tweets from that particular account.
In the block settings sidebar, you can choose to resize the block for smaller devices to make it more responsive for mobile viewing.
Additionally, feel free to add more blocks to the page or post to encourage users to follow your Twitter account.
Once done, simply click ‘Update’ or ‘Publish’ to make the changes live.
This method adds your recent tweets inside a box with a vertical slider. The box includes the 20 most recent tweets and the ‘View more on Twitter’ button at the end.
Here is what our Twitter timeline looks like:
If you use a WordPress block theme, then you can also use this same method to embed a Twitter feed in the Full Site Editor and display recent tweets in a pattern or template part.
You can learn more about this in our complete guide to WordPress Full Site Editing.
Displaying Recent Tweets in a WordPress Widget Area
If you use a classic WordPress theme and want to display your latest tweets in a widget area (like a sidebar), then just follow these steps.
First, go to Appearance » Widgets. Then, click the ‘+ Add New’ button in your selected widget area and select the Twitter widget.
From here, just paste the Twitter account or post URL in the appropriate field.
Then, click ‘Embed.’
You can then update your widgets and preview the Tweets widget live on your site.
Here’s how the timeline appears in our WordPress sidebar:
Method 2: Display Recent Tweets Using a Twitter Feed Plugin (Recommended)
The second method to add recent tweets to your WordPress site is with a Twitter plugin. The reason why we recommend this method is that it offers a lot more customization options than the previous method, allowing you to adjust the feed to your page design.
For this, we will use Smash Balloon Custom Twitter Feeds. This plugin helps to create beautiful social feeds of different types. You can show tweets based on hashtags, search terms, mentions, timelines, and more.
Note: While there is a free Custom Twitter Feeds plugin, this article will use the Custom Twitter Feeds Pro version. It comes with much more advanced features like timeline filtering and combining multiple Twitter feeds into one.
You will first need to install and activate the WordPress plugin. Once it’s active, go to your WordPress admin area, navigate to Twitter Feed » Settings, and paste your license key into the appropriate field.
After that, you need to activate the license and click ‘Save Changes.’
Now, just go to Twitter Feed » All Feeds.
Then, click the ‘+ Add New’ button.
If this is your first time adding a Twitter feed using Smash Balloon, then you will be asked to verify your email address.
Just go ahead and click the ‘Connect’ button to do that and follow the on-screen instructions.
Once you are done, you will return to the Custom Twitter Feeds plugin page and be asked to select a feed type.
With Custom Twitter Feeds, you can choose to embed a user timeline feed, a hashtag feed, or a search feed. For the sake of this example, we will use the first option. Once you’ve made your choice, just click ‘Next.’
On the next screen, you can type in the Twitter handle you want to embed on your WordPress website.
After that, click ‘Next’ again.
Let’s now pick a Twitter feed template. There are 7 to choose from, and you can always change it later if you don’t think it suits your page design.
After you have made your choice, go ahead and click ‘Next.’
At this stage, you should arrive at the Twitter feed editing interface. You will see a live preview on the right side of the page and a left-hand panel where you can configure how the feed looks.
There are two tabs: ‘Customize’ and ‘Settings.’
Let’s start with Customize. If you choose the ‘Feed Layout’ option, then you can pick between the available feed layouts (like list, masonry, or carousel) set the number of tweets to display, tweak the feed height, and so on.
Note: Because of API limitations, Smash Balloon can only display 1 to 30 tweets at first, but more will accumulate over time.
Once you are done with those settings, simply click the ‘Customize’ button at the top to go back to the main menu.
Another thing you can do is enable the Load More button, which will appear below your displayed tweets. It’s a handy feature if you have tons of tweets but cannot show them all on the same page.
Just click the ‘Load More Button’ option, followed by the ‘Enable’ button. After that, you can customize the button’s appearance.
If you switch to the ‘Settings’ tab, then you can see options to add more feed sources, apply tweet filters, and use advanced features (like adding custom CSS).
You can also click the ‘Clear Feed Cache’ button to remove the previous feed cache. The next time the plugin needs to display your Twitter feed, it will have to retrieve the latest tweets from X/Twitter’s servers instead of using the old cached data.
Let’s try adding filters to your tweets by clicking the ‘Filters’ option.
Here, you can choose to include replies and retweets, show tweets based on which words are allowed or blocked, or hide specific tweets.
Once you are happy with how the Twitter Feed looks, you can click the ‘Save’ button.
To add the Twitter Feed to your page or widget area, just click on the ‘Embed’ button at the top-right corner.
After that, a popup will appear, showing you how to display the Twitter Feed: with a shortcode, a block, or a widget.
Regardless of the method you choose, the first thing you need to do is copy the shortcode because you will need it.
Then, if you want to embed the Twitter feed on a page, click the ‘+ Add to a Page’ button.
Once you do that, you can select an existing page from your WordPress website and click ‘Add.’
You will then be directed to the WordPress block editor of your chosen page.
Click the ‘+’ add block button anywhere on the page and select the Twitter Feed block.
Now, the Twitter Feed you created earlier may not show up right away.
If this happens to you, just paste the shortcode into the ‘Shortcode Settings’ field in the block settings sidebar.
After that, click ‘Apply Changes.’
Once done, you can go ahead and click ‘Update’ to make the changes live.
Here is what the Twitter Feed looks like on our demo site:
If you want to display your Twitter Feed in a widget area, then just click the ‘+ Add to a Widget’ option. You will be redirected to the widget editor next.
Then, simply find and select the ‘Twitter Feed’ widget.
Similar to the previous method, just paste the shortcode in the block settings sidebar and click ‘Apply Changes.’
You will then see your newly created Twitter Feed in the live preview.
Finally, click ‘Update’ to make the changes final.
You can then visit your live website to see what the feed looks like:
Method 3: Display Latest Tweets in WordPress With Twitter Publish (No Plugin + HTML)
The last method lets you add recent Twitter posts using the Twitter Publish feature.
Twitter Publish lets you easily create the embed code for various types of Twitter content, including a tweet, a video, a timeline, or a button (like a Follow or Share button).
This method allows you to customize how the embedded element looks before adding it to your WordPress blog or website. It’s not as powerful as the second method, but it’s worth mentioning because it’s free.
For this tutorial, we will show you how to use Twitter Publish to embed a timeline. First, you need to visit the Twitter Publish website and then paste your Twitter profile URL into the ‘What would you like to embed?’ box.
Once that’s done, click on the arrow icon.
After that, you will be asked to choose a display option: Embedded Timeline or X/Twitter Buttons.
You should choose the ‘Embedded Timeline’ option, as you want to show your Twitter timeline with recent tweets.
Upon selecting the display option, it will instantly create the embed code for your recent tweets. You can go ahead and click ‘Copy Code’ to embed the custom HTML code right away.
Alternatively, click ‘Set customization options’ to customize how the embedded timeline looks.
Here, you can customize the timeline’s height and width, choose a light or dark mode, and enable a language translation for the tweets if needed.
You can see what the embedded element will look like below the settings. Once done, just click ‘Update.’
The embed code will now include the customization settings you have chosen for the timeline.
Simply click ‘Copy Code’ to continue.
Now, go back to your WordPress dashboard and open the block editor for a page, post, or widget area.
After that, just click the ‘+’ add block button anywhere in the editor and select the Custom HTML widget or block.
Now, go ahead and paste the embed code from earlier in the field.
Once done, you can click the ‘Preview’ button to see what the feed looks like.
After that, feel free to add more elements to the page, post, or widget area. Then, just update or publish it.
Here’s what our demo website looks like:
Bonus Tip: Add More Social Media Feeds to WordPress
Do you run other social media platforms for your brand or business? If so, then you might want to display other social feeds besides Twitter on your website.
By displaying different social feeds on your WordPress site, you can let visitors know what platforms they can follow you on, increasing your follower count.
Showing off your social feeds also has a key advantage over displaying the usual social icon buttons. It can show visitors what content they would miss by not following you on your social networks, creating a ‘fear of missing out.’
With Smash Balloon, you can display and customize all kinds of social media feeds on your WordPress website. This way, all of the feeds look good with the theme you are using.
Just check out the tutorials below on how to display different social feeds in WordPress:
- How to Create a Custom Facebook Feed in WordPress
- How to Create a Custom Instagram Photo Feed in WordPress
- How to Show Latest Videos From YouTube Channel in WordPress
- How to Embed TikTok Videos in WordPress (Easy Methods)
- How to Show Google, Facebook, and Yelp Reviews in WordPress
We hope this article helped you to learn how to show recent tweets in WordPress. You may also want to see our guide on how to automatically post new Instagram photos to WordPress or our expert pick of the best WordPress social media plugins.
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.
Dayo Olobayo
Is there a way to customize the appearance of the recent tweets display on my WordPress site? For example, can I change the font size or colors to match my website’s design?
WPBeginner Comments
With the Smash Balloon option, you can customize the look of the feed.
Kate
Hi, I was following the first set of instructions, but when I paste my Twitter URL in the text box nothing happens. I don’t know if it matters that I have Divi Builder enabled on my wordpress site?
WPBeginner Support
If it’s not embedding properly, you would want to try adding the twitter embed block and placing the url there.
Admin
Glenn
This seems to be an older article…I’m wondering how I can show my timeline..not my tweets but the people I follow. The Twitter Widgets page only shows Search, not my timeline or a list.
Thank you.
Glenn
Minhazul Islam
Is there any plugin to do the same task?
Greg McGee
I have successfully created a twitter feed on my wordpress site. Yaaay!!! Now the bad news. It disappears after 3 seconds. Booo!!! Where can I change the parameter that sets this limit? It is hiding from me very well. But I’m not all that smart, either.
Gopal sharma
This is the best tutorial i found ever..
onya icha
on mobile all my tweets displays and make my website to look funny .pls how can i solve this problem
Simeon Opeyemi
Thanks. it worked for me!
gertrude
I added this but apart from a link to my tweeter it doesn’t do anything. I have wordpress 3.8.1 and activated the default theme, then switched back to the one I am using. Still nothing. If there is any way you guys can help it would be great. Thanks
WPBeginner Support
Trying switching off all plugins and then test, particularly if you are using any Twitter related plugin. If this does not work, then you need to break the widget code into two pieces. Paste the javascript part starting from the <script> in your theme’s header.php, and the link part in a text widget.
Admin
K.T. Lynch
For some reason the closing HTML tags are stripped out once I press save. This is appearing on my WP Sidebar:
Tweets de @lynchkt !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?’http’:’https’;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+”://platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);
The “Tweets de @lynchkt” is a hyperlink but otherwise it’s not working.
WPBeginner Support
This could happen for many reasons. If you are using WordPress 3.8 then try to update to 3.8.1. Try switching to a default theme temporarily and see if you still get this error.
Admin
Ines TR
Hello!
I just see a buncg of words in my blog page after pasting the widget , why?
I saved it and tried several times but can´t fix the problem.
Abdul
How do I get it on a wp page?
WPBeginner Support
you can paste the same code in WordPress pages as well as posts.
Admin
Douglas Vautour
Thanks a lot! All of the twitter widgets I found wanted way too much information! I feel better getting it from the source.
Ann
Hi!
Thank you for sharing this. My regular Twitter widgets just weren’t working!
Nancy Closson
I am looking for a widget that allows you to select tweets from one twitter account rather than show all or recent tweets. Is this customization possible and is that what you describe with the favorites list? thanks you
WPBeginner Support
yes this customization is possible but with these widgets. The favorites widget will show the tweets you have marked as favorites.
Admin
gaston
very useful!!
solved it in a buzz!
thanks!
Shana Manuel
Wow! This took me 5 minutes to set up and I’m a total novice! Thanks for this article.
Founterior
It works just fine !!!
patty
Sweet. Thanks for this!
Bill Hutchison
Thank you for this. I have used widgets for this in the past but have been generally unsatisfied with the results. The seems to be the best solution for including Twitter in the sidebar.
Thanks again.
Joan
I have a question:
Is it possible to personalize the twitter widget weight? With the old twitter code was possible.
Thanks
Chris Race
Thanks for this article! Was looking for a new widget as my old one stopped working – and found this simple solution. Great!
Rickard
I don’t know, but every single solution I’ve tried to use is messing with the admin panel more often than anyone can find ok.
Is there anyway to fight the “waiting for platform.twitter.com” which breaks many functions in the WP-admin-panel?
I guess this happens because of a overload on platform.twitter.com(?) and pages in the wp-admin-panel will continue loading forever…
Might there be a way to set a time limit for the call, and if not found ignore it?
Editorial Staff
This should have no impact on your WordPress admin panel. You are adding this in the widgets which only loads in the front-end of your website.
Admin
Julien Maury
I cannot agree more. There is another great thing with widget, they use streams (see streaming APIs) so you can display A LOT of tweets without worrying about rate limits.
And if you want to get a special feature you’ll add data-chrome=”noheader,nofooter,noborders,transparent” in the link. These new parameters allow you to make widgets “design friendly”.
Gordon Chambers
Hi,
I’ve been trying the above but when I click save it changes the value added in the ID box to a shortened number. I have tried to add both my twitter accounts and it does the same?
Julien Maury
That’s weird. Check the quotes – they have to be real quotes not like in this comment section.