BOOK APPOINTMENT

How to add custom CTA button in header in Divi?

How to add custom CTA button in header in Divi?

If you have already set up your website menu, follow the following steps to create a button for any link in the menu!

1. Add custom class to the menu item

Custom CTA class

Go to WordPress Dashboard > click on Appearance > click on menu > now select your menu > now add custom class “contact-btn”.

2. Add custom CSS

Custom CSS option In Divi
Go to Divi setting > click on theme option > click on Custom CSS field > now add following CSS code


@media only screen and (min-width: 981px){

.contact-btn a {
background-color: #ffffff;
border-radius: 50px;
color: #001b40 !important;
padding: .05em 1.5em 0em 1.5em!important;
height: 45px!important;
}
.contact-btn{
align-items: center!important;
margin-top: -.5em!important;
}
.contact-btn a:hover{
background-color: #001b40 !important;
color: #ffffff !important;
opacity:1 !important;
}
}