Skip to main content
All CollectionsDivi 5Modules
The Divi Fullwidth Post Title
The Divi Fullwidth Post Title

Learn how to use the Divi Fullwidth Post Title Module to display dynamic post titles with customizable styles and layouts.

Updated yesterday

The Divi Fullwidth Post Title Module lets you customize the appearance of Post Titles, meta-text, and featured images in blog posts, pages, projects, or other custom post types. It's ideal for creating custom templates with the Divi Theme Builder.

Divi 5 - Fullwidth Post Title module

Add The Divi Fullwidth Fullwidth Post Title Module

When you load the Visual Builder, Divi automatically adds a Section.

  1. Click on the Blue Plus icon to insert a Fullwidth section.

  2. Click on the Fullwidth button.

  3. Find the Fullwidth Fullwidth Post Title module and click on it to load the module.
    The module library is also searchable. To access it, type the module name you want in the search bar at the top.

{Gif here}

The Divi Fullwidth Post Title Module Use Cases

  1. Customizing Blog Post Headers: Automatically display the title of each blog post in a styled header, maintaining consistency while allowing for design customization.

  2. Creating Dynamic Page Templates: Use the module in custom posts or page templates to ensure the correct titles load dynamically for each piece of content.

  3. Enhancing SEO-Friendly Titles: Combine the module with keyword-rich headings and metadata to boost search engine optimization while maintaining a user-friendly layout.

Fullwidth Post Title Module Settings Breakdown

Once you've added the Fullwidth Post Title module, the module settings automatically pop up. This is where this module's content and design styles are configured. These settings are organized into three groups via the tabs at the top of the module:

The Content tab

The Content tab allows you to select the module's elements, such as the title, meta, author, publish date, comments count, featured image, and more, to display or hide.

Divi 5 - Fullwidth Post Title module's Content tab
  1. Elements - Choose which elements the module will display.

  2. Link - Make the entire Fullwidth Post Title module clickable, creating a seamless way to direct users to another page, section, or external site.

  3. Background - Choose the Fullwidth Post Title module's background styles.

  4. Admin Label - Choose the Fullwidth Post Title module's label text to assist you in keeping things organized and easy to understand in the Visual Builder.


The Design tab

All the design styles and options for the Fullwidth Post Title module are in this tab.

Divi 5 - Fullwidth Post Title module's Design tab
  1. Text - Choose the overall Fullwidth Post Title module's text styles for this module.

  2. Title Text - Choose the Fullwidth Post Title module's title styles.

  3. Meta Text - Choose the module's meta text styles.

  4. Sizing - Choose the Fullwidth Post Title module's sizing.

  5. Spacing - Choose the Fullwidth Post Title module's spacing.

  6. Border - Choose the Fullwidth Post Title module's border styles.

  7. Box Shadow - Choose the Fullwidth Post Title module's Box Shadow styles.

  8. Filters - Choose the Fullwidth Post Title module's filters such as hue shifts, saturation changes, and blending modes.

  9. Transform - Choose the Fullwidth Post Title module's advanced design effects, such as scaling, rotating, skewing, and translating.

  10. Animation - Choose the Fullwidth Post Title module's animation styles.


The Advanced tab

The Advanced tab provides tools for experienced designers, including options for adding CSS IDs and Classes, controlling visibility, managing transitions, adjusting element positions, and creating scroll effects.

Divi 5 - Fullwidth Post Title module's Advanced tab
  1. CSS ID & Classes - Allows you to assign unique CSS ID or reusable CSS classes, enabling advanced custom styling through your child theme’s stylesheet or Divi’s custom CSS settings.

  2. Custom CSS - Allows you to add custom CSS code to fine-tune your Fullwidth Post Title module, enabling advanced styling that perfectly aligns with your vision.

  3. Conditions - Allows you to create dynamic, personalized content, ensuring the right message reaches the right audience at the right time.

  4. Visibility - Choose the Fullwidth Post Title's module visibility based on different devices.

  5. Transitions - Choose how long Fullwidth Post Title's module animation takes, adding subtle, impactful animations that enhance user experience and make your modules stand out.

  6. Position - Choose precise control of the Fullwidth Post Title's module placement and create dynamic, visually engaging designs.

  7. Scroll Effects - Control how the Fullwidth Post Title module behaves and transforms during scrolling.


What's the next step?

Save your changes and exit the Visual Builder

To save the page design, you can type CMD + S on a Mac or CTRL + S on a PC.

You can also:

  1. Click on the Save button.

  2. Click on the Exit button.

Divi 5 - Save and Exit Visual Builder

Did this answer your question?