Hide Elements
Customize your web page while it is being displayed in your app.
Last updated
Was this helpful?
Customize your web page while it is being displayed in your app.
Last updated
Was this helpful?
In this section, you can hide the unwanted elements(like footer) from the website which are not important to show in the mobile app. These settings won't affect your actual website. It will be applied only when your web page is being displayed in your mobile app.
This will allow you to hide any webpage element dynamically from the page.
Example : Here I want to remove the header portion from the mobile app. Shown in red box. Remember that it will be just removed from mobile app. The website will still look similar.
Element's identifier: Here you need to enter the HTML tag selector that you want to remove from the web page. Let's take a look at an example of the following code snippet which is going to hide above red highlighted section. You need to search it by doing right click on the webpage and click on inspect element.
For example, you want to remove <div> tag from your web page only while its being displayed in your mobile app. You need to find out class or id property of that element. In our case, here we have class property available. So, we can use body as our element's identifier. So, all the elements with the body class name will be removed from the web page.
Here, the associated class for the header is vc_custom_1547458063113 which looks unique to the div. You can try to remove from inspect elements page too to see if it is really hiding it. Or you can always see it in out preview app.
If you are using class property then enter .body or if using id property then enter #body in the Element's identifier field. So, make sure you append . at the start if using class and # in case of id property.
Here I am giving it as below.
This is how you can remove some element from the web page. If you have any issue and need help then don't hesitate to contact our support.
<div class="wp-header">...</div>
.wp-header
<div id="wp-header">...</div>
#wp-header
<header>...</header>
header
<div class="any non unique element" data-block="section1_sub">...</div>
[data-block="section1_sub"]
