How to hide (or move) the post or page title in Divi

Introduction

Overview

In this article you’ll learn how to create an element in the Divi theme which will be auto-populated with the actual page or post title. You’ll then be able to place this element wherever you want without making duplicate titles or affecting the Category view on your site.

Here’s what you’ll need to accomplish this:

• The Divi theme by ElegantThemes
• Title Remover WordPress plugin

The Problem

You have probably wanted to be able to place your title somewhere else other than the top of a page or post inside of Divi. But when you do it your title appears twice on the page, and annoyingly, also on your category archives page.

Category view:

If you don’t want your title to be duplicated in posts and in category view, here’s a simple solution.

Solution

How to hide the title on Divi pages and posts

There are few ways to do this.

• With Divi Theme

• Using a Plugin (recommended and simplest way)

• Custom CSS

With Divi Theme

Unfortunately with Divi you can hide title only on posts.

On the right sidebar change Post Title to “Hide”

Using a Plugin

1. Install and Activate “Title Remover” plugin.
2. Go to your page/post and on the right sidebar click the box to enable “Hide the title for this item” option.
3. Click update.

Custom CSS

With Custom CSS you can hide titles for all posts and pages. If you want to hide the title only for a specific page/post it is best to use the plugin solution above.

Use this method ONLY if you are sure you want to hide all titles across the entire website!

1. From your WordPress Dashboard go to Appearance => Customize => Additional CSS.
2. Add this code:
   

   .entry-title{display: none;}

3. Click Publish.

How to remove duplicated title in Category/Blog view

You can skip this if you used Custom CSS method above.

1. Add this code to your theme’s functions.php file:
   

   function dynamic_title(){
if(is_single() || is_page()){
echo "
<script type='text/javascript'>
var titles = document.getElementsByClassName('dynamic-title');
var pageTitle = document.title;
var siteName = '".get_bloginfo('name')."';
for (i = 0; i < titles.length; ++i) {
titles[i].innerHTML = pageTitle.slice(0, -siteName.length-2);
}
</script>
";
}
}
add_action('wp_footer', 'dynamic_title');

2. Use this element where you want to display your title:
   

   <h1 class="dynamic-title"></h1>

   Example:
   

Result

Title Appearance in a Post:

Post in category view: