If you want to show a particular block only on mobile devices and tablets, you can hide it on desktop with the help of a custom code.

Important: this option is available for Pro sites only.

Step 1. Getting a block anchor name

To make the integration work, you should first find out the anchor name of the block you want to hide. For that, hover over the block and click on the "gear" to open its settings:



Open the Info tab and copy the block anchor name:



Step 2. Hiding a block via custom code

Open the global settings of your site and navigate to the Custom code tab:



Open the CSS tab and add the following snippet:

@media (min-width: 768px) {
#anchor ~ section {
display: none;
}
}




Important: replace the #anchor in the code with the block anchor name you get on the first step.

Click Save for the changes to appear live.
Was this article helpful?
Cancel
Thank you!