Using spectra, you can use the Buttons block that allows you to add multiple buttons within a single section. You can add many buttons with different colors, shapes, sizes, borders, hover effects, and typography. These individual buttons can be grouped together and controlled with individual settings.
In this article, we’ll go through a few things you would want to know about the Multi Button block.
How to add Multiple Buttons Block
To insert the buttons block, click the Toggle block inserter + icon and search for the buttons block.
You’ll see two buttons added by default. You can change the button text to the text of your choice. Also, you add more buttons by clicking on the + icon.
Common Styling Options
By selecting the block, you will be able to see the three vertical three dots. On clicking the dots, navigate to ‘show more settings. Then, the block settings panel will open on the right side of the block editor.
Under the ‘General’ settings tab, you can set the button alignment, button size, and the gap between the buttons.
The Multi Button widget gives you global styling options that let you style all the buttons together. If you want all buttons to look identical, you can use the settings here.
Individual Styling Options
If you wish to style each button separately, click on the individual button you wish to edit. Then, you can access the styling options for the button on the right side of the block editor. You can control each button through its General settings.
You can add icons before/after text on a button to make it look good. Once you have added the icon, you have the option to remove the text. Also, you can add a hyperlink to the button, have the option to open the link in a new window or add ‘no follow to the link. Take a look at the screenshot below.
Under the ‘Style’ tab, you can set the button\’s typography, border, box-shadow, and background color.
