Pro Buttons Block: Settings Overview

Updated on March 5, 2024 by Editorial Team

Table of Contents

Do you want to add attractive buttons to your WordPress website? With the Advanced Button block from The Plus Blocks for Gutenberg, you can add different stylish call to action buttons to your WordPress website.

Required Setup

How to Activate the Pro Buttons Block?

Go to 

  • The Plus Settings Plus blocks 
  • Search the block name and turn on the toggle then click Save.
Pro Button Active

Key Features

  • Two button types – You can choose from two button types, an animated call to action button and an animated download button.
  • Multiple animated button styles – You can choose from multiple pre-designed button styles.

How to Use the Pro Buttons Block?

Add the Pro Buttons block to the page. 

Content

From the Advanced Buttons tab, you have to choose the button type from the Button Type dropdown. Here you’ll find two options – 

CTA Button – To add an animated call to action button.

Download Button – To add an animated download button.

Let’s select the CTA Button here.

Then from the Style section under, you can choose from a range of button styles.

pro button content

In the Button Text field, you can add the button text. 

On some button styles, you’ll find some additional fields to add relevant content.

Then, in the Link field, you can add a link for the button. If you use the PRO version of The Plus Blocks for Gutenberg, you can dynamically add a link by clicking on the cylindrical icon.

Layout

From the Alignment section, you can align the button.

Pro Button Layout

Extra Options

You’ll see this tab for some button styles with relevant options.

pro button extra options

Note: The options will vary based on a selected button.

Accessibility

In the Aria Label field, you can add text to improve accessibility for users with disabilities.

pro button accessibility

How to Style the Pro Buttons Block?

To style the Pro Buttons block, you’ll find all the options under the Style tab.

Advanced Button – Here, you’ll find relevant styling options for a selected button. Options will vary based on a selected button.

pro button style

Note: For some button styles, you’ll find additional tabs with their relevant styling options.

Advanced – From here, you can customize the block further. 

  • Block name – 
  • HTML anchor – Here, you can add an anchor name to link directly to the block within the page.
  • Additional CSS class(es) – Here, you can add a custom CSS class to finetune the style by using your own custom CSS.

Advanced options remain common for all our blocks, you can explore all it options from here.

Related Docs
No Posts found