Docs

[lucrobinson11]

Hi,

I’d like to add a link to the header bar of my website, http://www.leaveatrace.co.

I don’t want to add it inline with the rest of the title menu, but rather below and in a slightly smaller font. I want the link to be right aligned with the furthest right menu item (“FAQ”), and a few pixels below.

How do I do that?

I’ve attached a screenshot of my homepage.

Thanks very much.

[lucrobinson11]

Just realized the screenshot wouldnt upload, but you can see the homepage at http://www.leaveatrace.co

[Christopher]

Hi there,

Please add following code in Customize -> Custom -> JavaScript :

jQuery("<span style='float:right;font-size:12px;display: inline-block;width: 100%;text-align: right;'>custom text</span>").insertAfter(".x-navbar .x-nav");

Hope it helps.

[lucrobinson11]

Thanks!

It’s almost perfect. I added that code, and a little extra css to shift the text to where I want it to be.

jQuery(“<div style=’float:right;font-size:12px;display: inline-block;width: 100%;text-align: right;margin-top:-20px;margin-right:15px;text-transform: uppercase;’>Never forget: Download the chrome extension</div>”).insertAfter(“.x-navbar .x-nav”);

The only issue not is that the link doesn’t work. I think because the nav bar links are not just text links, but rather extend up and down, my link is now showing up underneath the nav bar links. How can I fix that?

[Christopher]

Hi there,

Please update your code to :

jQuery("<div style='float:right;font-size:12px;display: inline-block;width: 100%;text-align: right;margin-top:-20px;margin-right:15px;text-transform: uppercase;position:relative;z-index:2000;'><a href='http://www.leaveatrace.co/'>Never forget: Download the chrome extension</a></div>").insertAfter(".x-navbar .x-nav");

Hope it helps.

[Author]

Posts