The Buy Now Button Block allows you to display a membership purchase button anywhere on your page or post. When users click the button, they will be redirected to the checkout page for the selected membership plan.

This block works like any other Gutenberg block and gives you full control over appearance, behavior, and layout.

When to Use This Block #

Use the Buy Now Button Block when you want to:

• Add a membership purchase button anywhere on your site
• Create custom sales pages for different membership tiers
• Offer quick purchase options inside landing pages or pricing sections
• Encourage upgrades or highlight special membership offers

How to Add the Buy Now Button Block #

1. Go to the Page or Post Editor in WordPress.
2. Click the “+” button in the top-left corner.
3. Search for “Membership Buy Now” in the block list.
4. Click to insert the block into your content.
5. Configure the button using the block settings in the right sidebar.

Once added, the button will redirect users to the checkout page of the selected membership plan.

Buy Now Button Block Settings #

The settings panel includes customization options for both functionality and appearance.

General Tab #

1. Membership Plan #

Select the membership plan that the button will redirect to.
All available membership plans are listed in the dropdown.

When a user clicks the button, they are taken directly to the checkout page for the chosen plan.

2. Open in New Tab #

Toggle this option ON to open the checkout page in a new browser tab.
Useful for marketing pages where you want to keep visitors on the main content.

3. Button Text #

Customize the label shown on the button.
Examples:

• “Buy Now”
• “Get Access”
• “Upgrade to Silver”
• “Join Membership”

4. Width #

Choose the width of the button:

• 25%
• 50%
• 75%
• 100% (full-width)

This helps with layout alignment and responsive design.

5. Justification #

Control the horizontal alignment of the button within its container:

• Left
• Center
• Right

Style Tab #

Customize the visual design of your Buy Now button.

1. Styles #

Choose between:

• Fill – Solid background button
• Outline – Bordered button with transparent background

2. Color #

Customize the color settings:

• Text Color
• Background Color
• Text Hover Color
• Background Hover Color

These controls allow you to match your brand design or highlight key actions.

3. Typography #

Adjust the button’s text size:

• S
• M
• L
• XL

4. Border #

Configure the button border styling:

• Border color
• Border thickness (px)

5. Border Radius #

Adjust the roundness of button corners.
Set 0px for sharp corners or higher values for a pill-shaped button.