Headings
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam at ullamcorper mauris, vitae imperdiet tortor. Cras aliquet gravida lacus eu auctor
Heading - Center Aligned With Icon
With the heading shortcode you can easily create heading and assign styling to the heading sections. Using the WoodPecker® variables for heading you can create the kind of heading separator combination that you want.
This Is The Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce in mauris arcu. Quisque scelerisque, metus non volutpat commodo, erat ante molestie leo, eu pellentesque elit turpis nec leo. Nullam et porta mauris.
<section class = "col-lg-12 wdpk-heading text-center">
<h2 class = "wdpk-heading-head">This Is The Heading</h2>
<div class = "wdpk-heading-separator-wrapper justify-content-center">
<span class = "wdpk-heading-separator"></span>
<i class = "fab fa fa-apple"></i>
<span class = "wdpk-heading-separator"></span>
</div>
<p class = "wdpk-heading-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce
in mauris arcu. Quisque scelerisque, metus non volutpat
commodo, erat ante molestie leo, eu pellentesque elit turpis
nec leo. Nullam et porta mauris.
</p>
</section>
/* No Changes Made To Default Variables */
/* No Changes Made To Default Javascript */
Heading - Left Aligned
With the heading shortcode you can easily create heading and assign styling to the heading sections
This Is The Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce in mauris arcu. Quisque scelerisque, metus non volutpat commodo, erat ante molestie leo, eu pellentesque elit turpis nec leo. Nullam et porta mauris.
<section class = "col-lg-12 wdpk-heading text-left">
<h2 class = "wdpk-heading-head">This Is The Heading</h2>
<div class = "wdpk-heading-separator-wrapper justify-content-start">
<span class = "wdpk-heading-separator"></span>
</div>
<p class = "wdpk-heading-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce
in mauris arcu. Quisque scelerisque, metus non volutpat
commodo, erat ante molestie leo, eu pellentesque elit turpis
nec leo. Nullam et porta mauris.
</p>
</section>
/* No Changes Made To Default Variables */
/* No Changes Made To Default Javascript */
Heading - Right Aligned With Top Sperator
With the heading shortcode you can easily create heading and assign styling to the heading sections
This Is The Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce in mauris arcu. Quisque scelerisque, metus non volutpat commodo, erat ante molestie leo, eu pellentesque elit turpis nec leo. Nullam et porta mauris.
<section class = "col-lg-12 wdpk-heading text-right">
<div class = "wdpk-heading-separator-wrapper justify-content-end">
<span class = "wdpk-heading-separator"></span>
</div>
<h2 class = "wdpk-heading-head">This Is The Heading</h2>
<p class = "wdpk-heading-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce
in mauris arcu. Quisque scelerisque, metus non volutpat
commodo, erat ante molestie leo, eu pellentesque elit turpis
nec leo. Nullam et porta mauris.
</p>
</section>
/* No Changes Made To Default Variables */
/* No Changes Made To Default Javascript */
Heading - Separator Below Content
With the heading shortcode you can easily create heading and assign styling to the heading sections
This Is The Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce in mauris arcu. Quisque scelerisque, metus non volutpat commodo, erat ante molestie leo, eu pellentesque elit turpis nec leo. Nullam et porta mauris.
<section class = "col-lg-12 wdpk-heading text-center">
<h2 class = "wdpk-heading-head">This Is The Heading</h2>
<p class = "wdpk-heading-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce
in mauris arcu. Quisque scelerisque, metus non volutpat
commodo, erat ante molestie leo, eu pellentesque elit turpis
nec leo. Nullam et porta mauris.
</p>
<div class = "wdpk-heading-separator-wrapper justify-content-center">
<span class = "wdpk-heading-separator"></span>
</div>
</section>
/* No Changes Made To Default Variables */
/* No Changes Made To Default Javascript */
