HyperBuilder
...
Blocks
Documentation Draft

Contact banner

6min

Overview

You can use this 'Contact banner block' to provide your visitors with ways to get in touch with your business.

Document image


Preview Contact Banner Block

You can add a title and some text content to this block, this is how it will look:

Contact Banner Live preview
Contact Banner Live preview


Text

To set up a banner message (as shown on the left), you need to choose the 'Text' block on the right of the builder page and type your message there:

Contact Banner - Text settings
Contact Banner - Text settings

  1. Subheader : This is the first text line in the first column (small fontsize)
  2. Header : This is the main title in the first column
  3. Text : This is the content in the first column
Contact Banner - Text settings second column
Contact Banner - Text settings second column


For adding your contact details, please choose the 'Second text' section and list your contact information there.

  1. Second Header : This is the header in the second column
  2. Second Text : This is the content in the second column

Buttons

Click the "buttons" tab to add or edit the button and text link settings.

Document image

  1. Button text : Text visible on the button
  2. Button url : Click the Globe icon to add an internal or external link
  3. Link title : This is the text link visible at the bottom of the first column
  4. Link url : Click the Globe icon to add an internal or external link

General

Set the second column background color and make the block sticky or not.

Contact Banner - General settings
Contact Banner - General settings

  1. Accent background color : click the rectangular box to pick a background color
  2. Enable sticky animation : When enabled this will keep the contact banner stick at the top of your screen.