Jump to content

[SOLUCIONADO] Extraño problema en la barra de busqueda rapida

donpin

By donpin
in Discusión general

 Share

Recommended Posts

donpin Newbie

donpin

Posted
Posted (edited)

Buenas tardes Prestashoperos. Tengo un extraño problema con la barra de busqueda rápida que aparece en el menu horizontal, intentaré explicarlo. Adjunto una imagen .jpg para facilitar la comprensión.

 

Cuando entras en la web solo se ve el icono de la lupa y no se ve el recuadro donde debes introducir el texto de la búsqueda (imagen 1). Sin embargo, si pasas el puntero del ratón por encima de la lupa el mencionado recuadro aparece (img2). 

Pero lo mas extraño es lo siguiente: Si haces una búsqueda, por ej.de "ambientador", debajo te salen los resultados encontrados (imagen 3), pero si bajas con el puntero del ratón hacia uno de esos resultados para seleccionarlo, todos desaparecen y se vuelve a la situación de la imagen 1.

Para que puedas seleccionar uno de los resultados tienes que: o bien pasar el puntero del raton por la lupa y desde ahí hacia los resultados (entonces no desaparecen, hay que jo...), o bien hacer uso de los botones de dirección del teclado (flecha hacia abajo) hasta el resultado deseado.

 

He probado a desinstalar y volver a instalar el modulo Bloque de búsqueda rápida, pero todo sigue exactamente igual.

Esto es muy raro y no he visto ningún post parecido ¿Alguien tiene una idea de que puedo hacer para que el recuadro de busqueda aparezca siempre y para que no me desaparezcan los resultados cuando voy a seleccionarlos con el ratón?

 

PD: Feliz navidad.

post-843907-0-59029400-1419864778_thumb.jpg

Edited by donpin (see edit history)
Link to comment
Share on other sites
donpin Newbie

donpin

Posted
  • Author
Posted

Gracias por tu respuesta Ventura, pero no se exactamente a que te refieres, no tengo mucha idea de programación la verdad sea dicha. He entrado dentro de la carpeta del tema que tengo instalado, luego en modules y en blocksearch, y dentro de esta última carpeta solo hay 2 archivos: blocksearch-top.tpl y blockserch.tpl.

¿Podrías especificar un poco mas? 

Link to comment
Share on other sites
donpin Newbie

donpin

Posted
  • Author
Posted

Te facilitaría la información que me pidieses Ventura, si quieres doy acceso a tu dirección de IP para que puedas comprobar el frontoffice por ti mismo (supongo que tendrías que mandarme tu dirección IP via mail). Uso prestashop 1.6.0.9 y la plantilla Template Parfume (ojo, no Perfum) Store.

Tan solo dime que otros datos necesitas saber. 

 

Un saludo.

Link to comment
Share on other sites
donpin Newbie

donpin

Posted
  • Author
Posted (edited)

Y por si algun alma caritativa que tenga conocimientos de código tiene la amabilidad de ayudarme ahí copio el codigo de los 2 archivos de la carpeta Blocksearch, a ver si puedo solucionar este tremendo fallo de la plantilla:

 

1. Archivo blocksearch-top.tpl

*}
<!-- Block search module TOP -->
<div id="search_block_top" class="col-sm-4 clearfix">
   <form id="searchbox" method="get" action="{$link->getPageLink('search')|escape:'html':'UTF-8'}" >
      <input type="hidden" name="controller" value="search" />
      <input type="hidden" name="orderby" value="position" />
      <input type="hidden" name="orderway" value="desc" />
      <input class="search_query" type="text" id="search_query_top" name="search_query" placeholder="{l s='Search'  
        mod='blocksearch'}" value="{$search_query|escape:'htmlall':'UTF-8'|stripslashes}" />
     <button type="submit" name="submit_search" class="btn btn-default button-search">
            <span>{l s='Search' mod='blocksearch'}</span>
      </button>
   </form>
</div>
<script type="text/javascript">
{literal}
$(document).ready(function() {
var rech = $("#search_query_top");
$("#search_block_top .btn.button-search").mouseenter(function() { 
rech.fadeIn(500,'easeOutBounce');
});
rech.mouseleave(function() {
rech.fadeOut(500,'easeOutBounce');
});
 
});
{/literal}
</script>
<!-- /Block search module TOP -->
 
2. Archivo blocksearch.tpl
*}
 
<!-- Block search module -->
<div id="search_block_left" class="block exclusive">
   <p class="title_block">{l s='Search' mod='blocksearch'}</p>
   <form method="get" action="{$link->getPageLink('search', true)|escape:'html':'UTF-8'}" id="searchbox">
   <label for="search_query_block">{l s='Search products:' mod='blocksearch'}</label>
      <p class="block_content clearfix">
         <input type="hidden" name="orderby" value="position" />
         <input type="hidden" name="controller" value="search" />
         <input type="hidden" name="orderway" value="desc" />
         <input class="search_query form-control grey" type="text" id="search_query_block" name="search_query" value="
          $search_query|escape:'htmlall':'UTF-8'|stripslashes}" />
         <button type="submit" id="search_button" class="btn btn-default button button-small"><span><i class="icon-search"></i>        
          </span></button>
      </p>
   </form>
