Skip to content 
Every website developer encounters the challenge of removing specific elements such as text, buttons, or images. In this short tutorial, you will learn how to effectively deal with the problem.
Removing Elements Using Your Theme or Builder
One way is to delete it from your theme or use your builder (Elementor, Divi, WPBakery, etc). The problem however is that many times novice developers don’t know what is generating the element that they want to hide and therefore they can’t remove it. Luckily there is an easy way.
Video Tutorial
Learn how to hide an element in your WordPress site through a step-by-step video tutorial.
Step 1: Inspect the Element
The first thing you have to do is open your website on the page where the element you want to hide is. Then, highlight the element, right-click with the mouse, and click “Inspect” (for Chrome).
Step 2: Identify the Element in the Code
Then, you will see which element you have selected to inspect (it will be highlighted). In our case it is
<h2 class="elementor-heading-title elementor-size-default">...</h2>Step 3: Copy the Relevant Code
Now, look at the top right, where you see the styles affecting the element (in the white rectangle). The only thing you should do is to copy the entire code. In our case:
.elementor-162795 elementor-151978 .elementor-element.elementor-element-41227282 .elementor-heading-title
Step 4: Customize in WordPress Admin
Then, close the inspector window and click on the customize button in your WordPress admin top bar. You have to be logged in as an admin to see it.
Step 5: Additional CSS
Click “Additional CSS”.
Step 6: Paste and Hide
Add the code that you copied and paste it into the code editor. Then simply add this code after it:
{
display:none;
}
And voila, the element is hidden!
If you need help building your site or just want a friendly piece of advice, do not hesitate to reach out!
Cheers!
Sources
The source for this tutorial is purely the author’s real-life experience. It is also done by creating screenshots and a screencast for easier understanding.
Useful resources
https://www.w3schools.com/css/css_display_visibility.asp – CSS ‘display’ property explained
