How to create and use a Buy Button

This article is going to show you how to create a Buy Button, using CTA Now.

Important Note: CTA Now is designed to help you create sticky call-to-action buttons available on the MOBILE view.

What is Buy Button?

A buy button created with CTA Now is a button that allows customers to either add products to their carts or check out by clicking on the buttons. Buy buttons created with CTA Now are sticky on mobile screens.

How to create buy buttons?

Create a new CTA

From CTA Now Dashboard, click “Create a new CTA” button.

Select page type, page name and specific page(s)

To get started, you need to give the button a name and select where to display it.

Depending on the page type you selected, you might be required to select the specific page(s) where you want to display the button.

Upon selecting pages, you’ll be redirected to CTA Now Editor, where you can select the type of the button.

Add Button

In this case, select “Buy Button” to start.

Button Settings

In this Button Settings tab, you can change the settings of the button, which are:

Banner

Settings for banner include:

  • Enable Bar Banner: Put your Buy Buttons into a banner.

  • Enable Message: Add a text message to tell people what it means by clicking on the buttons.

  • Message Content: Edit the text message.

  • Enable Close Button: Add a close button so that your customers can close the buttons.

General

In General settings, you can change the settings for:

  • Choose Buttons: Choose either or both buttons to be displayed.

  • Button Order: Change the order of the two buttons.

  • Layout: Adjust the relative position between the two options. This is to give a certain button more space to indicate a higher visual weight.

Add to cart button

Settings for Add to cart button are available only when you selected “Add To Cart” in General settings.

Button Text & Icon: Edit the text and the icon that is shown on the button.

Button Action: There are two options for the action when customers click on the button:

  • Stay on current page: Add product to cart and stay on the same page.

  • Go to cart page: Add product to cart and redirect customers to the cart page.

Buy Now Button

Settings for Buy now button are available only when you selected “Buy Now” in General settings.

  • Button Text: Here, you can change the text that is shown on the button.

Note: For this button, you only have 1 option for the action when customers click on the button: Add product to cart and go to the checkout page immediately.

Button Styling

In the Button Styling tab, you can make changes to the look and feel of the buttons so that they match with the overall theme of your store.

Overall

Styling for both 2 buttons include:

  • Button Size: Click on Small/Medium/Large option to select the button size.

  • Font Family: Click the drop-down list and select the font family option.

  • Button Shape: Click the drop-down list and select the button shape.

  • Border Radius: Adjust the slider or enter a number to set the border-radius.

Add to cart button

Styling for add to cart button include:

  • Text Color: Enter the color code or click on the square icon to set the text color.

  • Background Color: Enter the color code or click on the square icon to set the background color.

Buy now button

Styling for add to cart button include:

  • Text Color: Enter the color code or click on the square icon to set the text color.

  • Background Color: Enter the color code or click on the square icon to set the background color.

Note: After clicking on Save & Publish button, please check your page on mobile devices to see your sticky call to action button.