How to make Blogger widgets to show different content between desktop and mobile view


Content of widgets can be customized between desktop and mobile view. This can be achieved by using a boolean variable of "data:blog.isMobile".

The example below demonstrate how a widget would shows different contents between desktop and mobile view by depending on the conditional value of "data:isMobile" variable.

<div class="widget-content">
<b:if cond="data:blog.isMobile">
<!-- Show a text link in mobile view.-->
<a href="http://www.blogger.com">
Powered By Blogger
</a>
<b:else/>
<!-- Show an image link in desktop view.-->
<a href="http://www.blogger.com">
<img expr:src="data:fullButton" alt="Powered By Blogger"/>
</a>
</b:if>
</div>

References or Credits:
http://code.blogger.com/2011/11/introducing-custom-mobile-templates.html

Comments

Popular posts from this blog

City Code Table for Casio SGW300HD-1AV Watch

How to force only 4G or LTE network connection for Samsung Galaxy Note 4

Mounting NFS share directory from D-link DNS 320L on Ubuntu 12.04 LTS