version 2.0 - divi-modules · from the elegant themes divi marketplace, these settings are not...

23
Simple Heading Version 2.1.0

Upload: others

Post on 25-Nov-2020

6 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

Simple HeadingVersion 2.1.0

Page 2: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

About 01Requirements 02Installation 03Software License 04

Divi-Modules – Simple Heading 05

Content Tab 06Content 07

Design Tab 08Heading 09Subheading 10Rule 11Sizing 12Spacing 13Border 14

Advanced Tab 15Custom CSS 16

Examples 17

Page 3: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

01 • Simple Heading

AboutThis document provides an overview of available settings for the Divi-Modules – Simple Heading module.

It discusses only those settings which are unique to this module and does not provide any information on settings which are common to most Divi modules.

For more information on common Divi module settings, please consult Elegant Themes online documentation.

Further more, this document provides only limited information on installing and activating the module. It assumes the reader is already familiar with these concepts and has some prior experience with both WordPress and the Divi Builder.

Page 4: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

02 • Simple Heading

RequirementsWordPress: Version 4.5 (or higher)PHP: Version 5.6 (or higher)MySQL: Version 5.0 (or higher)

Important: Requires the Divi Theme, Extra Theme, or Divi Builder Plugin to be installed and activated.

Divi-Modules plugins are created and tested using the latest Divi Theme and Builder versions. Backwards compatibility is not guaranteed, however, plugins should function normally with at least the following versions:

Divi Theme: Version 3.1 (or higher)Extra Theme: Version 2.1 (or higher)Divi Builder: Version 2.1 (or higher)

Page 5: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

03 • Simple Heading

InstallationAfter completing your Divi-Modules purchase, you will receive a confirmation email providing you with your Download Link and Software License Key. This information can also be found in your Divi-Modules Account Purchases and Downloads pages.

After downloading your Divi-Modules purchase, upload it to your website’s WordPress Dashboard and click Activate. More detailed instructions on Installing WordPress Plugins can be found online.

If your Divi-Modules product was purchased from the Elegant Themes Divi Marketplace, your product license is with Elegant Themes, not Divi-Modules. For all product licensing, updates and support, see your Divi Marketplace Customer Dashboard.

Page 6: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

04 • Simple Heading

Software LicenseIn order to receive periodic updates, you will need to activate your Software License. To do this, navigate to the Divi-Modules menu item in your WordPress Dashboard. Go to the My Modules submenu, enter your Software License Key, and click Activate.

To manage your Software License, please login to your Divi-Modules Account Purchases page.

If your Divi-Modules product was purchased from the Elegant Themes Divi Marketplace, your product license is with Elegant Themes, not Divi-Modules. For all product licensing, updates and support, see your Divi Marketplace Customer Dashboard.

Page 7: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

05 • Simple Heading

Divi-Modules – Simple HeadingDivi-Modules – Simple Heading adds a simple but versatile module to the Divi Builder. Use it to add headings and subheadings to your Divi layouts, with all the Divi styles, effects and filter settings you’re familiar with.

Simple Heading settings are organised into three tabs:

ContentDesignAdvanced

The following pages explain the settings found in these tabs which make this module unique.

Page 8: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

06 • Simple Heading

Content TabThe Content Tab includes the following sections:

ContentLinkBackgroundAdmin Label

Those shown in blue contain settings which are unique to this module. Those in grey contain settings which are common to most Divi modules and are not discussed here.

For information on common Divi module settings, please consult Elegant Themes online documentation.

Page 9: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

07 • Simple Heading

ContentHere you can enter content for the module and control its basic appearance.

HeadingHere you can enter text for the Heading.

SubheadingHere you can enter text for the Subheading.

Show Rule (See example)Here you can choose to show a Rule between the Heading and Subheading.

Swap Headings (See example)Here you can choose to position the Subheading above the Heading.

Page 10: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

08 • Simple Heading

