Toggle Visibility

The Toggle Visibility Addon in SiteOrigin Premium allows you to hide rows and widgets on specific devices. It also allows you to hide rows or widgets for users logged out or logged into your WordPress installation.

Vew the Toggle Visibility Addon demo.

Requirements

To make use of this addon, go to SiteOriginPremium Addons and activate the Toggle Visibility Addon.

Usage

Once the addon is activated, you’ll see the Toggle Visibility section under Row Styles when editing a row and under Widget Styles when editing a widget.

Toggle Visibility for Page Builder Rows

To edit a row in Page Builder, hover over the wrench icon on the far right of an existing row. Click Edit Row to begin editing the row.

Once editing the row, click the Toggle Visibility heading under Row Styles.

The following row Toggle Visibility options are available:

Hide Row on All Devices

Enabling this option will hide the row on all devices. There are a few possible applications for this setting. Perhaps you have content on a page that you’d only like published at certain times of the year. Or perhaps you’re busy adding a new row to an existing page and don’t want it published just yet.

Hide on Desktop
Enable to hide the row on desktop devices.

Hide on Tablet
Enable to hide the row on tablet devices.

Hide on Mobile
Enable to hide the row on mobile devices.

Hide When Logged Out
Enable to hide the row for users logged out of WordPress.

Hide When Logged In
Enable to hide the row for users logged into WordPress.

Scheduling
Enable to display the scheduling section. Show or hide the row between a selected date range. Once enabled, the following settings will be available.

Display: Choose between Show or Hide.
Date From: Select the date to show or hide the row from.
Date To: Select the date to show or hide the row to.

Toggle Visibility for Widgets in Page Builder

To edit a widget in Page Builder, hover over the widget and click the Edit link.

Once editing the widget, click the Toggle Visibility heading under Widget Styles.

The following widget Toggle Visibility options are available:

Hide Widget on All Devices

Enabling this option will hide the widget on all devices. There are a few possible applications for this setting. Perhaps you have content on a page that you’d only like published at certain times of the year. Or perhaps you’re busy adding a new widget to an existing page and don’t want it published just yet.

Hide on Desktop
Enable to hide the widget on desktop devices.

Hide on Tablet
Enable to hide the widget on tablet devices.

Hide on Mobile
Enable to hide the widget on mobile devices.

Hide When Logged Out
Enable to hide the widget for users logged out of WordPress.

Hide When Logged In
Enable to hide the widget for users logged into WordPress.

Scheduling
Enable to display the scheduling section. Show or hide the widget between a selected date range. Once enabled, the following settings will be available.

Display: Choose between Show or Hide.
Date From: Select the date to show or hide the widget from.
Date To: Select the date to show or hide the widget to.

Toggle Visibility Logged In/Logged Out Using Shortcodes

Content can be displayed or hidden based on a user’s logged-in status using a shortcode.

[toggle_visibility logged="in"]Only logged in users will see this.[/toggle_visibility]

[toggle_visibility logged="out"]Only logged out users will see this.[/toggle_visibility]

Shortcodes can be inserted anywhere text can be added.

Adjusting Page Builder Responsive Breakpoints

If you’d like to change when tablet and mobile device widths are applied, go to SettingsPage BuilderLayout. If required, the following can be changed:

Tablet Width
Defaults to 1024px. Device width, in pixels, to collapse into a tablet view.

Mobile Width
Defaults to 780px. Device width, in pixels, to collapse into a mobile view.