Jump to content
Golondrina

Modificar / personalizar MENU HORIZONTAL

Recommended Posts

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).

1523513583_Capturadepantalla2019-05-16alas20_00_21.thumb.png.b60143c7490b277583848c789d803f83.png

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

Share this post


Link to post
Share on other sites

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}

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More