Webflow sync, pageviews & more.
NEW
Answers

How can I hide the contact section and headers in design view in Webflow?

To hide the contact section and headers in the design view in Webflow, you can utilize several techniques. Here are a few methods you can try:

1. Using the Display property: Select the contact section and headers in the design view. In the settings panel, navigate to the Styles tab and scroll down to the Display section. Change the display property to "None". This will make the selected elements invisible in the design view, but they will still be present in the actual published website.

2. Using the Opacity property: Similar to the first method, select the contact section and headers. In the settings panel, go to the Styles tab and look for the Opacity section. Set the opacity to 0. This will make the elements transparent in the design view.

3. Utilizing a Class and Custom Code: Select the contact section and headers and assign them a unique class name in the settings panel. Then, go to the Custom Code section of the page settings. In the head code section, add CSS code targeting the class you assigned to the contact section and headers and set the display property to "none". For example:

```css

```

Make sure to replace "hidden-elements" with the actual class name you assigned. This method will completely hide the elements in both the design view and published website.

Remember to preview your changes in the designer to ensure the desired elements are properly hidden. Additionally, if you need to show these elements at a later stage, you can simply revert the changes or remove the custom code you added.

Rate this answer

Other Webflow Questions