To change blogger's default mobile template and add mobile widgets:
Choose custom mobile template
In Blogger dashboard, go to template panel, click the mobile gear button:
Make sure you select: Yes. Show mobile template on mobile devices.
Choose "Custom" as the mobile template.
Add a widget in layout, in the title, give it an easy-to-find name.
Edit template HTML, find the widget, set its mobile='only' or mobile='yes'(shown in both desktop and mobile).
Problem: An error occurred, please refresh the page and try again
After you add mobile widget, later when you try to move widgets in layout, it may fail with message: An error occurred, please refresh the page and try again
Preview also fails: The template is updated in another place. Please reload the original page and try again.
If this happens continuously, go to template the page to delete the mobile widget, make your change, then later add back the mobile widget.
Choose custom mobile template
In Blogger dashboard, go to template panel, click the mobile gear button:
Make sure you select: Yes. Show mobile template on mobile devices.
Choose "Custom" as the mobile template.
Add a widget in layout, in the title, give it an easy-to-find name.
Edit template HTML, find the widget, set its mobile='only' or mobile='yes'(shown in both desktop and mobile).
Problem: An error occurred, please refresh the page and try again
After you add mobile widget, later when you try to move widgets in layout, it may fail with message: An error occurred, please refresh the page and try again
Preview also fails: The template is updated in another place. Please reload the original page and try again.
If this happens continuously, go to template the page to delete the mobile widget, make your change, then later add back the mobile widget.