Site logo

Archived topic

How to create buttons like this?

14 replies · Started by Former User on July 27, 2021

Viewing posts 1–15 of 15

Hello,

I am trying to build 3 buttons on a block, I had place each button on a column but, they don't show right on different sizes as you can see on first link bellow and I want to show them like on second link.

How I can achieve this?

Thanks!

How I can make them equal width?

Hi there,

i would recommend using the GenerateBlocks plugin and the Buttons Block it provides:

No need for columns, you can just add as many buttons you need inside a single Buttons Block, and style them accordingly. See here:

https://docs.generateblocks.com/article/buttons-overview/

Hello David,

Thanks for reply, just one question do I need premium version of GenerateBlocks to use the ButtonsBlock you mention?

Thanks,

Sara

Nope - its all in the Free version :)

Sweet :)

It sure is :) Glad to be of help

Just used and is great, just one question is it possible to add underline effect on button hover? or just background color?

Thanks again!!

Ok just for curiosity which is the normal hover color for a green button, a red button and a blue button? Inverting colors?

Sorry what?

There isn't any normal colors - it's all personal preferences :)

Thanks Leo,

Just one last question how I can make some separation between them so they are not stuck together, as they show on link bellow? because even in mobile shows too close.

You can give the individual buttons there own Margins in the Spacing options for all device sizes.
So you can set the Desktop to 0 on all margins except for right.
And on Mobile set all to 0 except for bottom.

Hello David,

Thanks for the clarification but, can you tell me what would be the standard or recommended way to do it in my case?

Its a little fiddly, but if you select the first button in the block editor, and then shift-click each of the other buttons to select all three. Then go to the sidebar and switch to the Mobile Tab, then in Spacing > Margins add some bottom margin, it will add that to all the buttons you selected in one go.

This archived topic is closed to new replies.