Docs

[Lely]

Hello Josh,

1.)Upon checking logobar transparent right now. What you see site background. Please add the following CSS to see the content behind.

.x-boxed-layout-active .site {
    background-color: transparent;
}

2. Please also add this:

@media (min-width: 980px) {
body.x-navbar-fixed-top-active .x-navbar-wrap {
     height:80px; /*Update to your preferred height*/
}
}

3.) Please check this link on how to achieve sidebar on single product page:
https://community.theme.co/forums/topic/sidebar-on-single-product-page-4/#post-170005

Hope this helps.

[Josh H]

1) As I said in the previous post – I can’t change the background color of .site because it makes the woocommerce pages transparent and I’m unable to adjust. Is there another solution?

2) This fix does not do anything other than set the height offset. It doesn’t appear to be changing anything in regards to the issue I listed. Let me know if I’m doing something wrong.

3) The suggested code does not solve the issue. As this is the standard response to every time someone has asked this question before, I had already tried it anyways when I searched the forum. I tried it again just to make sure, but it still does not work.

[Rue Nel]

Hello There,

Thanks for the updates!

1] You can use this code instead:

.x-boxed-layout-active .site {
    background-color: transparent;
}

.x-boxed-layout-active .x-main,
.x-boxed-layout-active .x-sidebar,
.x-boxed-layout-active .x-colophon {
    background-color: #202020;
}

2] Please clarify further. Perhaps some screenshot would helps us understand what you are really trying to achieve here. Thanks.

3] Please confirm that you have added the code in your child theme. As we have check your site, we do not see a child theme and you are using the parent X theme.

Please let us know.

[Josh H]

1) FINALLY! Thanks! I’ve been scratching my head over this for a while..

2) Sure thing – see attached GIF. The navbar should not change width. It does this anytime the sidebar is present. it works correctly (doesn’t resize) when there is no sidebar present.

3) I didn’t realize this issue required a child theme. I’ll stick to using the Customizer’s Custom CSS field for my stuff. If the issue can’t be resolved there, then I understand – just let me know. I’d rather not get into using a child theme for this site.

[Christopher]

Hi there,

I would like to check your site but it’s under construction mode. Please provide us with login credentials.

Thanks.

[Josh H]

This reply has been marked as private.

[Christopher]

Hi there,

#2 Please add this :

.x-navbar.x-navbar-fixed-top.x-container.max.width {
    width: 65.1%;
}

#3 Please follow the steps in provided link and let us know if you need further assist.

Thank you.

[Josh H]

Nope.. Then that breaks the navbar working correctly without a sidebar.

I’ll just wrap two different ones in a media tag and mess with it myself. Thanks for trying. I’m getting the feeling that Fixed Top NavBars are just not coded to be used with a sidebar…

[Rue Nel]

Hello There,

Sorry if it didn’t quite work out for you. Please remove the custom css.

How about we use a different approach here. Simply add this custom JS code in the customizer, Appearance > Customize > Custom > Javascript

(function($){
  $(window).on('load resize scroll', function(){
    var W = $('#top').width();
    if( $('.x-navbar').hasClass('x-navbar-fixed-top') ){
      $('.x-navbar').css('width', W);
      //console.log(W);
    }
  });
})(jQuery);

We would loved to know if this has work for you. Thank you.

[Josh H]

Great support as always, Theme.co Thanks! It did the trick

[John Ezra]

You’re most welcome!

[Author]

Posts