Owning a website becoming expensive?

No more! In our library, you will find the best premium WordPress plugins and themes for a fraction of the cost of the original prices. Browse Our Library

How To Remove Page Title With Elementor

How To Remove Page Title With Elementor

If you’re building your website with Elementor, you may like to hide the page title on certain pages.

In this article, you will learn how to remove a page title with Elementor.

Hiding a page title with Elementor is a simple two steps process:

  1. Edit the page with Elementor.
  2. Toggle the Hide Title option to on in the Settings screen.

Let’s dive right in.

Edit Page with Elementor

The first step of hiding the title of a page is to edit that specific page with Elementor.

Therefore, click on the Edit with Elementor button at the admin bar to open the editor.

Edit page With Elementor

Turn On the Hide Title Toggle

Now that we are inside the Elementor edit screen, click on the gear icon at the bottom left corner to access the settings screen of this specific page.

Page settings screen

Now, toggle the Hide Title option to on and make sure that the title was removed successfully.

When done, click on Update to save the changes and revisit your page once again.

Elementor hide title toggle

Great job, the page title was removed and no longer appears on the screen.

Page title was removed with elementor

Elementor Hide Title Option Isn’t Working

By default, the Elementor hide title option is set to hide any H1 element with the class of .entry-title.

In most cases, that is the default class for many WordPress themes, and turning the hide title toggle option to on will do its job and remove the title.

In some other cases, depends on the WordPress theme you’re using, switching the Hide Title toggle to on will not work for you and will not remove the title.

If the hide title option did not work for you, we will need to find the class of your page title and add it to the Elementor setting screen.

While still in the Elementor edit screen, right-click with your mouse on the page title, and click Inspect.

Inspect page title

When inspecting the page title in our example, we can see that our title is an H1 tag with the class of page-header-title

Elementor widget libraries

<h1 class="page-header-title clr" itemprop="headline">

Inspect page title class

Let’s copy the class, for now, we will need to use it in a second.

Now, let’s navigate to the Elementor global settings by clicking on the Elementor hamburger menu on the left top corner.

Elementor global settings

Then, enter into the Site Settings option.

Elementor site settings

Inside the Site Settings screen, click on the Layout option.

Elementor site settings layout

Here we will need to paste our page title class inside the Page Title Selector field. Make sure to add the title tag plus a dot together with the class:

h1.page-header-title

Remove page title

After pasting the code, the page title will be removed. If the title is still showing, make sure the Hide Title option is on under the settings tab.

As you can see above, the page title was removed successfully, however, the container of the page title is still there.

If you would like to remove the container of the page title as well, click Inspect on the page title container, and look for its class.

Title container class

Then, enter the container class into the Page Title Selector as well next to the title class and separate them both with a comma.

h1.page-header-title, header.page-header

Page title and container were removed

After entering both classes, click update and revisit your page to make sure the page title and the title container were removed successfully.

Remove page title and container

Fortunately, entering the classes of the page title into the layout screen of Elementor is a process that we need to do only once. After entering the right classes once, enabling the hide title option on the next pages will work perfectly fine and will remove the title.

Conclusion

Hiding the title of a page is very simple with Elementor and can be done with a click of a button.

If the method in this article did not work for your specific theme, make sure to leave us a comment down below with the theme you’re using and we will provide you with the right class.

Also, make sure to subscribe to our YouTube channel and like our page on Facebook.

Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on email

PluginsForWP

PluginsForWP is a website specializing in redistributing WordPress plugins and themes with a variety of knowledge about WordPress, internet marketing, and blogging.

Leave a Reply