CTA Band

Set up the content

1. Content → Text: Heading, text and an optional Footnote such as «No credit card required».
2. Content → Buttons, Content → Image or video or Content → Form – depending on the layout.
3. Content → Contact details: Optional rows with icon, label and value. Choose E-mail address or Phone number as the link type so visitors can click to mail or call.

Swap left and right

For the side-by-side layouts, switch on Swap sides (left ↔ right). Mobile order decides what comes first on small screens, and Column ratio gives the text or the media/form more room. With Text and form, switch on Styles → Layout → Show buttons with the form to keep the buttons under the text.

Show a HubSpot meeting instead of a form

The Text and form and Form only layouts can show a booking calendar in place of the form.

1. Open Content → Form or meeting and choose HubSpot meeting (booking calendar).
2. Pick one of your scheduling pages under Meeting link, or paste the address of any HubSpot scheduling page under Or paste a meeting link (the pasted address wins).
3. Set the width under Styles → Layout → Form max width. Up to about 500 px the calendar is one column and the times show after a day is picked. From about 800 px the times sit beside the calendar.

The calendar is HubSpot's own scheduling page in a frame, so its colors, avatar and questions are set on the scheduling page in HubSpot, not in the theme. The booking script loads only when the calendar comes near the screen, so it costs nothing on the first paint. Without a meeting link the calendar area shows in the editor only.

Good to know

• The band is dark by default (gradient with light text). For a light band choose Color, pick a light color and switch off Light text on dark background.
• The form placeholder «Select a form…» is only visible in the editor.
• Background, module width, spacing and alignment work the same in every module – see Backgrounds and Module width and inset panels.
• An SVG can be any size: Set Styles → Media → SVG size in percent. 100 % fills the media area, 50 % is half as wide, and above 100 % the sides are cropped.