ekspohz

17 hours ago, tuanphan said:

@ekspohz Try this adjusted code

<script>
 (function() {
    document.addEventListener('DOMContentLoaded',() => {
      document.querySelector('#collection-61d9dcf755b23e793054204b .Header-nav--secondary a').setAttribute('href','/home');
    })
  })()
</script>

 

Perfect! Thank you @tuanphan

Hi @bangank36 I am trying to accomplish the same thing with the button in the navigation at https://www.museoutdoors.com/get-started - I would like to redirect it to a different page. I think the code is different given this page is on Brine. Could you advise? Thanks!

Seems to be an ongoing intermittent issue across sites.

On 8/10/2020 at 9:15 AM, siweisong said:

What if I don't have or want social icons on the header? But I still want them on the mobile menu?

You can still use the code above and then add the following to your Custom CSS to hide on desktop.

// Hide Social Links Header //

.Header--top .SocialLinks-link {display: none !important}

On 12/19/2019 at 4:20 AM, tuanphan said:

SS 7.1 blog use different class, not 

.collection-type-blog

Can you share link to blog post on your site?

Perfect! Just ran into this issue. Thank you.

14 hours ago, tuanphan said:

Can you share link to your site? We can check easier.

The solution here worked: 

Thanks.

On 11/22/2019 at 5:12 AM, lu.diehl said:

Hi @AThompson_social - I've used this in the past and it worked well for me on Brine template:

1. Add this to Settings > Advanced > header code injection:

(Change the scroll height you wish to change the color, here it is set to 400 px)

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

<script>  
 $(window).on("scroll", function() {
    if($(window).scrollTop() > 400) {
        $(".Header").addClass("on-scroll");
    } else {
       $(".Header").removeClass("on-scroll");
    }
});
</script>

 

2. Add this to Design > Custom CSS 

Change the background color you wish to use. If your navbar is transparent at the starting point, then remove the last piece of code (.Site-inner)

.Header{
  background-color: blue!important;
  position: fixed!important;
  transition: 0.2s all linear;
  -webkit-transition:background-color .4s;
  -moz-transition:background-color .4s;
  transition:background-color .4s;
}

.on-scroll{
  background-color: red!important;
}

.Site-inner{padding-top: 50px;}

Let me know how it goes! Your website is pwd protected... if you want further help, please share the password 😉

This is a great solution! Thank you.

On 5/31/2020 at 5:42 AM, tuanphan said:

Add to Home > design > custom CSS

.header-announcement-bar-wrapper.shrink {
    background: black !important;
}

this code can apply for all 7.1 sites.

@tuanphan

Is there a similar solution for 7.0 Brine sites?