Logo i pasek szukania w 1 lini

[PikaDarkstar]

Dzień dobry!
Mam problem z osiągnięciem efektu pokazanego na załączonej grafice.
A mianowicie udało mi się przenieść logo i zmienić jego rozmiar edytując plik "header.tpl" 

Natomiast teraz chciałbym wyświetlić logo jak i pasek wyszukiwarki w 1 lini.
Dodatkowo chciałbym wyświetlić pasek szukania po środku nagłówka a logo po lewej... wszystko w 1 lini...
Nie mam pojęcia jak się za to zabrać, jedyny temat z rozwiązaniem tego problemu jaki znalazłem jest z 2017r i proponowane rozwiązanie niestety nie działa

Używam presta w wersji 1.7.6.7 i motywu classic (domyślnego).

Czy znajdę tu kogoś na tyle miłego by odrobinę pomógł jak rozwiązać ten problem?

Ładnie proszę o pomoc bo już naprawdę nie mam pojęcia jak to ogarnąć...

[endriu107]

W szablonie classic menu i wyszukiwarka znajdują się w jednym hooku, dlatego najpierw musisz przenieść jeden z tych elementów do innego hooka najlepiej menu do nowego hooka poniżej. Po tym zabiegu dla wyszukiwarki zrobi się więcej miejsca i będziesz mógł ją dowolnie ostylować. 

[PikaDarkstar]

BARDZO dziękuję za odpowiedź...
Niestety nie jestem programistą i sprawy oczywiste dla zawodowców dla mnie są zagadnieniami skomplikowanymi

Nie widzę żadnego hooka, który mógłbym wykożystać więc z pomocą wujka google wymyśliłem, by dodać nowe hooki... Zapewne porywam się z motyką na słońce, ale może ktoś pomoże??

Czy w takim razie mogę dodać do pliku classic/config/theme.yml
dodatkowe hooki w ten sposób?

Jeśli dobrze rozumiem w ten sposób zdefiniowałem 2 nowe hooki a może coś już pomieszałem??

Następnie chciałbym dodać te nowe hooki "displayTop2" oraz "displayTop3" do pliku header.tpl - w tym pliku znajduje się kod odpowiedzialny za wyświetlanie mojego logo.

Wykombinowałem coś takiego:

Chciałem tym sposobem osiągnąć taki efekt:

Nie wiem czy ja dobrze kombinuje...

Chciałem podzielić ten górny obszar strony który zawierał moje logo na 3 divy o jednakowych rozmiarach, pierwszy z nich zawierający logo zostawiłem bez zmian i dodałem 2 następne by jakoś "łopatologicznie" wycentrować wyszukiwarkę.
Chciałem też by zawartość każdego z tych 2ch nowych div"ów była wyświetlana od lewej...

Teraz wystarczy odczepić "szukajkę" od displayTop i doczepić ją do displayTop2 tak??

Troszkę boję się to wgrać na serwer więc robie kopie wszystkich plików i bazy danych...

Bardzo proszę o wskazanie co robie źle lub dlaczego to nie zadziała...
Staram się wymyślić coś samodzielnie i naprawdę kombinuję jak tylko potrafię...

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Edit:

Po podmianie plików na moje wersje strona działa nadal poprawnie...
Niestety nowo dodane hooki nie pokazują się na liście "pozycji"
Nie mogę ich wyszukać (również po zaznaczeniu opcji "wyświetl niepozycjonowane zaczepy")
Przy próbie edycji położenia dowolnego modułu na liście nie ma moich nowo dodanych hooków

Podpowie ktoś, co zrobiłem źle??
A może czegoś nie zrobiłem??

Edit2:

Oczywiście w pliku header.tpl zrobiłem mały błąd definiując szerokośc div'ów:
{block name='header_top'}
  <div class="header-top">
    <div class="container">
       <div class="row">
        <div class="col-md-4 hidden-sm-down text-xs-left" 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-4 text-xs-left">
          {hook h='displayTop2'}
        </div>
        <div class="col-md-4 text-xs-left">
          {hook h='displayTop3'}
        </div>
        <div class="col-md-12 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} 
 

Edited August 23, 2020 by PikaDarkstar
Dodałem informacje o efekcie (a raczej jego braku) moich działań... (see edit history)