About this:

In the UX Builder you have the option for some elements to hide or show content for certain screens. By using these attributes you can do the same for content within a text block.

Per example;

This paragraph is visible on Desktop but you cannot see the Mobile paragraph.

This paragraph is visible on Mobile but you cannot see the Desktop paragraph.

HTML code

<div data-show="[attribute-value]">
    <!-- any tag can be used -->
    <p>Content visibility</p>

The attributes

hide-for-large   <!-- Hide for Desktop, show for Tablet & Mobile -->
hide-for-medium  <!-- Hide for Tablet, show for Desktop & Mobile -->
hide-for-small   <!-- Hide for Mobile, show for Desktop & Tablet -->
show-for-large   <!-- Show for Desktop, hide for Tablet & Mobile -->
show-for-medium  <!-- Show for Tablet, hide for Desktop & Mobile -->
show-for-small   <!-- Show for Mobile, hide for Desktop & Tablet -->

How to use

  1. Use a tag with corresponding data-show attribute


Any element can be used with these attributes.

Stay Connected

Get in touch

Flatsome is the perfect theme for your shop, company websites or client websites. It has all the tools needed to create super fast responsive websites with amazing user experience.