CMS Development

matt5
Member | Partner
Member | Partner

Problem adding a CTA button to navigation bar

SOLVE

I've added a CTA button to the navigation bar on my blog, but as you can see in the screenshot below it has aligned itself to the top left of the navigation bar, overlapping the logo. I need this button to be positioned where it will replace the 'register' link that's currently on the far right of the menu.

 

Screenshot-2020-01-09-at-19.06.25.jpg

 

Below shows how I added the CTA button to the navigation bar.

 

Screenshot-2020-01-09-at-19.07.20.jpg

 

What am I doing wrong? I should mention that this custom blog theme was created by a Hubspot developer, and my experience with web development, particularly CSS, is very limited.

 

Thanks.

0 Upvotes
1 Accepted solution
krishangtechn
Solution
Member

Problem adding a CTA button to navigation bar

SOLVE

@matt5,

 

Thanks for sharing the URL

 

Here you have to apply below stylesheet in your combined-css-ffaac00b86d8795a0ef19d7aac14d389.css file

.custom-menu-primary .hs-menu-wrapper ul li:last-child a {
background: #ed317d!important;
color: #fff;
padding: 6px 15px;
border-radius: 5px;
}

.custom-menu-primary .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children li:last-child a {background: transparent !important;border-radius: 0;color: #ed317d;}

Feel free to ask still if have any query confusion will be happy to help you

If you like the solution then kindly mark as solutions with an upvote.

 

Thanks & Regards,

Ramesh Gosiya

Krishangtechnolab

View solution in original post

8 Replies 8
sharonlicari
Community Manager
Community Manager

Problem adding a CTA button to navigation bar

SOLVE

Hey @matt5    

 

Thank you for the information provided, could you please send the URL?

 

I will tag a few of our experts to learn from them.   

 

Hey @DanielSanchez  @krishangtechn @tjoyce could you please share your knowledge with @matt5

 

Thank you & Happy Friday

Sharon


Did you know that the Community is available in other languages?
Join regional conversations by changing your language settings !




0 Upvotes
matt5
Member | Partner
Member | Partner

Problem adding a CTA button to navigation bar

SOLVE

Thanks 🙂

 

This is the blog url where I need the CTA button to replace the 'register' link: https://roundtable.datascience.salon/

 

This is the main website where we already have the button (not a hubspot CTA) https://www.datascience.salon/

 

I would like the button in the hubspot navigation bar to match the one on the main website as closely as possible.

0 Upvotes
krishangtechn
Solution
Member

Problem adding a CTA button to navigation bar

SOLVE

@matt5,

 

Thanks for sharing the URL

 

Here you have to apply below stylesheet in your combined-css-ffaac00b86d8795a0ef19d7aac14d389.css file

.custom-menu-primary .hs-menu-wrapper ul li:last-child a {
background: #ed317d!important;
color: #fff;
padding: 6px 15px;
border-radius: 5px;
}

.custom-menu-primary .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children li:last-child a {background: transparent !important;border-radius: 0;color: #ed317d;}

Feel free to ask still if have any query confusion will be happy to help you

If you like the solution then kindly mark as solutions with an upvote.

 

Thanks & Regards,

Ramesh Gosiya

Krishangtechnolab

matt5
Member | Partner
Member | Partner

Problem adding a CTA button to navigation bar

SOLVE

Can you tell me where I can find the stylesheet where I should apply this css.

 

Thanks

0 Upvotes
krishangtechn
Member

Problem adding a CTA button to navigation bar

SOLVE

@matt5 ,

 

Css file name is : combined-css-ffaac00b86d8795a0ef19d7aac14d389.css file

 

If  you find problem in path can you give hubspot access in private chat I'll update in tommorow

 

Thanks

Ramesh

Krishangtechnolab

0 Upvotes
matt5
Member | Partner
Member | Partner

Problem adding a CTA button to navigation bar

SOLVE

It worked. Thank you 🙂

0 Upvotes
krishangtechn
Member

Problem adding a CTA button to navigation bar

SOLVE

@matt5 ,

 

Glad to hear that.

 

Could you mark this topic as a solution 

 

Regards,

Ramesh Gosiya

KrishangTechnolab

0 Upvotes
krishangtechn
Member

Problem adding a CTA button to navigation bar

SOLVE

@sharonlicari ,

Happy to help you to @matt5 

@matt5  could you please share the page url so I can check and assist you. Seems on existing live site https://www.datascience.salon/ is already there register button cta on right side.

waiting for more details

 

Thanks,

Ramesh Gosiya

Krishangtechnolab