Header Promo

Fields

The following fields are used in the Header Promo content module:

Fields marked * are compulsory.

Field	Action	Option / Content
Status *	Select	Published / Unpublished
Title *	Enter	Required module title
Content	Enter	Optional content
Leader Text	Enter	Optional text to be shown above the title
Media *	Select	None / Image / Video
Media Side *	Select	Right / Left ¹
Image *	Select/Upload	Required image ²
Video URL *	Enter	Required external URL ³
Call To Action *	Select	None / Internal / External
Button Text *	Enter	Required button text ⁴
Button Internal Link *	Select	Required internal link ⁵
Button External Link *	Enter	Required external URL ⁶
Background Image	Select/Upload	Optional background image
Theme *	Select	White / Light / Dark

¹Only when Media is Image or Video
² Only when Media is Image
³ Only when Media is Video⁴Only when Call To Action is Internal or External⁵ Only when Call To Action is Internal
⁶ Only when Call To Action is External

[top]

About

The Header Promo module provides the means to construct an eye-catching header section with a number of possible permeations, including content, an image or video, call to action buttons, and a background image.

[top]

Header Promo Admin

The Header Promo Content Module appears as follows when added:

Header Promo Content Module

[top]

Adding a Header Promo Content Module

Open the Page / Post on which you wish the Content Module to appear
Click the Add Module button
Select Header Promo
Select the required Status
Enter Title
Enter Content (optional)
Enter Leader Text (text to be shown above the title) (optional)
Select Media
Where the selected Media is None, no further action is required
Where the selected Media is Image
- Select Media Side

Media Side

This determines the position of your Image vis-à-vis any textual content

- Click the Add Image button to select an Image

This displays the Select Image window

Select Image Window

- Click on an image from the Media Library tab

- Click the Upload Files tab
- Click the Select Files button

Select Files

This displays the Open window

Open Window

- Locate and select the required image
- Click the Open button

A tick and blue border appears around the selected image

Selected Image

- Click the Select button

The selected image is added to your module

Selected Image Added

Where the selected Media is Video
- Select Media Side

Media Side

This determines the position of your Image vis-à-vis any textual content

- Enter Video URL

Video URL

Select Call To Action
Where Call To Action is None, no further action is required

Call To Action

Where Call To Action is Internal link
- Enter Button Text

Button Text

- Select a Button Internal Link

Scroll through the links until you find the required link

Note that you can also enter the first few characters of the link to narrow down the selectable options

- Click to select the required link

Select Required Link

Where Call To Action is External link
- Enter Button Text

Button Text

- Enter a Button External Link (full http(s)://www.mysite.com link required)

Button External Link

Click the Add Image button to select a Background Image (optional)

This displays the Select Image window

Select Image

Click on an image from the Media Library tab

Click the Upload Files tab
Click the Select Files button

Select Files

This displays the Open window

Open Window

Locate and select the required image
Click the Open button

A tick and blue border appears around the selected image

Selected Image

Click the Select button

The selected image is added to your module

Selected Image Added

Select Theme
Click Save Draft / Publish / Update to save

[top]

Header Promo Variations

With an optional Background Image, and optional use of Media and Call To Action buttons, the Header Promo module is capable of displaying in a large number of ways.

Using a Title, Content, Leader Text, No Media, an Internal link for the Call To Action and a Background Image; White Theme:

Header Promo Example

Using a Title, Content, Leader Text, No Media, an Internal link for the Call To Action and no Background Image; White Theme:

Header Promo Example

Using a Title, Content, Leader Text, an Image placed on the Right for Media, an Internal link for the Call To Action and no Background Image; Dark Theme:

Header Promo Example

Using a Title, Content, Leader Text, a Video placed on the Left for Media, an Internal link for the Call To Action and no Background Image; Light Theme:

Header Promo Example

Using a Title, Content, Leader Text, a Video placed on the Left for Media, an Internal link for the Call To Action and a Background Image; Dark Theme:

Header Promo Example