Jump to content

Create Secondary Button in Top Nav

Recommended Posts

Site URL: http://unstoppable-u.com

Hi All:

I want to add a second button to the right of Contact that says "Enroll Now" - I had this with the preliminary template created and didn't think I needed it, so I deleted it. I want the button to be white with a red outline to match my brand. In searching for code, I can't find what I'm looking for to achieve this. Anyone here able to help me out? Thanks in advance. 

Link to comment
  • Replies 1
  • Views 419
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

@ToddZ Hi! You can add this code in Website > Pages > Website Tools > Code Injection > Header. Replace the URL 'https://unstoppable-u.com/course-details' in the code with your URL.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>

<script>
$(document).ready(function () {
    var newLink = $('<a>', {
        class: 'btn btn--border theme-btn--primary-inverse sqs-button-element--primary second-header-button',
        href: 'https://unstoppable-u.com/course-details',
        text: 'Enroll Now'
    });
    $('.btn').after(newLink);
});
</script>

<style>
.second-header-button {
  margin-left: 0.9vw;
}
</style>

 

If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. 

Sam
Web Developer & Digital Designer

 Did you find my contribution helpful? Buy me a coffee?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.