Beside the recommended slide widget that slides in and out at the end of every post, adding the related post widget is one important thing that every blogger should endeavor to do if you wish to reduce your bounce rate and send lots of suggestion to your readers.
It goes a long way in helping your readers get more news/post from your blog and also helps in increasing the number of your page views which will be very much important as your grow.
#related-posts {
float : left;
width : 350px;
margin-top:20px;
margin-left : 5px;
margin-bottom:20px;
font : 11px Verdana;
margin-bottom:10px;
}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
text-decoration : none;
}
#related-posts a:hover {
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url("http://2.bp.blogspot.com/_u4gySN2ZgqE/SnZhv_C6bTI/AAAAAAAAAl4/Rozt7UhvgOo/s200/greentickbullet.png") no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 21px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}
RELATED POST WIDGET |
Please if you are a novice, try to back up your template before you embark on this little Html editing
To add the related post widget to your blog/site,
STEP 1
1.) Go to your blogger dash board + Select template + Edit HTML and
2.) Tick the expand widget box located at your top right header.(see image below)
WIDGET TEMPLATE |
3.) After expanding your HTML box, use Ctrl + F to find on your widget template
4.) Right above it, paste the following codes below
#related-posts {
float : left;
width : 350px;
margin-top:20px;
margin-left : 5px;
margin-bottom:20px;
font : 11px Verdana;
margin-bottom:10px;
}
#related-posts .widget {
list-style-type : none;
margin : 5px 0 5px 0;
padding : 0;
}
#related-posts .widget h2, #related-posts h2 {
font-size : 20px;
font-weight : normal;
margin : 5px 7px 0;
padding : 0 0 5px;
}
#related-posts a {
text-decoration : none;
}
#related-posts a:hover {
text-decoration : none;
}
#related-posts ul {
border : medium none;
margin : 10px;
padding : 0;
}
#related-posts ul li {
display : block;
background : url("http://2.bp.blogspot.com/_u4gySN2ZgqE/SnZhv_C6bTI/AAAAAAAAAl4/Rozt7UhvgOo/s200/greentickbullet.png") no-repeat 0 0;
margin : 0;
padding-top : 0;
padding-right : 0;
padding-bottom : 1px;
padding-left : 21px;
margin-bottom : 5px;
line-height : 2em;
border-bottom:1px dotted #cccccc;
}
STEP 2
After that has been done, to add the related post widget above your comment box, just as mine,
1.) Search for the tag (use Ctrl + F to find)
In a situation you do not see this tag, than search for the code below
2.) Below the above code, paste the following codes under
3.) You can decide to adjust the maximum number of related post you want to display by changing the figure 5 to any figure of your choice
Credits To Ngbuzzblog
Hello Visitors!
Jobs and similar opportunities like this are listed daily on our platforms, and as such, it is important to take due advantage of that.
Here is how:
- Kindly Click here and add your valid email address to get updates directly to your mail. Remember to click on the confirmation link in your mail.
- Next, click here to visit our jobs listing Portal for latest Job positions.
- Alternatively, you can visit here to see top companies recruiting, or check out latest jobs in your state or latest Jobs in your industry of interest.
- Pick your area of interest.
- Read the requirements,
- Next, apply.
- Remember to always share this article with others.
- If website is down, kindly subscribe to our email notification, we will notify you once it is up.