How To; Show A Widget In Blogger Mobile View

Hello my friends, today we will be talking about how we can add or show a widget in mobile view. Do you know that adding a gadget in blogger is very easy but the gadgets don't appear in mobile view until they are enable for mobile. They are are added so that your visitors can see other widget that may be of interest to them. Just like  the popular post widget, Menus, Related post and so on.


Audience is not what you will get from a PC because not all has a PC to start surfing the web, mobile is very important also and you should focus on mobile more of that of PC.. You can engage visitors with your blog for a long time by enabling gadgets in mobile view. And they might want to come back for more.

READ ALSO: Why to start a blog with blogger{google}
                         How to add search box on my blog
                     

How to show widgets in mobile view in blogger:
It is very easy to enable gadgets in mobile view in blogger. Follow the below steps carefully to enable it.
  •  Click on template and edit it.
  •  After editing you blog's template click on 'Jump to widget'.
  • Now select the widget which you want to show in mobile view. I am selectingHtml4(search box) in this tutorial.
Make sure to name your gadget in the Layout while adding it because naming gadget before editing Html will help you to find the gadget easily. After selecting your widget you will see a code similar to below piece of code:
<b:widget id='HTML4' locked='false' title='Google search' type='HTML'>


  • Now after finding code similar to above just write mobile='yes' after Locked='false' as shown in below image(it will enable your widget in mobile view).
  •  Click save template and all is done! open your blog in mobile by using this link https://www.uchetechs.com/?m=1.


How to show a widget only in mobile view in blogger:

Showing a gadget in mobile view only is similar to showing a widget in mobile, like above we add mobile='yes' to show a gadget in blogger mobile view, here we have to do something similar to above. So now if you want to show a gadget only in mobile view and not on the desktop you have to use mobile='only' instead of mobile='yes'. It should be like the code below.
<b:widget id='HTML4' locked='false'mobile='only' title='Google search' type='HTML'>

Note: When a widget is shown only in mobile by adding mobile='only' to its code then that widget is shown in mobile only but a problems rises that is blogger layout doesn't let you to grab gadgets, so you can't move any widget after adding mobile='only' to any widget code so if you wish to grab/move a widget you must remove mobile='only' first. So then you can now grab the widget.

If the widget which you are trying to show in mobile site is not appearing :
  1.  Go to blogger dashboard, navigate to template and edit the mobile template by clicking on the wheel below it
  2.  Switch your template to Custom from default template.
  3.  Click on save and you are done.

Isn't this wonderful, yea i know it is also so no more web version gadgets on its view again but you can now get it on mobile view
Any question feel free to ask me in the comment box below.

No comments:

Post a Comment