WordPress

How to Display Recent Tweets in WordPress (Step by Step)

Do you wish to show your current tweets in WordPress?

Integrating X/Twitter together with your WordPress web site helps enhance person engagement. Your weblog guests can simply uncover your tweets, which might additionally provide help to get new followers on Twitter.

On this article, we are going to present you show current tweets in WordPress.

How to Display Recent Tweets in WordPress

Why Show Latest Tweets on Your WordPress Website?

X/Twitter is likely one of the hottest social media platforms available on the market. Displaying current tweets in your WordPress web site can improve your on-line presence and engagement in a number of methods.

For starters, when customers go to your web site and see your social media feed, they is perhaps intrigued sufficient to click on by means of to your Twitter account and observe you, growing your attain.

Plus, tweets can function a real-time replace about what’s taking place in your web site or firm. This may encourage engagement amongst your viewers, as they’ll work together together with your tweets instantly.

Latest tweets may also act as social proof in your WordPress web site. You possibly can retweet constructive critiques or folks recommending your merchandise, serving to construct belief with subscribers or prospects.

With this in thoughts, let’s have a look at the completely different strategies of displaying current tweets in your WordPress website. You should utilize the short hyperlinks under to skip to a particular methodology:

Technique 1: Manually Embed Tweets within the Gutenberg Block Editor (No Plugin)

The primary methodology to show your current tweets in WordPress is by manually embedding your Twitter profile or timeline in your WordPress web page, submit, or widget (for traditional theme customers).

Identical to including a YouTube video, WordPress makes it simple to embed Twitter content material like a single tweet or a timeline. Its oEmbed characteristic can routinely flip a content material URL into an embed code when pasted into the block editor.

First, it’s worthwhile to discover and replica the URL of the Twitter profile or tweet that you want to embed.

For instance, the Twitter profile URL of WPBeginner is https://twitter.com/wpbeginner

In the meantime, the URL of a single tweet seems like this: https://twitter.com/wpbeginner/standing/1604852592827326464

Subsequent, simply observe one of many strategies under:

Displaying Latest Tweets in a WordPress Put up or Web page

First, log into your WordPress dashboard and open the block editor for a WordPress submit or web page.

If you wish to create a new post or web page, you are able to do this by going to Posts/Pages » Add New.

Clicking Add New Page in WordPress admin area

Then, merely paste the Twitter profile URL that you just copied earlier within the ‘Sort / to decide on a block’ space.

You possibly can see this highlighted under.

Pasting a Twitter URL to the block editor

When you’ve finished that, the block will instantly flip right into a Twitter timeline block exhibiting current Tweets from that individual account.

Within the block settings sidebar, you may select to resize the block for smaller units to make it extra responsive for cell viewing.

Moreover, be happy so as to add extra blocks to the web page or submit to encourage customers to observe your Twitter account.

As soon as finished, merely click on ‘Replace’ or ‘Publish’ to make the modifications stay.

Publishing a page with a Twitter Feed

This methodology provides your current tweets inside a field with a vertical slider. The field consists of the 20 most up-to-date tweets and the ‘View extra on Twitter’ button on the finish.

Here’s what our Twitter timeline seems like:

An example of a page with a Twitter Feed made with the built-in Twitter block

When you use a WordPress block theme, then you can too use this identical methodology to embed a Twitter feed within the Full Website Editor and show current tweets in a sample or template half.

You possibly can study extra about this in our complete guide to WordPress Full Site Editing.

Displaying Latest Tweets in a WordPress Widget Space

When you use a traditional WordPress theme and wish to show your newest tweets in a widget space (like a sidebar), then simply observe these steps.

First, go to Look » Widgets. Then, click on the ‘+ Add New’ button in your chosen widget space and choose the Twitter widget.

Adding a Twitter widget in WordPress

From right here, simply paste the Twitter account or submit URL within the acceptable subject.

Then, click on ‘Embed.’

Embedding a Twitter profile in a WordPress widget area

You possibly can then replace your widgets and preview the Tweets widget stay in your web site.

Right here’s how the timeline seems in our WordPress sidebar:

Example of a Twitter widget in a WordPress sidebar

The second methodology so as to add current tweets to your WordPress web site is with a Twitter plugin. The rationale why we suggest this methodology is that it affords much more customization choices than the earlier methodology, permitting you to regulate the feed to your web page design.

For this, we are going to use Smash Balloon Custom Twitter Feeds. This plugin helps to create stunning social feeds of various sorts. You possibly can present tweets primarily based on hashtags, search phrases, mentions, timelines, and extra.

