Let me introduce you to a very new technique to show slideshow of your recent posts in Blogger blogs. With this tweak applied, you no longer need to edit your widget HTML codes more than once. This jQuery content slider uses my small jQuery content slider technique which I posted in my previous post.
Blogger Blogs encloses all of its content inside division with class name blog-posts, further each posts are wrapped inside a division with class name date-outer according to the date. And again inside date-outer block, each posts will be blocked in post-outer.
In this tutorial I am assuming that you don’t have multiple posts in single day. First we’ll have to tweak the CSS code which will bring all of the posts one above another like in photo slide.
Note: If you don’t know the codding thing and just want to get it done then click here.
To do so, we’ll use following code:
We have abosolutely positioned all the date-outer blocks relative to .blog-posts. In simple words, We have placed all the content blocks one above another. You can change the height of the main box to your required size.
Now anything left is to add sliding effect to it so that the contents keeps sliding one over another.