Friday, June 16

Showing Scripts in Blogger Mobile Theme

Showing Scripts in Blogger Mobile Theme

Have you noticed that some of your scripts and other changes do not affect the blogger mobile template and makes it hard to run same scripts in both desktop and mobile version of blog . It's because blogger uses different templates for both desktop and mobile version by default.


The best solution to this problem is using custom template for mobile version of blog. Custom mobile template adapts it self according to the desktop template and reflects all your changes to the theme. By choosing custom template for mobile version your scripts and other data will also affect the mobile version. I was also having some problems with showing push-notifications in mobile version of blog and by choosing custom template for mobile all my problems disappeared.
How to show desktop version scripts in mobile version in blogger ?

Step1: Go to Blogger > Theme and click on Gear icon under mobile theme.


Step2: Choose custom template from the list and click on Yes, Show mobile theme on mobile devices. Save changes.


Now, your all scripts will become active for both mobile and desktop versions. What if you don't want to show any script in mobile or desktop version . Blogger conditional tags can do that work easily . There are conditional tag for both mobile version and desktop version in blogger. So, you can easily choose what to show on desktop or mobile version.

How to hide scripts from blogger mobile theme ?

Put your script between below conditional statement and they will not work on mobile theme and will only work on desktop version.

<b:if cond='data:blog.isMobileRequest != &quot;true&quot;'>

< Put Script Here>

</b:if>

How to hide scripts from blogger desktop theme ?

Add script between below conditional tag to hide from desktop and to show only on mobile theme.

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>

< Put Script Here>

</b:if>