Navbar button shown in small view - how to?

[Bobber]

If I use the:

includes > modules > navbar_extra_modules > templates > nbx_search_button file from "navbar extra 1.1"

it then displays the search bar in the header when displaying in mobile...

Do you see any problem with using this:

<?php

  $button = '      <button type="button" id="btn-search" class="btn-primary navbar-toggle"  data-toggle="collapse" data-target="#navbar-extra-collapse-search">
        <span class="sr-only">MODULE_NAVBAR_EXTRA_SEARCH_BUTTON_SCREENREADER_TEXT</span>
        <span class="fa fa-search"></span>
      </button>
';

  $collapsible_menu = '    <div class="collapse navbar-collapse navbar-right" id="navbar-extra-collapse-search">
        <ul class="nav navbar-nav navbar-right hide-expanded">
          <li>
            <div class="searchbox-margin">' . tep_draw_form("quick_find", tep_href_link("advanced_search_result.php", "", $request_type, false), "get")  . '
              <div class="input-group">
              <input type="text" name="keywords"  required placeholder="' . TEXT_SEARCH_PLACEHOLDER . '" class="form-control" />
              <span class="input-group-btn"><button type="submit" class="btn btn-info"><i class="fa fa-search"></i></button></span>
              </div>
            </form>
            </div>
          </li>
        </ul>
    </div>
';
 //            <form name="quick_find" action="https://hobbycrash.com/_0000/advanced_search_result.php" method="get" class="form-horizontal searchbox-width">

Instead of this:

<?php

  $button = '      <button type="button" id="btn-search" class="btn-primary navbar-toggle"  data-toggle="collapse" data-target="#navbar-extra-collapse-search">
        <span class="sr-only">MODULE_NAVBAR_EXTRA_SEARCH_BUTTON_SCREENREADER_TEXT</span>
        <span class="fa fa-search"></span>
      </button>
';

  $collapsible_menu = '    <div class="collapse navbar-collapse navbar-right" id="navbar-extra-collapse-search">
        <ul class="nav navbar-nav navbar-right hide-expanded">
          <li>
          <span id="search-placeholder"></span>
          </li>
        </ul>
    </div>';

$jscript = '<script>
  function ChangeDiv(width){
    if (width <= 767) {
        $(".searchbox-margin").appendTo($("#search-placeholder"));
        $(".searchbox-margin").css({"margin-left":"10px", "margin-right":"10px"});
    } else {
        $(".searchbox-margin").appendTo($(".search"));
        $(".searchbox-margin").css({"margin-left":"", "margin-right":""});

    }
  }

  $(function () {
      var onLoadWidth = $(window).width();
      ChangeDiv(onLoadWidth);
        $(window).resize(function () {
          var resizeWidth = $(window).width();
          if (onLoadWidth !== resizeWidth) {
            ChangeDiv(resizeWidth);
            onLoadWidth= resizeWidth;
          }
        });
  })
</script>';

$oscTemplate->addBlock($jscript, 'footer_scripts');

 

[piernas]

10 hours ago, Bobber said:

For some reason the search box is no being displayed in the header under the logo after this update... in mobile display.

Are you seeing that too @piernas???

I made it to hide the search bar in mobile view so it's only seen when you press the search button. Is this the way it works for you?

[Bobber]

Yes It is @piernas!!!

Thank You Again For Your Help And The Great Job You Did Developing This Add-On!!!

[piernas]

@Bobber I mean - is it working that way in the zip I uploaded or it's failing?

[discxpress]

@piernas I can't get it to show up after uploading to my site and turning on buttons.

Where should I look for the problem? I use BS EDGE

[piernas]

@discxpress have you enabled the new navigation bar under content modules->navigation bar?

[discxpress]

12 minutes ago, piernas said:

@discxpress have you enabled the new navigation bar under content modules->navigation bar?

Thanks! I like this module. When I set the navbar to float the screen is able to move side to side like something is too big for the screen. This only on desktop.

[piernas]

@discxpress can you post aa screenshot of the issue? Does everything else work fine?

[discxpress]

3 minutes ago, piernas said:

@discxpress can you post aa screenshot of the issue? Does everything else work fine?

I can't screenshot it. It's the scrollbar that appear at the bottom of the browser that moves left to right. 

It works just fine

[piernas]

@discxpress I can't replicate it - don't have a bottom scrollbar on my test site

[discxpress]

1 minute ago, piernas said:

@discxpress I can't replicate it - don't have a bottom scrollbar on my test site

Thanks anyway. It works fine in mobile which is where most of my traffic comes from.

[Bobber]

On 12/1/2017 at 11:28 PM, piernas said:

@Bobber I mean - is it working that way in the zip I uploaded or it's failing?

Hi @piernas Yes It Is Unzipping the proper way which you discribed!

Thank You For Your Help And The Update!!!

This Is Easily The Best Mobile Update Available For OsCommerce!!!