Hide navigation bar in mobile version

[Pelleque]

First of all sorry for my bad english, I wanted the search bar in the mobile version was hidden and only appear with the side menu, with the inspect browser element I can change it, but I do not know what file it would be. Putting all the <div class: "row"> indicated in the set immediately after it would be perfect, but I do not know in what file I have to modify it.

Thanks in advance.

 

[Nishith Nesdiya]

HI...
your file locate in

"themes\your_themes\templates\_partials\header.tpl"

Thanks

[Pelleque]

6 hours ago, Nishith said:

HI...
your file locate in

"themes\your_themes\templates\_partials\header.tpl"

Thanks

Hi, when I made the changes it looks good on the mobile theme but it has hidden the logo and the menu on the computer theme, how can I change it only in the computer version?

 

[Nishith Nesdiya]

hi...
not hide all row div class
put "hidden-sm-down" class in this div '<div class="col-md-10 col-sm-12 position-static">'.
See the image

Thanks

[Pelleque]

4 hours ago, Nishith said:

hi...
not hide all row div class
put "hidden-sm-down" class in this div '<div class="col-md-10 col-sm-12 position-static">'.
See the image

Thanks

When I do that, the search bar disappears in the mobile version, and it does not appear when I open the side menu. How can I make it appear with the side menu?

Also disappears the entire menu and the search bar in the computer version

 

Edited March 26, 2019 by Pelleque (see edit history)

[Pelleque]

{block name='header_banner'}
  <div class="header-banner">
    {hook h='displayBanner'}
  </div>
{/block}

{block name='header_nav'}
  <nav class="header-nav">
    <div class="container">
      <div class="row">
        <div class="hidden-sm-down">
          <div class="col-md-5 col-xs-12">
            {hook h='displayNav1'}
          </div>
          <div class="col-md-7 right-nav">
              {hook h='displayNav2'}
          </div>
        </div>
        <div class="hidden-md-up text-sm-center mobile">
          <div class="float-xs-left" id="menu-icon">
            <i class="material-icons d-inline">&#xE5D2;</i>
          </div>
          <div class="float-xs-right" id="_mobile_cart"></div>
          <div class="float-xs-right" id="_mobile_user_info"></div>
          <div class="top-logo" id="_mobile_logo"></div>
          <div class="clearfix"></div>
        </div>
      </div>
    </div>
  </nav>
{/block}

{block name='header_top'}
  <div class="header-top">
    <div class="container">
       <div class="row">
        <div class="col-md-2 hidden-sm-down" id="_desktop_logo">
            {if $page.page_name == 'index'}
              <h1>
                <a href="{$urls.base_url}">
                  <img class="logo img-responsive" src="{$shop.logo}" alt="{$shop.name}">
                </a>
              </h1>
            {else}
                <a href="{$urls.base_url}">
                  <img class="logo img-responsive" src="{$shop.logo}" alt="{$shop.name}">
                </a>
            {/if}
        </div>
        <div class="col-md-10 col-sm-12 position-static">
          {hook h='displayTop'}
          <div class="clearfix"></div>
        </div>
      </div>
      <div id="mobile_top_menu_wrapper" class="row hidden-md-up" style="display:none;">
        <div class="js-top-menu mobile" id="_mobile_top_menu"></div>
        <div class="js-top-menu-bottom">
          <div id="_mobile_currency_selector"></div>
          <div id="_mobile_language_selector"></div>
          <div id="_mobile_contact_link"></div>
        </div>
      </div>
    </div>
  </div>
  {hook h='displayNavFullWidth'}
{/block}

This is the original header.tpl

Edited March 26, 2019 by Pelleque (see edit history)

[Pelleque]

On 3/26/2019 at 5:58 AM, Nishith said:

hi...
not hide all row div class
put "hidden-sm-down" class in this div '<div class="col-md-10 col-sm-12 position-static">'.
See the image

Thanks

I haven't yet managed to solve it, any ideas?

[Pelleque]

@Nishith