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 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:
category view - How to hide (or move) the post or page title in Divi

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”

divi hide 1024x270 - How to hide (or move) the post or page title in Divi

Using a Plugin

  1. Install and Activate “Title Remover” plugin.plugin hide 1024x297 - How to hide (or move) the post or page title in Divi
  2. Go to your page/post and on the right sidebar click the box to enable “Hide the title for this item” option.hide page title 1024x397 - How to hide (or move) the post or page title in Divi
  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.CSS - How to hide (or move) the post or page title in Divi

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:
    example2 1024x423 - How to hide (or move) the post or page title in Divi

Result

Title Appearance in a Post:

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

Post in category view:

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