Barra del buscador  

 
JOSE LUIS
 JOSE LUIS
Usuario eminente

Hola, yo ahora tengo este buscador.

buscador sumi

 

Y me gustaría tener un buscador grande tipo este:

buscador

¿Podría cambiarlo?

Citar
Respondido : 28/09/2020 4:31 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola José Luis,

Puedes indícanos cual es la URL del sitio web donde deseas añadir este buscador? de esta forma podremos verificar con mayor detalle lo que nos comentas

Un Saludo

ResponderCitar
Respondido : 28/09/2020 4:56 pm

Cursos Gratuitos WordPress

JOSE LUIS
 JOSE LUIS
Usuario eminente

@karen

https://suminca.es/

ResponderCitar
Respondido : 29/09/2020 7:47 am
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Jose Luis,

Puedo ver que ahora tienes un buscador que se despliega y obtienes una aspecto parecido al que buscas. Si deseas mejorarlo para que se visualice de la siguiente forma puede añadir el siguiente código en el apartado Apariencia -> Personalizar -> CSS Adicional

imagen

.et_search_outer .aws-container {
position: absolute;
right: 170px;
top: -12px;
}

div#et_top_search {
PADDING: 12px 6px 9px 16px;
}

Coméntanos si es esto lo que deseas o definitivamente deseas sustituir este buscador.

Un Saludo

ResponderCitar
Respondido : 29/09/2020 3:27 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

JOSE LUIS
 JOSE LUIS
Usuario eminente

@karen

Hola, he añadido lo que me has dicho pero el buscador no ha cambiado. ¿Qué he debido hacer mal?

css

ResponderCitar
Respondido : 01/10/2020 12:36 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola José Luis,

Entiendo, es posible que existan reglas que este priorizadas a estas nuevas que añades y por ello no se aplican los estilos. Prueba añadir dentro del código la palabra !important y ver si de esta forma se aplican los cambios, por ejemplo

/* modificar la barra del buscador*/
.et_search_outer .aws-container {
position: absolute;
right: 170px !important;
top: -12px !important;
}

div#et_top_search {
padding: 12px 6px 9px 16px !important;
}

Comprueba esto y nos comentas como ha ido todo

Un Saludo

 

ResponderCitar
Respondido : 01/10/2020 2:11 pm

wpdoctor-revisa-la-salud-de-tu-wordpress

JOSE LUIS
 JOSE LUIS
Usuario eminente

Hola he cambiado por lo que me has dicho... y nada.

Te pego todo lo que tengo en "CSS Adicional" por si hay algo que predomina.

 

.et_pb_blurb .et_pb_image_wrap {
display: block;
margin: auto;
max-width: 40%;
}

/* Oculto el SideBar de todas las páginas */
/*** Take out the divider line between content and sidebar ***/
#main-content .container:before {background: none;}

/*** Hide Sidebar ***/
#sidebar {display:none;}

/*** Expand the content area to fullwidth ***/
@media (min-width: 981px){
#left-area {
width: 100%;
padding: 23px 0px 0px !important;
float: none !important;
}
}
/*** Fin de oculto SideBar **/
/** Cambiamos el tamaño de letra en el texto de pedido realizado **/
p.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received {
font-size: xx-large;
margin-bottom: 60px;
}
/** Fin Cambiamos el tamaño de letra en el texto de pedido realizado **/
/** Subimos la capa de aviso de cookies **/
.lity.lity-opened.lity-inline.moove_gdpr_cookie_modal_open {
z-index: 999999;
}
/** Fin Subimos la capa de aviso de cookies **/

/**Quitamos carrito por defecto de Woocommerce **/
a.et-cart-info {
display: none;
}
/**Fin quitamos carrito por defecto de Woocommerce **/

/*Rafa: texto de crear cuenta al realizar el pedido */
.woocommerce-info {
text-align: center;
}

.woocommerce-info .button {
margin-top: 10px!Important;
float: none!Important;
}
/*Rafa: Fin texto de crear cuenta al realizar el pedido */

.buscar_productos a {
border:none!Important;
top:5px;
}

/* Rafa: Separo la descripción de la categoria de los productos */
header.woocommerce-products-header {
margin-bottom: 40px;
}
/* Fin Separo... */

/* Icono flotante de Whatsapp */
div#whatsapp {
position: fixed;
right: 10px;
bottom: 0px;
z-index: 9999999;
}
/* End whatsapp */

p.price {
margin-bottom: 15px;
}

/* OCulto el pie de página estandard de Divi */
footer#main-footer {
display: none;
}
/* Fin oculto pie de página */
/* Etiquetas de oferta */
.woocommerce span.onsale {
background-color: #fbc01d!Important;
color: #000;
font-size: large;
font-variant: all-small-caps;
padding: 1px 7px!Important;
}
span.woocommerce-Price-amount.amount {
color: #336699;
font-size: 20px;
}
/* Fin de etiquetas oferta */

