How to Create A Twitter Timeline Widget

Sharing is caring!

Twitter is one of the most popular social media that has been used by millions of users everyday to share their thought and stories. As a business owner or entrepreneur, Twitter has become a free communication platform with the target audience without cost you a penny. So why not get started and let the world know what are you doing and thinking right now. So Twitter Widget – “Embedded Timeline” will be a good way to achieve this.

Turn your website or blog become a marketing tool

In order to keep your readers or potential customers aware of your latest sales or offer, you need to have a Twitter embedded timeline that display all latest tweets and a form that let users to post directly to your Twitter page. Below is the example embedded timeline screenshot for my site.

Twitter Embedded Timeline @terrytsang811
Twitter Embedded Timeline @terrytsang811

5 Steps to Create Twitter Embedded Widget

Step 1: Login to your Twitter Account, then click “Settings” (gear icon) on top right there and “Widgets” on left sidebar.

Twitter > Settings
Twitter > Settings > Widgets

Step 2: Click “Create New” to create a new Twitter widget

Create New Twitter Widget
Create New Twitter Widget

Step 3: Fill in widget form fields

Twitter Widgets - Embedded Timeline
Twitter Widgets – Embedded Timeline

Step 4: Submit form by clicking “Create Widget” button

Copy Embed Code to your website or blog
Copy Embed Code to your website or blog

Example Embed Code:

<a class="twitter-timeline" href="https://twitter.com/twitterapi" data-widget-id="YOUR-WIDGET-ID-HERE">Tweets by @twitterapi</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

NOTE: If you’re already including twitter ‘widgets.js’ JavaScript in your page to show embedded Tweets or Twitter buttons, you don’t need to include this script again; it updates automatically to support new features.

Step 5: Copy generated embed code and put into your website or blog

Leave a Comment

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