0
Declined

Global Screen Width API Tag

Cameron Cox 3 years ago • updated 3 years ago 5
It would be awesome to have a Global Screen Width Tag to use in Content Layouts/App Content Templates. My thought on this is to be able to manipulate the HTML in the layout using if statements. For instance, instead of hiding or showing elements in a responsive website via CSS, you could write an if statement in the layout that would output different HTML based on the screen width. Example:

{if #global.screenWidth > "480"}
Do This
{elseif #global.screenWidth > "768"}
Do this
{else}
Do this
{/if}

If this is an easy update that would be awesome, as I already have a particular case I would love to utilize it on. :D

Answer

+1
Answer
That variable shows the resolution width of the device from the WURFL database (http://wurfl.sourceforge.net/). It won't show the desktop size as there is no standard desktop device.

Branch CMS is built with PHP and unfortunately PHP cannot access the screen width as it's a server-side language. You would need to use Javascript. You could pass the width to a cookie value and use that in Branch CMS. See http://www.branchcms.com/blog/post/access-cookie-values-in-branch-cms-code for more information.
Under review
Cameron - Are you referring to the size of the mobile device using the Mobile Detection capabilities in Branch CMS? There is {#global.mobile.resolutionWidth} available right now.
I wasn't aware that was an option. I think that is basically what I am looking for, but would it work for all devices? Or just mobile? What I am looking for is a variable that would detect the screen width for responsive sites. So it would need to work on a desktop, tablet etc. Not just on mobile devices. Is that possible?
+1
Answer
That variable shows the resolution width of the device from the WURFL database (http://wurfl.sourceforge.net/). It won't show the desktop size as there is no standard desktop device.

Branch CMS is built with PHP and unfortunately PHP cannot access the screen width as it's a server-side language. You would need to use Javascript. You could pass the width to a cookie value and use that in Branch CMS. See http://www.branchcms.com/blog/post/access-cookie-values-in-branch-cms-code for more information.
Gotcha. And good call. Thanks