Editor Settings - Visibility
The Visibility panel allows you to control whether a block or element is displayed on different device types — Desktop, Tablet, and Mobile. This feature helps ensure responsive and optimized layouts across various screen sizes.
Visibility Options
Desktop
- Controls whether the selected block is visible on desktop screens (typically large displays and laptops).
- When checked, the element will appear on desktop views.
- When unchecked, it will be hidden from desktop layouts.
Tablet
- Determines visibility on medium-sized screens, such as tablets.
- When enabled, the block will be shown on tablet devices.
- When disabled, it will be excluded from tablet views.
Mobile
- Controls visibility on smaller screens, such as smartphones.
- Checking this option ensures the block appears on mobile layouts.
- Unchecking it hides the block from mobile users.
Usage Scenarios
- Device-specific content: Display different elements for desktop and mobile to improve usability and performance.
- Optimized layouts: Hide large or complex components on smaller screens to maintain readability.
- Custom design control: Present tailored content based on the user’s device type.
Default Settings
By default, all three device options - Desktop, Tablet, and Mobile — are checked, ensuring the block is visible across all screen types.
The Visibility Settings panel provides precise control over how and where your content appears. By selectively enabling or disabling visibility across devices, you can create responsive and user-friendly designs that adapt seamlessly to any screen size.
Learn how to adjust the overall Size Settings of your popup elements to maintain proper spacing and alignment across layouts: Editor Settings - Size