If you want to know how to have 100% or nearly 100% freedom in making the mobile view the way you want, you have come to the right place. Read on.
Read the official tutorial
In order to create a PC view and a mobile view, you must understand how to create differentiation in your template. Read up on Google's official document: https://blogger-developers.googleblog.com/2011/11/introducing-custom-mobile-templates.html. This document will give you the basics of modifying your blog template to make it desktop-friendly and mobile-friendly.
After you've read the "Introducing custom mobile templates" article, you know 70% of how to make your blog mobile-friendly. But there are important things that the tutorial did not mention. Read on to find out how to customize the mobile template for your Blogger website.
About b:widget's mobile attribute
As the tutorial suggests you can add an attribute called mobile to tell Blogger whether the widget should be rendered on the desktop view or/and on the mobile view. Here's an example:
<b:widget id='HTML3' locked='false' mobile='no' title='' type='HTML' version='1' visible='true'>
Technically speaking you can simply manipulate CSS definitions and you can get away with it without having to use the mobile attribute. However sometimes you just don't want to use pure CSS. For example, you want the adsense code to be in the desktop layout but not mobile. In this case, you should use the mobile-attribute-in-widget-tag trick.
However, what if the Layout page does not have enough sections you want? For example, what if you want to add a widget to the main section? You cannot do that because there's no Add a gadget button inside the main section.
How to add your own section?
The answer is, you can create your own section in the Template page. Go to Edit HTML and add the following code at the desired place:
<b:section class='leftSection' id='leftSection'></b:section>
You can replace leftSection with whatever name you want. Just make sure it's unique in the template. Save the template and go back to Layout page and you should see the new section you just created. You can click Add a gadget to add a widget the normal way. Once you are done, your template has changed. Therefore if you want to edit template again you must refresh the template.
Google Blogger has quite a few bugs that I have encountered. Some of them are minor but some of them are quite serious. One of them is this. If you set b:widget to mobile='only', then this widget may not appear in the Layout page for you to edit. When you want to edit the widget, you must set it to mobile='no' or mobile='yes', edit it in the Layout page, then come back and set mobile back to 'only'.
This knowledge helped me create my own desktop layout and mobile layout for my Blogger website http://www.oneminuteinfo.com/. Hope it has helped you too.
Questions? Let me know!