Global Mobile Adjustments:
Inside the Design tab is a Mobile Adjustments menu, which adjusts the scale of text and padding throughout the entire site on mobile devices. Note: the “Padding Offset” option will have no effect if the page’s main “Padding” is set to 0.
Thumbnail Index Mobile Adjustments:
The Thumbnail Index menu in the Design tab has a Mobile Adjustments submenu to adjust the Thumbnail Index layout on mobile devices.
Image Gallery Mobile Adjustments:
Image Galleries have a Mobile Adjustments submenu with options to adjust a gallery’s layout on mobile devices.
Site Menu Mobile Adjustments:
The built-in Site Menu has an option for “Mobile Only” which will show the Site Menu button on mobile devices only.
Columns Mobile Adjustments:
Inside of the Columns menu is "Single Column on Mobile." This will render the left columns on top of the right columns in mobile view.
Mobile-only Pinned Pages:
Pinned pages have a “Show on Mobile” and a "Show on Desktop" setting within the Pin Settings. This can be used to show a page on desktop, and another on mobile. If both are selected, the Pin will be visible in both cases.
Backdrop Mobile Adjustments:
If “Split” is enabled for a Backdrop, choosing the “Responsive” option which will stack the Backdrop on top of the Content on mobile, instead of displaying side-by-side. The Backdrop will take up 50% of the browser height.
Mobile CSS Customizations:
Every element in a site can be styled differently on mobile through editing css. You can create a mobile-specific version of any CSS selector by adding
body.mobile before it. For example, to change the color of image gallery captions on mobile, create the following selector in the CSS Editor:body.mobile .gallery_image_caption {
color: red;
}Still need help?