You’ll first must install and activate the WordPress plugin. As soon as it’s energetic, go to your WordPress admin space, navigate to Twitter Feed » Settings, and paste your license key into the suitable subject.

After that, it’s worthwhile to activate the license and click on ‘Save Modifications.’

Activating Smash Balloon's Custom Twitter Feeds Pro license key

Now, simply go to Twitter Feed » All Feeds.

Then, click on the ‘+ Add New’ button.

Adding a new Twitter Feed with Smash Balloon

If that is your first time including a Twitter feed utilizing Smash Balloon, then you may be requested to confirm your e mail handle.

Simply go forward and click on the ‘Join’ button to do this and observe the on-screen directions.

Connecting the user's email address with Smash Balloon

As soon as you’re finished, you’ll return to the Customized Twitter Feeds plugin web page and be requested to pick a feed kind.

With Customized Twitter Feeds, you may select to embed a person timeline feed, a hashtag feed, or a search feed. For the sake of this instance, we are going to use the primary possibility. When you’ve made your selection, simply click on ‘Subsequent.’

Creating a User Timeline Twitter Feed with Smash Balloon

On the following display screen, you may kind within the Twitter deal with you wish to embed in your WordPress website.

After that, click on ‘Subsequent’ once more.

Choosing a Twitter Feed source in Smash Balloon

Let’s now decide a Twitter feed template. There are 7 to select from, and you may all the time change it later should you don’t assume it fits your web page design.

After you’ve gotten made your selection, go forward and click on ‘Subsequent.’

Choosing a Smash Balloon Twitter Feed template

At this stage, it is best to arrive on the Twitter feed enhancing interface. You will notice a stay preview on the best aspect of the web page and a left-hand panel the place you may configure how the feed seems.

There are two tabs: ‘Customise’ and ‘Settings.’

The Twitter Feed editing interface in Smash Balloon

Let’s begin with Customise. When you select the ‘Feed Structure’ possibility, then you may decide between the accessible feed layouts (like checklist, masonry, or carousel) set the variety of tweets to show, tweak the feed peak, and so forth.

Be aware: Due to API limitations, Smash Balloon can solely show 1 to 30 tweets at first, however extra will accumulate over time.

As soon as you’re finished with these settings, merely click on the ‘Customise’ button on the prime to return to the principle menu.

Customizing the Twitter Feed layout in Smash Balloon

One other factor you are able to do is allow the Load Extra button, which is able to seem under your displayed tweets. It’s a useful characteristic in case you have tons of tweets however can’t present all of them on the identical web page.

Simply click on the ‘Load Extra Button’ possibility, adopted by the ‘Allow’ button. After that, you may customise the button’s look.

Customizing the Twitter Feed Load More Button in Smash Balloon

When you swap to the ‘Settings’ tab, then you may see choices so as to add extra feed sources, apply tweet filters, and use superior options (like adding custom CSS).

You can even click on the ‘Clear Feed Cache’ button to take away the earlier feed cache. The following time the plugin must show your Twitter feed, it should retrieve the most recent tweets from X/Twitter’s servers as an alternative of utilizing the previous cached knowledge.

Customizing the Twitter Feed settings in Smash Balloon

Let’s attempt including filters to your tweets by clicking the ‘Filters’ possibility.

Right here, you may select to incorporate replies and retweets, present tweets primarily based on which phrases are allowed or blocked, or conceal particular tweets.

Customizing the filters to display the Twitter Feed in Smash Balloon

As soon as you’re proud of how the Twitter Feed seems, you may click on the ‘Save’ button.

So as to add the Twitter Feed to your web page or widget space, simply click on on the ‘Embed’ button on the top-right nook.

After that, a popup will seem, exhibiting you show the Twitter Feed: with a shortcode, a block, or a widget.

The Twitter Embed Feed popup in Smash Balloon

Whatever the methodology you select, the very first thing it’s worthwhile to do is copy the shortcode as a result of you will have it.

Then, if you wish to embed the Twitter feed on a web page, click on the ‘+ Add to a Web page’ button.

When you try this, you may choose an current web page out of your WordPress web site and click on ‘Add.’

Selecting a page to embed the Twitter Feed in using Smash Balloon

You’ll then be directed to the WordPress block editor of your chosen web page.

Click on the ‘+’ add block button anyplace on the web page and choose the Twitter Feed block.

Selecting the Smash Balloon Twitter Feed block in the block editor

Now, the Twitter Feed you created earlier might not present up immediately.

If this occurs to you, simply paste the shortcode into the ‘Shortcode Settings’ subject within the block settings sidebar.

