By using this site, you agree to the Privacy Policy and Terms of Use.
Accept
Blogbeast
  • Adsense
  • Blogger
  • WordPress
  • Social Media
  • SEO
  • Tips
  • Offbeat
Search
© 2022 Foxiz News Network. Ruby Design Company. All Rights Reserved.
Reading: How to Add Simple Stylish Recent Posts Widget For Blogger
Share
Sign In
Notification Show More
Latest News
What is blogging and how to make money from it?
What is blogging and how to make money from it?
Offbeat
How To Make Money from Blogging
8 Fastest ways on How To Make Money from Blogging
monetization
What is wordpress plugin
20 Best WordPress Plugins for your Websites in 2022
wordpress
How to Uninstall Wordpress Plugins manually
How to Uninstall WordPress Plugins completely with Shortcode
wordpress
What is wordpress plugin
What is wordpress plugin ? How to install WordPress plugin in 4 easy methods?
wordpress
Aa
Blogbeast
Aa
  • Adsense
  • Blogger
  • WordPress
  • Social Media
  • SEO
  • Tips
  • Offbeat
Search
  • Adsense
  • Blogger
  • WordPress
  • Social Media
  • SEO
  • Tips
  • Offbeat
Have an existing account? Sign In
Follow US
© 2022 Foxiz News Network. Ruby Design Company. All Rights Reserved.
bloggerwidgets

How to Add Simple Stylish Recent Posts Widget For Blogger

admin
Last updated: 2022/08/27 at 5:58 PM
admin
Share
2 Min Read
SHARE

Displaying Recent posts in your sidebar often help your users to quickly take a look at the content that is more new and fresh. It also gives them a basic idea that what kind of content is published on a certain blog. If the most recent posts are somewhat linked to each other, then it might engage your visitors for a bit longer.

However, in some designing methods people want to display recent posts differently according to their design. In this article, I will show you How to Display Simple Stylish Recent posts Widget in Blogger. This widget is very attractive and eye-catching.

To install this widget on your blog, Go to Blogger Dashboard >> Layout >> Click on Add a Gadget >> Select HTML/JavaScript.

Now Paste below code inside it:

<div id="hlrpsb">
<script src="https://googledrive.com/host/0B-AYvC9Y1riaT0o5TEt3djQ4bTg" type="text/javascript"></script>
<script>var numposts = 7;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>
<script src="UR_BLOG_URL/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts"></script></div>
<noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type="text/css">
#hlrpsb li
{padding-left:10px;}
#hlrpsb  a {color: #fff; font-size: 13px; font-weight: bold;font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif; /* font size of post titles */
display:block;}
.bbrecpost2{
padding:6px 10px 6px 10px;
border:1px solid #e5e5e5;
-moz-box-shadow: 0px 0px 2px #BBB;
-webkit-box-shadow: 0px 0px 2px #BBB;
box-shadow: 0px 0px 2px #BBB;
position:relative;}
.bbrecpost2:nth-child(odd) {background:#c476c4;}
.bbrecpost2:nth-child(even) {background:#945994;}
.bbrecpost2:hover { opacity: .94;}
</style>

Now just change the highlighted things accordingly. Most important step to change is blog address UR_BLOG_URL to yours.

If you want a different background color for Recent Posts, Change the color code in Red with which one matches your template.

You Might Also Like

How to make a Biolink for Instagram on Blogger

How to add a cookie consent notification to Blogger

Difference between Blogger and WordPress | Best blogging platform in 2022

How To make your blogger theme responsive

Share this Article
Facebook Twitter Copy Link Print
Share
Posted by admin
Follow:
Success is no accident. It is hard work, perseverance, learning, studying, sacrifice and most of all, love of what you are doing or learning to do.
Previous Article How To Report Adsense Invalid Clicks To Adsense Team
Next Article How To make your blogger theme responsive
Leave a comment Leave a comment

Leave a Reply Cancel reply

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

Stay Connected

235.3k Followers Like
69.1k Followers Follow
56.4k Followers Follow
136k Subscribers Subscribe
- Advertisement -
Ad imageAd image

Latest News

What is blogging and how to make money from it?
What is blogging and how to make money from it?
How To Make Money from Blogging
8 Fastest ways on How To Make Money from Blogging
What is wordpress plugin
20 Best WordPress Plugins for your Websites in 2022
How to Uninstall Wordpress Plugins manually
How to Uninstall WordPress Plugins completely with Shortcode

We influence 20 million users and is the number one business and technology news network on the planet

Follow US

© 2023 BlogBeast. All Rights Reserved.

Removed from reading list

Undo
Welcome Back!

Sign in to your account

Lost your password?