How to Edit the Title Area Template? / Title Area Specific Elements
Title area builder is based on a page builder of your choice so generally you can add any content elements and make any layout configurations as you normally do by editing pages. This gives you an outstanding flexibility and unlimited possibilities in designing your title area.
Here we will describe some specific aspects of using title area specific elements and dynamic settings in elements.
In This Article
Post Title
This element displays page/post title.
You can adjust alignment and use different text style presets and adjust typography.
Post Excerpt
This element shows page/post excerpt. Post excerpt can be specified in the following meta field while editing a post:
Alternatively you can specify the page/post excerpt in Page Options >Title Area section - this excerpt will override the excerpt specified in the WordPress Excerpt meta field (see above):
You can adjust alignment and use different text style presets and adjust typography.
Featured Image
With this element you can add featured image of the page/post.
You can specify the size of the image, its alignment, choose between 12 image styles.
Featured Content
Depending on the post format settings, which you can specify in Page Options -> Post Format, featured media can be:
- Featured Image
- Video
- Audio
- Post Gallery
Post Breadcrumbs
Adds page/post breadcrumbs to the title area template.
Post Meta
With this element you can add following post meta elements in title area template:
- Categories
- Author
- Date
- Time
- Likes
- Comments
This elements can be added/disabled using the repeater in the front-end editor:
WPBakery
Elementor
Depending on the type of the selected element, additional options of this element will be displayed in repeater.
You can choose between two design skins / styles of the post info elements: classic and modern.You can also specify how to display the elements: horizontally in one line or vertically. In “Style” tab you can make additional styling adjustments for different post info elements.
Post Tags
This elements adds post tags to the title area template.
Post Navigation
Adds the “prev”, “next” post navigation to the title area template. You can specify alignment, labels, post titles, arrows etc.
Dynamic Tags: Title & Excerpt
A page/post title and a page/post excerpt can be also displayed using heading and text content elements with dynamic content to get title and excerpt from the corresponding post/page. To do this, click on “Dynamic Tags” icon to get the list of available dynamic tags
For headings and excerpts/ subtitles you can choose between:
- Page/Post Title: draws content from the current page title
- Page/Post Rich Content Title: draws content from the current page rich content title. It can be found in page options in “Page Title” section
- Page/Post Excerpt: draws content from the current page excerpt
Dynamic Background Image
Featured Image
In case you wish to use page/post featured image as a background image for the section, you need to use dynamic content as follows:
Elementor:
WPBakery:
In this way the background image for the section will be dynamically fetched from the post/page featured image.
Background Image (set in Page Options)
Instead of showing the post/page featured image as your title area background, you can use a background image set in Page Options > Title Area:
IMPORTANT: “Dynamic Settings” checkbox should be activated in Page Options. After activating this setting you will see two additional sections with styling settings and options to select the background image for this page.
It works in the same way as with the featured image, but with different dynamic tag selected:
Elementor:
WPBakery:
In WPBakery Page Builder you need to add the "Background Container" element (this serves as a main title area container) with the activated setting "Image" in "Background Type" fields:
Dynamic Background Video
If you wish to use post/page dynamic video background for your title area, you can specify this in Page Options > Title Area settings of the respective post/page:
IMPORTANT: “Dynamic Settings” checkbox should be activated! After activating this setting you will see two additional sections with styling settings and options to select the background video for this page.
and then use the dynamic content options of the page builder as follows:
Elementor:
To add video content dynamically from the page/post, select video as background type of your page title section and click on “Dynamic Tags” icon in “Video Link” setting
In the list of available dynamic tags select Background Video (set in Page Options).
To add background fallback in case selected video can’t be played on some devices, use “Background Fallback” setting, click on “Dynamic Tags” and select Background Video Poster (set in Page Options). This option gets video poster dynamically from the current page title background video poster specified in Page Title section of Page Options:
WPBakery:
In WPBakery Page Builder you need to add the "Background Container" element (this serves as a main title area container) with the activated setting "Video" in "Background Type" fields:
