If you are looking for a compact and user-friendly way to show your content on your website, you will love toggle buttons. When a visitor clicks on a toggle button, it expands with all of the content you added inside. This will save your visitors a lot of time and keep them from becoming bored.
And, you know what, adding these buttons isn’t even hard. Once you see how it’s done you’ll know how easy it is. This is a short tutorial that will show you how to add a toggle button in WordPress in a few easy steps.
Let’s get right into it!
How to Add Toggle Switch Button in WordPress
There are many WordPress plugins out there that can be used for this but today we will be using Ultimate Blocks, a fan favorite to add a toggle. It’s a Gutenberg block plugin (freemium) with around 18 blocks and many amazing features.
We will start by going to the WordPress Dashboard. Then go to Plugins and then Add New. Search for Ultimate Blocks, install, and then activate it once found.
Go to the post/page where you want to add a toggle switch. Then click on the (+) icon to add a new block. Type in Tabbed Content on the search bar and select it. You can also add the block by typing /tabbed content.
Once it’s added, you will see the tabbed content like this:
Yes, it still doesn’t look like a toggle switch, but it will, once we are done customizing the design setting of it.
You will find the block setting on the right sidebar, change the Tab Type to Pills there.
Then change the blocks alignment to the center. Now it looks like a button switch.
Click the (+) icon next to it to add another tab.
Now it’s slowly coming into shape but there is still some work to do to make them look more like toggle switches.
Next, we will head to the styles setting on the same sidebar. Then change the tab colors and the tab text color for both tabs.
That’s it, you have your own toggle buttons ready. Start writing content into each tab as you want.
Conclusion
I tried to give you an easy demo with simple steps. If you follow these steps, I’m sure you’ll be able to do it on your own.
You now know how to add a toggle button to WordPress. We recommend that you use ultimate blocks for this as the whole process is hands down the easiest with it. However, if you still want to experiment with alternative plugins for that, take a look at this list.
Here are some more how-to posts to help you further customize your website. If you’d like, you can check them out. Thank you.