How to Embed a Twitter Timeline in Your Blog?

Learn How to create a Timeline widget in Twitter to display twitter stream. This tutorial will help you to add an Embedded Timeline widget to your Blog and Website just by few clicks. You can Place this widget in Blogger Sidebar.

0
data:blog.title
twitter timeline stream

Learn How to create a Timeline widget in Twitter to display twitter stream. This tutorial will help you to add an Embedded Timeline widget to your Blog and Website just by few clicks. You can Place this widget in Blogger Sidebar.

Twitter is a popular medium of spreading your content. Because most of the popular Company, Organization, Celebrity etc use Twitter for sharing the status. Twitter is their first priority to share any news with fans. However in some cases Twitter is one step ahead than Facebook. So we have great chances to divert traffic in our Blog or Website from Twitter. However by sharing content regularly we can make our Blog more popular.

Formerly the brand image of Twitter was dimmed. And Facebook become on spotlight but now Twitter has brought rapid changes on their social media site. Even I have ignored twitter before. But after long time log into my Twitter account I saw huge message I have received about Blogging problem. But due to ignorance I was unable to reach to those honorable Fans of my Twitter page.

Whatever, now a user can greatly benefit in all aspect by using Twitter. Among various recent changes Twitter has introduced couple of widget. And among them Twitter timeline widget is good one. After seeing this I just astonished. However the core concept is copied from Facebook but still good. You can see my twitter timeline widget below which one I have just created for tutorial purpose.



What is Twitter Timeline?

When a twitter user log in to Twitter account and visit profile, then user will land on twitter home timeline. And the home timeline displays a stream of Tweets from accounts that we have chosen to follow on Twitter. Twitter timeline has created by Twitter developer to enhance user experience.

How to Create A Twitter Timeline?

In this tutorial I will show you about creating and embedding Twitter timeline to your Blog like above widget. So please read it through-

Step 1 Visit https://twitter.com/settings and Sign in to your Twitter account.

Step 2 Instantly you will be headed to Twitter setting page. From left side you will find a vertical menu and from there locate and select Widgets.

Step 3 Widgets creation and manage option panel will expend at the right side of the page. Simply Click Create new Button.

Step 4 A new page will open which is called Choose a timeline sources from there you will find 5 timeline source options. Such as
  • User timeline – To display your Recent Tweeted posts with snippet.
  • Likes – To display your likes on other’s tweeted contents.
  • List – To show suggested lists include only those you own and/or subscribe to.
  • Search – To display your Search query around tweeted content.  For example #blogger and it will show on blogger related search result.  You must add a hash tag to search something.
  • Collection - A collection is an editable group of Tweets hand-selected by a Twitter user or programmatically managed via collection APIs. So it will display each collection which has published on own twitter page.

As a Blogger the best choice is User timeline. So select User timeline.

Step 5 Now start to configure the User timeline. Enter the Username on blank field to display tweets. Alternatively, For Favorites, enter the username of the user to display other’s favorite’s tweets. For List, select a public list that you own. For Search, enter your search query by using # tag. In case of search source, make sure to put tick on Safe search mode to exclude sensitive content, profanity, etc.

search timeline
   
Step 6 To adjust widget’s height change the value from Height option. By default height is 600px so change the value to resize the height of your twitter widget.

Step 7 Customize the design by specifying the Theme selection. You can choose either Light or Dark color.

twitter timeline widget

Step 8 To match your website color you can also choose Link color.

Step 9 Finally Click Create widget button and instantly your widget will generate. Now copy the code to use it in Blogger Blog. 

timeline widget code

Congratulation you have successfully generated your Twitter timeline widget. Now it’s time to add in Blogger’s Blog.

How to Add Twitter timeline widget in Blogger?

To add this time line on Google Blogger just follow the below steps-

Step 1 Log in to your Blogger account and Go to your Blogger Dashboard

Step 2 Go to your Layout tab.

Step 3 Click on "Add a Gadget" then select "HTML/JavaScript" Gadget. Leave the Title field blank.

Step 4 Now Paste the Twitter timeline widget code in "HTML/JavaScript" Gadget.

 add a gadget

Step 5 And finally click orange color Save button. You’re done!

Now check your Blogger site and see Twitter timeline is showing your latest tweet. You can also scroll thought your timeline widget to explore more tweeted contents. 
How to Embed a Twitter Timeline in Your Blog?
4 Stars stars - "How to Embed a Twitter Timeline in Your Blog?" Learn How to create a Timeline widget in Twitter to display twitter stream. This tutorial will...

Post a Comment

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form

Name

Email *

Message *