Conditions: Mobile

Support
#1

I don’t think mobile conditions are working correctly.

I had two components laid out and Mobile Device conditions set on both of them, with the goal of one displaying on desktop and the other on mobile.

When the condition is set to No, it displays in Cornerstone but doesn’t actually display on a mobile device.

When the condition is set to Yes, it doesn’t display in Cornerstone and still doesn’t appear on a mobile device.

image
image1966×1302 261 KB

image
image1774×846 58.4 KB

#2

Hi @splaquet,

Thanks for reaching out.

The Mobile Device condition is evaluated on the server from the visitor’s browser identity (user agent), not from the screen width. This explains both screenshots: the builder preview is always requested by your desktop browser, so an element set to “Yes” will never render inside Cornerstone, even when you switch the preview to a mobile breakpoint. That part is expected behavior. We tested the same setup on a clean Pro install and the “Yes” element renders correctly on iPhone and Android, while the “No” element renders on desktop.

Troubleshooting

  1. Rule out page caching – if your host, a caching plugin, or a CDN stores one copy of the page for all visitors, phones receive the desktop version and the “Yes” element never appears. Please clear all caches, then load the page on a phone with a throwaway parameter such as ?nocache=1 to bypass the cache. If the element appears, exclude that page from caching or enable your caching tool’s separate mobile cache.

  2. Test on a true mobile browser – an iPad in its default Safari mode and Android with “Request desktop site” enabled both identify as desktop and will show the “No” element. Use an iPhone or Android phone with default settings, or Chrome DevTools device emulation on desktop, which sends a mobile user agent.

  3. Use breakpoints if the goal is screen size – if you want one layout below a certain width and another above it, use the element’s “Hide During Breakpoints” control on the Customize tab instead of the Mobile Device condition. It is CSS-based, previews correctly in the builder, and is unaffected by caching.

Kindly let us know how it goes.