Design TabThe Design Tab includes the following sections:

HeadingSubheadingRuleSizingSpacingBorderBox ShadowFiltersTransformAnimation

Those shown in blue contain settings which are unique to this module. Those in grey contain settings which are common to most Divi modules and are not discussed here.

For information on common Divi module settings, please consult Elegant Themes online documentation.

Page 11: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

09 • Simple Heading

HeadingHere you can control the appearance of the Heading. These settings are common to most Divi modules and are not discussed further here.

Page 12: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

10 • Simple Heading

SubheadingHere you can control the appearance of the Subheading. These settings are common to most Divi modules and are not discussed further here.

Page 13: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

11 • Simple Heading

RuleHere you can control the appearance of the Rule.

Rule Alignment (See example)Here you can control the Rule’s vertical alignment between the Heading and Subheading.

Rule Start (See example)Here you can control the Rule’s start position. Negative values will position the Rule outside the element’s bounds. Positive values will position the Rule inside the element’s bounds.

Rule End (See example)Here you can control the Rule’s end position. Negative values will position the Rule outside the element’s bounds. Positive values will position the Rule inside the element’s bounds.

Page 14: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

12 • Simple Heading

SizingHere you can control the module’s size.

Fullwidth (See example)Here you can set the element’s width. Turn this Off to have the element wrap to the width of its text. Turn this On to have the element extend the fullwidth of its parent element.

Page 15: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

13 • Simple Heading

SpacingHere you can control the module’s padding and margins.

Headings (See example)Here you can control the amount of space between the Heading, Rule and Subheading.

Page 16: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

14 • Simple Heading

BorderHere you can control the appearance of the border.

Border Offset (See example)Here you can control the position of the border relative to the module element. Negative values will position the border outside the module element. Positive values will position the border inside the module element.

Page 17: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

15 • Simple Heading

Advanced TabThe Advanced Tab includes the following sections:

CSS ID & ClassesCustom CSSVisibilityTransitionsPositionScroll Effects

Those shown in blue contain settings which are unique to this module. Those in grey contain settings which are common to most Divi modules and are not discussed here.

For information on common Divi module settings, please consult Elegant Themes online documentation.

Page 18: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

16 • Simple Heading

Custom CSSHere you can add custom CSS.

HeadingHere you can add Custom CSS for the Heading.

SubheadingHere you can add Custom CSS for the Subheading.

RuleHere you can add Custom CSS for the Rule.

BorderHere you can add Custom CSS for the border.

Page 19: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

17 • Simple Heading

ExamplesPlease note, the purpose of these examples is to illustrate the various settings of this module. The choice of fonts, colors, and other design elements in the examples is intentionally minimal so as not to distract from the effect of the settings themselves.

You are, of course, free to use any combination of fonts, colors, backgrounds, borders, filters and effects that the Divi Builder makes available.

Page 20: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

18 • Simple Heading

Show Rule: Off

Rule Start: -25px | Rule End: -25pxRule Start: 0 | Rule End: 0 Rule Start: +25px | Rule End: +25px

Show Rule: On Swap Headings: On

Content Tab > Content

Design Tab > Rule

Page 21: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

19 • Simple Heading

Rule Alignment: 50%

Fullwidth: On Fullwidth: Off

Rule Alignment: 20% Rule Alignment: 80%

Design Tab > Rule

Design Tab > Sizing

Page 22: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

20 • Simple Heading

Headings: 20px

Border Offset: -5pxBorder Offset: 0 Border Offset: +5px

Headings: 40px Headings: 60px

Design Tab > Spacing

Design Tab > Border

Page 23: Version 2.0 - Divi-Modules · from the Elegant Themes Divi Marketplace, these settings are not relevant to you. Instead, for product licensing, updates and support, see your Divi

Copyright © 2020 · Divi-ModulesDivi is a registered trademark of Elegant Themes, Inc.This product is not affiliated with or endorsed by Elegant Themes.