Buy WP Brain

Documentation

Content Visibility

Control the visibility of page and post content with the If and Else elements in WPBakery or the classic editor.

There are two ways to control content: the WPBakery elements (recommended) or the shortcode generator in the classic editor. Both use the same conditions.

Using WPBakery

Place the elements you want to control inside the If/Else containers, then set the condition. This example shows content only on mobile devices.

  1. Create a new page and open the WPBakery editor.
  2. Click Add Element and choose WP Brain If.
  3. The settings dialog opens automatically. Build your condition there.
  4. Select the Device filter and set the rule to match the screenshot below:
    WP Brain If element in WPBakery with a rule for mobile devices
    Adding a device rule to the WP Brain If element.
  5. Place the mobile content inside the green If container:
    Mobile content placed inside the green WP Brain If container
    Content placed inside the If container.
  6. Add a WP Brain Else element after the green container and put the fallback content inside the orange container:
    WP Brain Else container holding fallback content for other devices
    Adding an Else container for every other device.
  7. Save the page and test it on different devices.

Using the text editor

Without WPBakery, you can achieve the same result with the shortcode generator. Here's the same mobile-only example using the classic editor.

  1. Create a preset. Go to WP Brain > Settings, find the presets box and click Add New.
  2. Fill the fields as shown below and save:
    Creating a visibility preset for tablet and desktop visitors
    Creating a device preset.
  3. Create a new page to test with.
  4. Write two lines: one for mobile, one for every other device.
    Two lines of content in the classic editor before applying WP Brain
    Two lines ready for If/Else wrapping.
  5. Select the first line, click the WP Brain icon in the editor toolbar and choose If.
    Selecting the If option from the WP Brain editor toolbar
    Choosing If from the editor toolbar.
  6. Choose the condition preset in the dialog and click OK.
    Choosing a saved condition preset in the WP Brain dialog
    Selecting a saved preset.
  7. Select the second line, open the WP Brain menu and choose Else.
  8. The editor should now show a matching pair of shortcodes:
    Wrapped If and Else shortcodes displayed in the classic editor
    The finished If/Else shortcode pair.
  9. Save the page and test it on your devices.

The rest of this guide focuses on the WPBakery elements; the classic editor follows the same process.