Tech Magazine

Adding Related Post Widget on Blogger Blog Mobile View

Posted on the 07 October 2013 by Babanature @proudlyonenaija

Blogger blog is one of the blogging platforms that give its users privilege to do whatever they feel like doing with their blog. It gives you room to edit your template, add whatever widget you feel like adding, they give you the opportunity to monetize your blog, no CPU usage to worry about, they even give you the opportunity to change your sub domain to a custom domain. I love blogger blog as much as I love wordpress but, blogger mobile view doesn’t give you the access to edit or change its codes. None of the widget/ gadget you add to your desktop view is going to show on your mobile view – hope you’ve notice that? But right now, there are some things you can add to your mobile view if you wish to, like how to add the related post widget I am about to show you on this post :) .

related-post-for-mobile

If you want to keep your site healthy, using related post is a must for your blog. Having a related post widget is not hard, but in-case you have not started using the related post widget on your blogger blog, I will suggest you read this two (2) posts.

ADDING A COOL RELATED POST WIDGET TO YOUR BLOGGER BLOG

ADDING RELATED POST WIDGET WITH THUMBNAIL TO YOUR BLOGGER BLOG

Adding related post widget on blogger blog mobile view

Remember that before you can add the related post widget to your blogger blog mobile view, you must first have one on your desktop view. Now let’s roll to the main tutorial

:)
.

Note: Please before you start playing with your blog codes, do backup your template so that you can revert anytime you make a mistake… to learn how to back up your blogger template, click HERE

Must Read: Adding A Drop Down Menu To Your MobilePress

Go to your blogger blog dashboard >>> Click “Template” >>> Click “Edit HTML”… and you’re in your html editor.

Now search for the below code.

 <b:if cond='data:top.showMobileShare'> 

Remember: To make the search easy click inside the code box and simultaneously press the CTRL + f key to bring out a search bar.

Have you seen the above code? Here is how the complete code looks like;

 <div class='post-footer-line post-footer-line-2'>

<b:if cond='data:top.showMobileShare'>

<div class='mobile-link-button goog-inline-block' id='mobile-share-button'>

<a href='javascript:void(0);'><data:shareMsg/></a>

</div>

</b:if>

<b:if cond='data:top.showDummy'>

<div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>

</b:if>

</div>

</div>

</div> 

Below the last </div> tag, Place the below code

 <br>

<div style='float:left;'>

<!-- Related Posts with Thumbnails Code Start-->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='related-posts'>

<font face='Arial' size='3'><b>Related Posts: </b></font><font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if><b:if cond='data:blog.pageType == &quot;item&quot;'>

<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=5&quot;' type='text/javascript'/></b:if></b:loop> </font>

<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();

</script>

</div>

</b:if>

<!-- Related Posts with Thumbnails Code End-->

</div></br> 

Have you done that? Now click “Save template” and you’re done.

Note: This trick will work only to those bloggers who already have related post widget on their main blog. And do note that the codes are working 100% because it was given to me by my trusted buddy

:)
.

Over to you

Now let’s make this post more interesting; do you believe that keeping your readers for long will engage your site even more? Are you using any related plugin or widget to keep your blog readers for long? If not, please tell us why by using the comment box below.

Must Read: 3 Major Reasons Why You’re Not Making Money With Google Adsense

Do you have questions, comments or thoughts you’d love to share with us? Then please do by using the comment box below. Remember that your comments, questions and thoughts are highly welcomed and most appreciated

:)
.

Be Social

Was the post helpful? Then do click the like button, share us and recommend us to friends because you will never know who among your friends might be in need of a lovely post like this one

:)
.

Do not forget to subscribe to our feed for your latest updates on the go. Have a blessed week start…

Don't Miss Any Post Again. Subscribe To Our Feed And Be Updated

Enter your email address below:

Powered by OnenaijaBlog


Back to Featured Articles on Logo Paperblog