BLACK FRIDAY: 50% OFF all Pro plans
Pro from $18 a year or $60 lifetime, no code needed
Ends Cyber Monday, 30 Nov. Lock in the price today
Get 50% Off
Guide

Call to Action Free

How to set up and style the Call to Action widget in Elementor.

Call to Action shows a small heading, a title, a description and a button inside a box with its own background. Use it at the end of a page or between sections to point visitors to one next step.

Part of: Bright Addons (free).

Set it up

  1. Drag the Call to Action widget onto the page.

  2. In Content, choose a Layout: Stacked or Text left, button right.

  3. Type the Small Heading, Title and Description. Clear any field you do not need.

  4. Set the Button Text and Link, and pick a Button Icon if you want one.

  5. To add a second option, fill in Second Link Text and then Second Link.

  6. Set the Alignment.

  7. Open the Style tab to set the box background, Overlay Color, text and button styling.

Content options

Content

Option What it does
Layout Stacked puts the button under the text. Text left, button right puts them side by side.
Small Heading A short line shown above the title.
Title The main headline.
Title Tag The HTML tag used for the title. The default is H2.
Description The text under the title.
Button Text The button label. Leave it empty to hide the button.
Link Where the button goes. It supports dynamic tags.
Button Icon An optional icon shown after the button text.
Second Link Text Optional text link next to the button.
Second Link Where the second link goes. Shown once Second Link Text is filled in.
Alignment Aligns the text and the button left, center or right, per device.
Bright Addons Pro

Like this free widget? Get 80 more with Pro

Pro adds 80 widgets, 10 extensions, a Theme Builder and 32 dynamic tags, and keeps every free widget. From $18 a year, with a 14-day money-back guarantee.

Style options

These sections are in the Style tab.

  • Box

    background (color, image or gradient), overlay color, min height, content max width, padding, border, border radius and box shadow.

  • Text

    color, typography and spacing for the small heading and title, color and typography for the description, and the color of the second link.

  • Button

    typography, normal and hover colors for text, background and border, border width, border radius and padding.

Tips

  • On screens narrower than 768 pixels the inline layout stacks, with the button under the text.

  • The overlay sits between the background and the content, so pick an Overlay Color with some transparency when you use a background image.

  • The Title accepts simple inline tags such as line breaks, bold and italic. Other tags are removed.

  • If both Button Text and Second Link Text are empty, the button area is not printed at all.

Questions and answers

Can I use a background image?

Yes. The Box section in the Style tab has a background control for a color, an image or a gradient, plus an Overlay Color.

Can I add two buttons?

The widget has one button and one optional text link. Fill in Second Link Text to show the link beside the button.

How do I put the button beside the text?

Set Layout to Text left, button right. On phones the button drops below the text.

Can I hide the small heading?

Yes. Clear the Small Heading field and it is not shown. The same goes for the title and description.

Need more help?

Check the troubleshooting guide, or contact support with the page address and what you expected to happen.

Troubleshooting guide
All guides