BOOK APPOINTMENT

How to add custom CTA button in header in Divi?

Custom CTA button
57 / 100

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;
}
}

0 Comments

Submit a Comment