Brickspace Lab
Contact usContact ShopifyTry a theme
Keystone
Keystone
  • Keystone documentation
  • Getting started
    • Theme basics
    • Theme settings
      • Colors
      • Typography
      • Borders
      • Prices
      • Quick add
  • Guides
    • Products
      • Product badges
      • Product subtitles
      • Custom content for tables
      • Replace "Add to cart"
      • Disable quick add
      • Product template
    • Collections
      • Collection template
    • Sitewide
      • Color and option swatches
      • Device specific visibility
      • Discount popups
      • Article template
      • Blog template
    • Wholesale
      • Wholesale basics
      • Account restrictions
  • Sections
    • Sitewide
      • Header
      • Footer
      • Announcement
      • Cart drawer
      • Search drawer
      • Menu drawer
      • Discount
      • Account drawer
      • Custom liquid
      • Store locater
    • Navigation
      • Navigation links
    • Content and Media
      • Banner
      • Image hotspot
      • Slideshow
      • Countdown
      • Slider
      • Video
      • Split banner
      • Testimonial slider
      • Search banner
      • Marquee
      • Rich text
      • Blog posts grid
      • Logo list
      • Icon grid
      • Collapsible content
      • Tabs
      • Collage
      • Testimonial grid
    • Products and Collections
      • Product grid
      • Product slider
      • Product table
      • Product comparison
      • Recently viewed
      • Collection list grid
      • Collection list slider
      • Featured product
      • Comparison table
    • Forms
      • Contact form
      • Email sign-up
      • Sign-up form
      • Tool tip
  • General
    • Changelog
      • v1.3.0
      • v1.2.0
      • v1.1.0
      • v1.0.1
      • v1.0.0
    • Known issues and troubleshooting
    • Cloning a demo theme
      • Knit
      • Kingpin
      • Kindred
      • Kettle
      • Kaleidoscope
Powered by GitBook
On this page

Was this helpful?

Edit on GitHub
  1. Guides
  2. Sitewide

Device specific visibility

After editing your theme and previewing it across devices, you may find some sections work better on specific devices. For example:

  • Sliders often work better on mobile

  • Grid sections often work better on desktop

Keystone lets you create device-specific sections to optimize user experience.

How to Set Up Device-Specific Sections

  1. Open the Theme Editor

    • Click Customize next to your theme

  2. Create two sections

    • One section for desktop

    • One section for mobile

  3. Set mobile display preferences

    • Click into your mobile section

    • Scroll to Display

    • Click Show on mobile only

  4. Set desktop display preferences

    • Click into your desktop section

    • Scroll to Display

    • Click Show on desktop only

  5. Save your changes

    • You now have sections that display exclusively on their intended devices

Last updated 1 month ago

Was this helpful?