How to create a simple multi-color Menu in WordPress?

[WordPress Tips]  How to create a simple multi-color Menu in WordPress? Hello fellow believers, it’s been a long time since I’ve returned to the WordPress tips section, with this article I am sure it will be helpful for those of you who want to create a colorful Menu like my current blog. ? If you want to keep it simple, you can use some Plugins to change the Menu to create, but if you don’t want to use Plugins, you can also create it manually with a few simple and easy steps.

It can be said that currently the WordPress source code is a very simple and easy to use source code, you don’t need to know much about the Code even without knowing the Code you can still use it, that’s why the number of people This source code usage is increasing day by day and you are also using WordPress source code? Want to customize your Menu in a professional style?

Create Multi-Color Menus in WordPress

In the previous article about WordPress tricks, I showed you how to make your website accessible when offline so you can configure your website when offline readers can still access it, continue in the article. In this tutorial, I will show you how to create a simple multi-color Menu in WordPress?

#Create CSS Class

First, go to the Appearance> Customize path to enter the interface configuration section.

Then you choose “ Additional CSS ”.

And paste the code below.

/* # Extra theme styling for buttons etc.
-------------------------------------------- */
.button-green {
	background-color: #26CC9F;
	border: 1px solid #26CC9F;
	border-radius: 5px;
	text-align: center;
	text-transform: uppercase;
}
.button-green:hover {
	background-color: #fff;
	border: 1px solid #26CC9F;
}

So now you have a CSS Class named “button-green”,  save it!

#Insert CSS Class into Menu

Please continue to access the path Appearance > Menus.

Click on “Screen Options” and check the CSS classes property .

Then add any Menu and copy the “button-green” class and paste it into the “CSS classes” property of the Menu .

Save and check the results, if you use the Cache Creation Plugin, please clear the Cache and also clear the browser’s Cache.

Similarly, if you want to change the color of other corresponding Menus, you just need to change the color in the code above and change the Class name again.

Suppose I want to create a Menu with red color then I will create a Class named “button-red” for example and I just need to change the color code in the background-color paragraph: #26CC9F;   red is ok, too simple for you to create multicolor Menu in WordPress right?

Finally, if you find the article useful, please  subscribe to my blog  regularly to update the  latest articles  via Email – Thank you!