</div>
<!-- /Block search module -->

 

 

Ayuda pleaseee  :)

Edited by donpin (see edit history)
Link to comment
Share on other sites
ventura Rising Star

ventura

Posted
Posted

Elimina la parte script

<script type="text/javascript">
{literal}
$(document).ready(function() {
var rech = $("#search_query_top");
$("#search_block_top .btn.button-search").mouseenter(function() { 
rech.fadeIn(500,'easeOutBounce');
});
rech.mouseleave(function() {
rech.fadeOut(500,'easeOutBounce');
});


});
{/literal}
</script>

del archivo

blocksearch-top.tpl
Link to comment
Share on other sites
donpin Newbie

donpin

Posted
  • Author
Posted

El código que contiene el archivo blocksearch de la carpeta css de mi tema es el siguiente:

#search_block_top {
  padding-top: 50px;
}
 
#search_block_top #searchbox {
  position: absolute;
  width: 100%;
}
 
#search_block_top .btn.button-search {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  border: none !important;
  width: 47px;
  text-align: center;
  height: 47px;
}
 
#search_block_top .btn.button-search span {
  display: none;
}
 
#search_block_top .btn.button-search:before {
  content: "\f002";
  display: block;
  font-family: "FontAwesome";
  font-size: 17px;
  width: 100%;
  text-align: center;
}
 
#search_block_top .btn.button-search:hover {
}
 
#search_block_top #search_query_top {
  display: inline;
  margin-right: 1px;
  opacity: 1;
  display: none;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -ms-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
}
 
.ac_results {
  background: white;
  border: 1px solid #d6d4d4;
  width: 271px;
  margin-top: -1px;
}
 
.ac_results li {
  padding: 0 10px;
  font-weight: normal;
  color: #686666;
  font-size: 13px;
  line-height: 22px;
}
 
.ac_results li.ac_odd {
  background: white;
}
 
.ac_results li:hover, .ac_results li.ac_over {
  background: #fbfbfb;
}
 
form#searchbox {
  position: relative;
}
 
form#searchbox label {
  color: #333333;
}
 
form#searchbox input#search_query_block {
  margin-right: 10px;
  max-width: 222px;
  margin-bottom: 10px;
  display: inline-block;
  float: left;
}
 
form#searchbox .button.button-small {
  float: left;
}
 
form#searchbox .button.button-small i {
  margin-right: 0;
}
 
@media (max-width:941px) {
  #search_block_top {
    top: 14px;
  }
}
 
@media (max-width:768px) {
 
  #search_block_top #search_query_top {
    opacity: 1 !important;
    height: 40px;
    display: block !important;
    width: 90%;
    color: #808080;
  }
 
  #search_block_top {
    margin-bottom: 20px;
    padding-top: 0;
    width: 100%;
    max-height: 90px;
    float: left;
  }
 
  #search_block_top ,#search_block_top #searchbox {
    position: relative;
    right: 0;
    top: 0;
  }
 
  #search_block_top .btn.button-search {
    width: 40px;
    height: 40px;
  }
}
 
 
¿Podrías decirme que cambiar? Yo estoy loco mirando pero no soy capaz de discernir lo que debo cambiar.
Link to comment
Share on other sites
ventura Rising Star

ventura

Posted
Posted

Quita los

display:none

De estas clases

#search_block_top .btn.button-search span {
  display: none;
}

<-------------------------------------------------


#search_block_top #search_query_top {
  display: inline;
  margin-right: 1px;
  opacity: 1;
  display: none;
  -webkit-transition: opacity 0.5s ease-in-out;
  -moz-transition: opacity 0.5s ease-in-out;
  -ms-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
}
Link to comment
Share on other sites
donpin Newbie

donpin

Posted
  • Author
Posted

Santo Dios, creía que esto iba a acabar conmigo pero al realizar el ultimo paso que me dijiste la barra de busqueda ha quedado totalmente operativa; es decir, ahora aparece siempre la "cajetilla" y las busquedas resultantes no desaparecen cuando desplazo el puntero del ratón hacia una de ellas. Siiii!

Por poner una pequeña "pega", me gustaría poder eliminar un nuevo texto, algo antiestetico, que ha aparecido ahora debajo del icono de la lupa, tal como aparece en la imagen .jpg que adjunto, y también modificar el texto "buscar" que aparece en la cajetilla, aunque estas cuestiones ya me preocupan bastante menos. ¿Sabrías que código tocar?.

Mil gracias Ventura, feliz año nuevo ahora mas que nunca y doy el tema por solucionado desde ya, esperando la guinda del pastel que sería que pudieras comentarme algo sobre lo antes dicho. De todos modos gracias de nuevo.

:)  :)  :)

Link to comment
Share on other sites
donpin Newbie

donpin

Posted
  • Author
Posted

Se ve que con la emoción se me olvido insertar la imagen, pero es que estoy buscando el modo de hacerlo y no encuentro el boton u opción para poder subirla. No saber subir una imagen, con los años que llevo con PC.... ¿me puedes decir como por favor?

Link to comment
Share on other sites
Guest
This topic is now closed to further replies.
 Share
Go to topic listing
×
×
  • Create New...