Removing top grey bar (Zero Template)

StatusIDPriorityType
Closed4904NormalZero Theme HTML
Profile Reply
Swhat Client

Hello,

I am trying to remove the top grey bar completely.I am not using the template for ecommerce so I don’t need it.

I removed the relevant code from the HTML source, but after I do that, the main navigation (white bar) disapears/pops too far up once you scrolling. Where/how can I change this.

Also, is it possible to keep the white bar, and display the menu button in that bar, on the mobile screens?

Thanks and great template!

Shane

Replies

User Description Posted On
Shindiri Support team Administrator

Hi,

 

To keep the navigation when you remove top grey bar, you’ll need to comment or remove the line which contains

 

$('.header_nav').css({top : -wind_scr});

That is line 97 in header.js file. Header menu is by default hidden on smaller screens, but you can enable it by editing responsive.css file a little bit.

 

Thanks for the compliment, we really appreciate it!

 

Kind regards,
Br0

Swhat Client

Thank you for the timely response! 

On my smaller screens I'd like to display the white bar, with only the menu-trigger and the search-trigger inside it. How/where could I accomplish that?

Thanks,
Shane

This reply has been deleted 4 years ago.
Shindiri Support team Administrator

Hi,

In responsive.css file, you'll need to:

- remove line which contains .search-popout-block {display: none;} - line 46.

- change line .header-nav-wrap {display: none;} to .header-nav-wrap * {display: none;} - line 13 and after it, in the new line, add this piece of code:

.header-nav-wrap .search-trigger, .header-nav-wrap .search-trigger * {
display:block;
}

Let us know if this helps you.

Kind regards,

Br0

Swhat Client

Thanks! This is getting close. The white bar now displays with only the search button like I want.

Now, I just need to embed the menu-trigger into the white bar and make the white bar sticky so that it does not scroll. Suggestions? 

Thanks,
Shane

Shindiri Support team Administrator

Hi,

 

To make "white bar" sticky on smaller screens, you'll need to change .header_nav {position: relative;} to .header_nav {position: fixed;} in responsive.css file, line 19.
Menu-trigger isn't actually a part of the "white bar" so you can't embed it in it without editing html and css a little bit more. Quick solution which will give you similar effect is to change top: 62px; for .menu-trigger element to some smaller value, for instance - 15px. That code is located in style.css file, starting from line 1041.

Kind regards,
Br0

× This ticket is closed.