In this guide, you’ll learn to use Gutenberg Dual Heading Block in WordPress sites to create titles with distinct styles for each section. We’ll show you how to adjust the design elements for the main and secondary parts of your heading. By the time you’re done, you’ll be able to make visually interesting headings and set the tone for your content.
Go to the editor’s menu, select a Premium Dual Heading Block, type in your heading, and then adjust its appearance and placement on your page.
General Settings
After choosing the dual heading, you can modify its settings using the available options.
HTML Tag: Choose the HTML tag that best fits the hierarchical structure of your page, from H1 for main titles to H6 for subheadings.
Display: Set how the heading is displayed on the page, with options like block or inline.
Swap Headings: Toggle to swap the headings.
Link: Add a hyperlink to your heading.
Open link in new tab: Decide whether the link opens within the same tab or a new one.
Alignment: Align your heading to the left, center, or right on the page.
Rotate (degrees): Change the rotation angle of your dual heading.
Minimal Mask Effect: Apply a mask effect to your headings.
Mask Color: Add a mask color for the headings.
Direction: Set a mask direction to the right, left, top, or bottom.
Words Padding: Set a word padding when a mask effect is on.
Gutenberg Dual Heading Block – General Settings
Gutenberg Dual Heading Block Styling Controls
First/Second Heading Style
Typography: Adjust font properties like size, weight, and style.
Text Color Type: Select text color type for the heading with options to have a solid color, noise effect, or animated colors.
Text Color: Set the text color for the heading when the text color type is solid color.
Noise Color #1: Set the first noise color for the heading when the text color type is noise effect.
Noise Color #2: Set the second noise color for the heading when the text color type is noise effect.
Background: Select a background style for the heading with options to have a solid color, gradient, or image.
Clipped: Apply a clipping to your heading for creative text effects.
Animated: Add animation to your heading for dynamic content.
Stroke: Outline your heading with a stroke for emphasis or style.
Stroke Text Color: Select stroke text color.
Stroke Fill Color: Add color to fill the stroke of the heading.
Text Shadow: Cast a shadow behind your heading to make it stand out.
Gutenberg Dual Heading Block – Heading Style
Border: Define a border around your heading.
Border Radius: Round the corners of your heading’s border.
Margin: Control the space outside the border of your heading.
Padding: Adjust the space inside the border of your heading.
Gutenberg Dual Heading Block – Heading Style
Container Style
Background Type: Choose from different background options for the container, such as color, gradient, or image.
Border: Add a line around the edge of the container, with options to customize the style, width, and color.
Border Radius: Adjust how rounded the corners of the border are, with individual controls for each corner (top, right, bottom, left).
Margin: Control the space between the container and other elements on the page.
Padding: Set the space between the border and the content inside the container.
Gutenberg Dual Heading Block – Container Style
Conclusion
In conclusion, Gutenberg Dual Heading Block offers an extensive range of customization options that empower WordPress users to elevate their content with visually captivating headings. By integrating distinct styles for each part of the heading, adjusting typography, applying animations, and utilizing various background types, users can significantly enhance the aesthetic appeal and readability of their websites. This tutorial provides a comprehensive guide to harnessing the full potential of the Dual Heading Block, ensuring that even beginners can create professional-looking titles that capture their audience’s attention. As we wrap up, it’s clear that mastering this tool can set a strong visual tone for your content, making it stand out in the digital landscape.
Need Further Help?
Have a question or need assistance? Premium Blocks dedicated support team is here to help! Explore our contact options to ensure you get the support you need. We’re committed to making your Gutenberg website-building experience seamless and resolving any queries you may have.
