Documentation

Categories
< All Articles
Print

Fancy Headings

Avatar Fancy Headings

Adding the Module

Once Avatar Divi is activated, it adds several modules to the Divi builder. To add a module on the page, use the following steps:

  1. Create/Edit a Page/Post that uses Divi builder.
  2. Create/Edit a row.
  3. Click on Add New Module option; choose the Avatar Fancy Headings module.

Content Options

Fancy Headings Text

In this section you would be able to set your Before, Middle and After text. These are the available options:

  1. Before Text: The first text that will be displayed in your heading.
  2. Use Before Icon If ENABLED: Here you can choose whether an icon should be used instead of text.
  3. Before Icon Size: Select the size for the Before Icon Depends on Use Before Icon set to ENABLED
  4. Middle Text: The first text that will be displayed in your heading.
  5. Use Middle Icon If ENABLED: Here you can choose whether an icon should be used instead of text.
  6. Middle Icon Size: Select the size for the Middle Icon Depends on Use Middle Icon set to ENABLED
  7. After Text: The first text that will be displayed in your heading.
  8. Use After Icon If ENABLED: Here you can choose whether an icon should be used instead of text.
  9. After Icon Size: Select the size for the After Icon Depends on Use After Icon set to ENABLED

The default Divi Builder Module Content Tab Link, Background and Admin Label are also available for this module.

Design Options

Heading HTML Tag
  1. Heading HTML Tag: Select the HTML tag for your text container.
    • H1
    • H2
    • H3
    • H4
    • H5
    • H6
    • div
    • span
    • p
Main Text

The font settings on this option will affect the entire heading. Use the individual font settings for each part of the heading below to customize them individually.

  1. Divi Builder Default: Default Text and Font style options provided by the Visual Builder.
Before Text • Middle Text • After Text

Each of the settings below applies to each option respectively and it will only affect that specific section.

If Use Icon is ENABLED: To change the color of the Icon as well as the margin, padding and other properties, please use the Text options under the Design Tab.

  1. Divi Builder Default: Default Text and Font style options provided by the Visual Builder.
  2. Text Display Mode: Here you can choose the element’s display type. Inline-block displays an element as an inline-level block container. Block will display the element as a block in its own line.
    • Inline Block
    • Block
  3. Text Position: Here you can choose the element’s position type. Absolutely positioned elements will float inside their parent elements. Relatively positioned elements sit statically in their parent container but can still be offset without disrupting surrounding elements.
    • Relative
    • Absolute
  4. Text Vertical Offset: Here you can adjust the element’s position upwards or downwards from its starting position, which may differ based on its offset origin.
  5. Text Horizontal Offset: Here you can adjust the element’s position left or right from its starting position, which may differ based on its offset origin.
  6. Text Z Index: Here you can control the element position on the z axis. Elements with higher z-index values will sit atop elements with lower z-index values.
  7. Text Margin: Adjust margin to specific values, or leave blank to use the default margin.
  8. Text Padding: Padding adds extra space to the inside of the element, increasing the distance between the edge of the element and its inner contents.
  9. Text Stroke: Here you can adjust the stroke or your text.
  10. Text Stroke Color: Adjust the color of the Text Stroke.
  11. Use Background as Mask: Enable or disable to use the Text as a mask for Text Background.
  12. Text Background: Adjust the background style by customizing the background color, gradient, and image.
  13. Text Use Filter Shadow: Enable or disable the use of filter drop-shadow allowing you to simulate a text-shadow when using your text as a mask.

    1. Text Filter Shadow Color: Set the color for the drop shadow filter.
    2. Text Filter Shadow Horizontal Length: Shadow’s horizontal distance from the text. A negative value places the shadow to the left of the text.
    3. Text Filter Shadow Vertical Length: Shadow’s horizontal vertical distance from the text. A negative value places the shadow above the text.
    4. Text Filter Shadow Blur Strength: Controls the visibility of the Filter Shadow. The higher the value, the bigger the blur, the shadow becomes wider and lighter.
  14. Divi Builder Default: Default Text and Font style options as well as Round Corners, Border Styles, Border Width, Border Color, and Box Shadow provided by the Visual Builder.
p
Note

Default settings, sub-settings, and options used in all Divi Builder Modules are not described or included in our documentation and they are referred as Divi Builder Default throughout our guides to indicate that the options included are those provided by default by/or in the Visual Builder. If you need help learning to work with Divi Visual Builder, please visit Elegant Themes Documentation.

If you still stuck
Table of Contents