Switch between Mobile View and Desktop View using Dropdown Box in Blogger

Blogger supports Mobile template that allows the visitor to view the blog posts in Mobile compatible blogger template. This can be done by activating Show mobile template on mobile devices. in Blogger Dashboard > Template.
When user visits the site using Mobile devices like Android, iPhone. The template automatically changes to Mobile Template. In some cases if the Template doesn't changes or the visitor wants to switch to Desktop View or Mobile View, we can add a Drop down Box that will have the Options to Select which View is to be displayed. This can be done easily by adding the below code to the HTML Widget.

Code

Desktop View and Mobile View Switcher

view plaincopy to clipboardprint?

1. <select onchange='document.location.href=this.options[this.selectedIndex]. value;'>  
2. <option value=""/>Change Page View  
3. <option value="/?m=1" />Mobile View  
4. <option value="/?m=0" />Desktop View  
5. </select>  
6. <style>  
7. select {color:#fff; background-color:#6A5B77;border:4px solid #6A5B77;cursor: hand;cursor: pointer;width:100%}  
8. </style>  

<select onchange='document.location.href=this.options[this.selectedIndex]. value;'> <option value=""/>Change Page View <option value="/?m=1" />Mobile View <option value="/?m=0" />Desktop View </select> <style> select {color:#fff; background-color:#6A5B77;border:4px solid #6A5B77;cursor: hand;cursor: pointer;width:100%} </style>

Preview