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 :).
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 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.
[php] <b:if cond=’data:top.showMobileShare’> [/php]
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;
[php] <div class=’post-footer-line post-footer-line-2′>
<div class=’mobile-link-button goog-inline-block’ id=’mobile-share-button’>
<div class=’goog-inline-block dummy-container’><data:post.dummyTag/></div>
Below the last </div> tag, Place the below code
<!– Related Posts with Thumbnails Code Start–>
<b:if cond=’data:blog.pageType == "item"’>
<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 != "true"’>,</b:if><b:if cond=’data:blog.pageType == "item"’>
<!– Related Posts with Thumbnails Code End–>
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.
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 :).
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…