Modificar / personalizar MENU HORIZONTAL

[Golondrina]

Hola,

Tenemos un problema con el menú principal de la home. El logotipo de la tienda (a la izquierda) queda tapado con la barra del menú horizontal (en morado).

Desde los ajustes de AN Themes solo puedo modificar el color de la barra pero no puedo cambiar ni el tamaño ni la alineación de las categorías. ¿Cómo podría hacer más pequeña la parte morada para que no tapara el logo?

También me gustaría hacer más pequeño el espacio del menú para que no haya tanto espacio en blanco por arriba y por debajo.

Mi tema se llama Shein, de Prestashop Addons y el módulo se llama Anvanto Mega Menu.

Muchas gracias

[lunaroja]

Yo lo que hago en mi prestashop 1.7.5.1 es centrar el logo encima del menú. Así también tengo más sitio para poner más categorías. Igual eso te podría servir. Es una solución que encontré en este foro.

Yo uso el tema por defecto, el classic. Modifico el fichero header.tpl, apenas hay que cambiar un par de cosas, o tres:

{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-12 hidden-sm-down text-xs-center" 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-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}