After that, click on ‘Apply Modifications.’

Inserting a shortcode in the Smash Balloon Twitter Feed block

As soon as finished, you may go forward and click on ‘Replace’ to make the modifications stay.

Here’s what the Twitter Feed seems like on our demo web site:

An example of the Twitter Feed made with Smash Balloon

If you wish to show your Twitter Feed in a widget space, then simply click on the ‘+ Add to a Widget’ possibility. You may be redirected to the widget editor subsequent.

Then, merely discover and choose the ‘Twitter Feed’ widget.

Adding the Twitter Feed Smash Balloon widget in the widget editor

Just like the earlier methodology, simply paste the shortcode within the block settings sidebar and click on ‘Apply Modifications.’

You’ll then see your newly created Twitter Feed within the stay preview.

Inserting the Smash Balloon Twitter Feed shortcode in the widget editor

Lastly, click on ‘Replace’ to make the modifications remaining.

You possibly can then go to your stay web site to see what the feed seems like:

Example of the Twitter Feed widget made with Smash Balloon

Technique 3: Show Newest Tweets in WordPress With Twitter Publish (No Plugin)

The final methodology helps you to add current Twitter posts utilizing the Twitter Publish characteristic.

Twitter Publish helps you to simply create the embed code for numerous kinds of Twitter content material, together with a tweet, a video, a timeline, or a button (like a Comply with or Share button).

This methodology lets you customise how the embedded component seems earlier than including it to your WordPress blog or web site. It’s not as highly effective because the second methodology, however it’s value mentioning as a result of it’s free.

For this tutorial, we are going to present you use Twitter Publish to embed a timeline. First, it’s worthwhile to go to the Twitter Publish web site after which paste your Twitter profile URL into the ‘What would you wish to embed?’ field.

As soon as that’s finished, click on on the arrow icon.

Inserting a Twitter URL in the Twitter Publish website

After that, you may be requested to decide on a show possibility: Embedded Timeline or X/Twitter Buttons.

You must select the ‘Embedded Timeline’ possibility, as you wish to present your Twitter timeline with current tweets.

Twitter Publish's display options

Upon deciding on the show possibility, it can immediately create the embed code on your current tweets. You possibly can go forward and click on ‘Copy Code’ to embed the customized HTML code immediately.

Alternatively, click on ‘Set customization choices’ to customise how the embedded timeline seems.

Customizing the Twitter Feed made with Twitter Publish

Right here, you may customise the timeline’s peak and width, select a light-weight or darkish mode, and allow a language translation for the tweets if wanted.

You possibly can see what the embedded component will seem like under the settings. As soon as finished, simply click on ‘Replace.’

Clicking Update in the Twitter Publish website

The embed code will now embody the customization settings you’ve gotten chosen for the timeline.

Merely click on ‘Copy Code’ to proceed.

Copying a Twitter Publish embed code

Now, return to your WordPress dashboard and open the block editor for a web page, submit, or widget space.

After that, simply click on the ‘+’ add block button anyplace within the editor and choose the Customized HTML widget or block.

Selecting the Custom HTML block in the block editor

Now, go forward and paste the embed code from earlier within the subject.

As soon as finished, you may click on the ‘Preview’ button to see what the feed seems like.

Pasting the Twitter Publish HTML code in the block editor

After that, be happy so as to add extra parts to the web page, submit, or widget space. Then, simply replace or publish it.

Right here’s what our demo web site seems like:

An example of Twitter Feed made with the Twitter Publish website

Bonus Tip: Add Extra Social Media Feeds to WordPress

Do you run different social media platforms on your model or enterprise? In that case, then you definitely may wish to show different social feeds apart from Twitter in your web site.

By displaying completely different social feeds in your WordPress web site, you may let guests know what platforms they’ll observe you on, growing your follower depend.

Displaying off your social feeds additionally has a key benefit over displaying the same old social icon buttons. It might present guests what content material they might miss by not following you in your social networks, making a ‘worry of lacking out.’

With Smash Balloon, you may show and customise every kind of social media feeds in your WordPress web site. This manner, the entire feeds look good with the theme you’re utilizing.

Customize TikTok feed layout

Simply try the tutorials under on show completely different social feeds in WordPress:

We hope this text helped you to discover ways to present current tweets in WordPress. You may additionally wish to see our ultimate guide to WordPress SEO (search engine optimization) or our professional decide of the best WordPress social media plugins.

When you appreciated this text, then please subscribe to our YouTube Channel for WordPress video tutorials. You can even discover us on Twitter and Facebook.



Leave a Reply

Your email address will not be published. Required fields are marked *