In HTML/CSS, when you quote a piece of text from other websites/web pages, then it is usually done through customized quote boxes, called as blockquotes. You can read, add and customize these blockquotes in your blog from this tutorial:Customize Blockquote In Your BlogSpot Blog
Now, in this tutorial you will be able to add a sub-type of blockquotes: Tweetquote, to your blog.
Many tweets go viral on Twitter and many a times, we do find tweets worth sharing with our readers on our blogs. So, here is a creative & professional way to (re)publish tweets on your blogs:
@BillGates congratulating Warren Buffett, for being awarded with National Medal of Fredom:
Congratulations to my dear friend Warren Buffett on National Medal of Freedom - http://bit.ly/eN9rh1-@BillGates
There are just two steps to follow, in this tutorial:
STEP #1
Log in to Blogger, go to Design -> Edit HTML and find this code:
And immediately ABOVE/BEFORE it, paste this code:
STEP #2
Now, while publishing a post on your blog, whenever you want to quote a tweet, do it in this way:
NOTE: Remember the code highlighted in RED, that has to be used everytime you want to quote a tweet.
Your tweet can be of any length (you may use tweets from twitlonger too, as the background cloud pattern will keep on repeating itself). That's it...Publish the post.
Image credits: OneHalfKiller
Log in to Blogger, go to Design -> Edit HTML and find this code:
</head>
And immediately ABOVE/BEFORE it, paste this code:
<style type="text/css">You may use a different background image in your blog by editing the code highlighted in BLUE color in the above code. And SAVE the template.
blockquote.tweetquote {
border-top: 1px solid #FFF;
border-left: 1px solid #FFF;
border-right: 1px solid #46A8B8;
border-bottom: 1px solid #46A8B8;
background: #D1D0C6 url(http://files.main.bloggerstop.net/uploads/3/0/2/5/3025338/twitterquote1.jpg);
background-position:top left;
background-repeat:repeat-y;
margin: 0 20px;
padding: 10px 20px 10px 45px;
font-size: 0.9em;
}
</style>
STEP #2
Now, while publishing a post on your blog, whenever you want to quote a tweet, do it in this way:
<blockquote class="tweetquote">PASTE THE TWEET HERE</blockquote>
-<a href="http://LINK_TO_TWEET">@TWIT_ID</a>
NOTE: Remember the code highlighted in RED, that has to be used everytime you want to quote a tweet.
Your tweet can be of any length (you may use tweets from twitlonger too, as the background cloud pattern will keep on repeating itself). That's it...Publish the post.
Image credits: OneHalfKiller
