How to add Call To Action (CTA) button in the WordPress menu

Having a Call-to-Action button in your menu is a great thing. It grabs the attention of your visitors and points out the most important page on your website.

In this quick video tutorial I will show you how to create a simple call-to-action (CTA) button in your navigation menu.

CTA Button Design 1

.menu-cta-button_design_1 a {
	background: #CD7F32 !important;
	color: #ffffff !important;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.menu-cta-button_design_1 a:hover {
	background: #E1C16E !important;
	color: #ffffff !important;
}

CTA Button Design 2

.menu-cta-button_design_2 a {
	border: 2px solid #CD7F32 !important;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.menu-cta-button_design_2 a:hover {
	border: 2px solid #E1C16E !important;
}

If you’re looking for custom colors for inspiration check HTML Color Codes.

Leave a Comment