Master the WordPress Button Block: from Beginner to Expert

Learn how to create amazing buttons using WordPress's Button Block in the Gutenberg Editor.
👉 Get the CSS (and extra button styles) - https://www.buildthatwebsite.com/gute...

********************************
Video Chapters
********************************
0:00 - Intro
0:26 - Wordpress style controls for Button Blocks
3:52 - Adding a custom CSS Class to buttons
4:44 - Where to put CSS code


We'll start with the built-in styling options in the block editor. Learn how to add background colors and gradients as well as custom text colors. We'll also touch on button spacing, centering buttons on the page, adding border-radius and resizing buttons.

In the 2nd part of the video, I'll show you how to add CSS styles to your buttons, and combine CSS classes to add things like box-shadow, borders, border-radius and hover effects. We'll add simple animations using CSS transitions, and create multiple button styles.

There's also a neat trick to automatically create a color-change hover effect that works for (almost) any button color.