div#et_top_search {
position: fixed!Important;
top: 35px;
right: 10px;
z-index: 99999;
background-color: #fbf783!Important;
width: 160px!important;
FONT-SIZE: X-SMALL;
PADDING: 6px 6px 5px 16px;
FONT-WEIGHT: 600;
CURSOR: POINTER;
}
.et_header_style_centered #et_search_icon:before {
top: 3px;
left: 12px;
position: relative;
}
.container.et_search_form_container.et_pb_search_visible {
z-index: 999999999!Important;
}
.et_search_outer .aws-container {
float: none!Important;
margin-right: auto!Important;
margin: auto!Important;
margin-top: 20px!Important;
}

/* Hago que el botón de búsqueda se desplace si la admin está abierta... */
.admin-bar #et_top_search {
top: 67px;
}
/* Ajustamos el carrito de la compra */
@media (min-width: 768px){
.woocommerce table.shop_table td {
width: 10px;
}
td.product-name {
min-width: 50vh;
}
}
/* En ajustamos carrito */
/* añadir buscador en el móvil*/
@media (max-width: 980px) {
.et_header_style_centered #et_top_search {
display:block!important;

}

.et_header_style_centered #logo {
margin-top: 2em;
}
}
/* fin añadir buscador en el móvil*/

/*Hacer que funcione el buscador en el móvil*/
@media(max-width:980px){
.et_header_style_centered .et_search_outer, .et_header_style_split .et_search_outer{
display: block!important;
position:static;
}

.container.et_search_form_container.et_pb_search_visible.et_pb_no_animation{
max-width: 500px!important;
}

.container.et_search_form_container.et_pb_search_form_hidden.et_pb_no_animation{
position: absolute;
}
}
/* Fin hacer que funcione el buscador en el móvil*/

/* modificar la barra del buscador*/
.et_search_outer .aws-container {
position: absolute;
right: 170px !important;
top: -12px !important;
}

div#et_top_search {
padding: 12px 6px 9px 16px !important;
}
/*Fin modificar la barra del buscador*/

ResponderCitar
Respondido : 01/10/2020 3:13 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Jose Luis,

He verificado en tu sitio web y veo que los cambios de aplicaron

imagen

Comprueba borrar la cache de tu navegador o ingresar como incógnito y verifica si puedes ver los cambios

Un Saludo

ResponderCitar
Respondido : 01/10/2020 3:18 pm

Gestor de Contraseñas - VPN Conexión Segura - Gestor 2FA (Segundo Factor de Autenticación

JOSE LUIS
 JOSE LUIS
Usuario eminente

@karen

He borrado los datos de navegación y se sigue viendo igual que se veía, yo no quiero que se despliegue al pinchar en "buscar producto", quiero que siempre este la barra del buscador desplegada.

ResponderCitar
Respondido : 01/10/2020 4:48 pm
Jhon
 Jhon
Soporte CMS Webempresa Moderator

Hola

En lugar de usar ese módulo de buscador tendrías entonces que usar otro, elimina ese buscador y verifica si puedes agregar widgets, ya que hay un widget que viene con WooCommerce que tiene la funcionalidad de buscador. (Buscador de productos)

Veo que usas Divi, posiblemente tengas que usar un Sidebar para eso, revisa: https://www.elegantthemes.com/blog/divi-resources/a-guide-to-using-sidebars-with-the-divi-theme-builder

Saludos.

 

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar mi Testimonio
¡Gracias!.

ResponderCitar
Respondido : 01/10/2020 6:17 pm

Cursos Gratuitos WordPress

JOSE LUIS
 JOSE LUIS
Usuario eminente

@jmarreros

Me da miedo cambiar el buscador porque recuerdo que tuve problemas para visualizarse en dispositivos móviles, sé que se añadió algo en CSS para que funcionase bien.

ResponderCitar
Respondido : 02/10/2020 8:52 am
Pepe
 Pepe
Soporte CMS Webempresa Admin

Hola Jose Luis.

Por favor, puedes decirnos qué plugin es el que estás utilizando para el buscador ?

 

Un saludo

 

 

Si nuestra ayuda te sirve déjanos tu testimonio y mejora así el posicionamiento de tu web:
Enviar Testimonio
¿Has probado WpCenter?, es nuestro nuevo manager de WordPress desde el propio cPanel sin necesidad de acceder a tu administración, te permitirá configurar actualizaciones automáticas y mucho más.
Pruébalo accediendo a tu cPanel > Aplicaciones Webempresa > WpCenter
¡Gracias!.

ResponderCitar
Respondido : 02/10/2020 12:02 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Por favor Iniciar Sesión o Registro