Skip to content

How to Add Buttons in WordPress?

Updated On : August 18, 2026By : Reading Time : 2 minutes

Key Takeaways

  • Nexter Blocks Button block adds a button to a WordPress website and supports an icon or image in the button.
  • Nexter Blocks requires the default WordPress Block editor, the Nexter Blocks plugin installed and activated, and the Button block turned on under Nexter → Blocks.
  • PRO version of the Nexter Blocks adds dynamic content in the Title field and Link field by clicking the cylindrical icon at the end of each field.
Table of Contents

Button is an important element to increase user engagement on a website. The buttons can be used as a call to action button, and you can send users wherever you want.

With the Button block from the Nexter Blocks, you can easily add buttons to your WordPress website.

LIVE BLOCK LINK

Required Setup

  • Make sure the default WordPress Block editor is active. 
  • You need to have the Nexter Blocks plugin installed and activated.
  • Make sure the Button block is activated. To verify this, visit Nexter → Blocks → and search for Button and activate. 

Learn via Video Tutorial

Youtube video

How to Activate the Button Block?

Go to 

  • Nexter → Blocks 
  • Search the block name and turn on the toggle.

Key Features

  • Add icon/image – You can easily add an icon or image to the button.

How to Use the Button Block?

Add the Button block to the page, then in the Title section under the Content tab, you can add the button text. 

But if you are using the PRO version of the Nexter Blocks, you can add dynamic content by clicking on the cylindrical icon at the end of the field.

From the Link field, you can add a custom link to the heading. Similar to the title section, you can add a link dynamically by clicking on the cylindrical icon.

You can align the button for different devices from the Alignment section.

Then, from the Icon Type field, you can add an icon or image to the button. 

When enabled, from Icon / Image, you can add an icon or image.

Depending on the selection, you’ll get different options to add the image or icon.

Suggested Read: How to Add Read More Button in Blog Posts in WordPress

How to Style the Button Block?

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

Button – From here, you can manage the button typography, text color, background color, border, padding, image or icon size and more.

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

  • 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.

View Advanced tab tutorial.

Suggested Read: How to add Login Button in WordPress Header Menu

About the Author

Photo of Aditya Sharma CMO of Nexter
CMO at POSIMYTH Innovations · Nexter · 7 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressThemesElementorn8nAIClaudeAutomationServer
X GitHub YouTube Website

Share your Thoughts

Still in Doubt? Let’s Assist You

Raise a ticket Now

Have Feedback or Questions?

Join our WordPress Community on Facebook!

Join Us

Related Frequently Asked Questions

What do I need before adding a button in WordPress with Nexter Blocks?

The setup is simple, but the order matters. The default WordPress Block editor has to be active, and the Nexter Blocks plugin needs to be installed and activated first. The Button block also has to be turned on under Nexter → Blocks. If any of those pieces are missing, the block will not be available in the editor, so it is worth checking activation before you start building the page.

Why is the Button block not showing up in the WordPress editor?

The usual cause is that the block has not been activated yet. Nexter Blocks keeps blocks switchable, so you need to go to Nexter → Blocks, search for Button, and turn on the toggle. The other common blocker is using something other than the default WordPress Block editor, since this tutorial depends on that editor being active.

Can I add an icon or image to a button in WordPress?

The Button block supports both an icon and an image, which makes it useful when plain text is not enough for a call to action. Under Icon Type, you choose whether the button uses an icon or image, then the matching options appear under Icon / Image. That matters because visual cues can make a button easier to scan, especially when you want users to notice it quickly.

Can I use dynamic content in a WordPress button with Nexter Blocks?

Dynamic content is available in the PRO version of Nexter Blocks. The tutorial says you can use the cylindrical icon at the end of the Title field and Link field to add dynamic content there. That is useful when button text or URLs need to change based on content instead of being typed manually every time.

How do I align a button differently on desktop and mobile in WordPress?

The Alignment section lets you control button alignment for different devices, which is important when a layout looks good on desktop but feels off on smaller screens. Device-specific alignment helps keep calls to action readable and visually balanced without forcing one layout everywhere. That makes the Button block more practical for responsive pages where spacing changes across breakpoints.

What can I customize in the Button block style settings?

The Style tab handles most of the visual work for the Button block. Under Button, you can adjust typography, text color, background color, border, padding, and image or icon size. The Advanced area adds HTML anchor and Additional CSS class(es), which is useful when you want direct linking inside a page or need custom CSS for finer control. For deeper styling context, see View Advanced tab tutorial.

Last reviewed: August 18, 2026

Related Docs

How to Add a Before and After Opacity Slider in WordPress?
icon
How to Add a Blend Cursor in WordPress?
icon
How to Add a Blockquote in WordPress?
icon
How to Add a Button in a WordPress Message Box?
icon
How to Add a Button in WordPress Timeline?
icon
How to Add a Call to Action Banner in WordPress?
icon
123………………………………………………………………53