Avisos
Vaciar todo

[Resuelto] Responsive Home  

 
Lourdes
 Lourdes
Reputable Member

En el home tengo dos apartados que necesito hacer responsive para el movil:

Banner y barra de busqueda (es un widget)

Adjunto capturas

 

Gracias.

 

IMG 7682
IMG 7681

Contenido solo visible a usuarios registrados

Respondido : 15/07/2021 12:27 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Lourdes, 

Al verificar el sitio web veo que los elementos se adaptan de forma correcta a versiones móviles, puedes indicarnos exactamente que es lo que deseas modificar o no se visualiza bien, de esta forma podemos ayudarte con mayor detalle

Un Saludo 

Respondido : 15/07/2021 12:44 pm

Cursos Gratuitos WordPress

Lourdes
 Lourdes
Reputable Member

@karen

Si claro, En el banner necesito que la imagen tenga menos altura y la frase 'Welcome to...' mas pequeña. Si fuese posible ocultar para movil el pequeño 'Check our special ....'

En la herramienta de busqueda que los campos check in y check out esten en la misma linea (50%, 50%)

 

Gracias.

Respondido : 15/07/2021 12:53 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Lourdes, 

Entiendo, verifica si el siguiente código CSS te permite modificar lo que necesitas


@media only screen and (max-width: 600px) {
.front-page-header .front-page-slider-slide .title {
font-size: 30px;
line-height: 30px;
margin: 0;
}

.front-page-header .front-page-slider-slide .slide-image > * {
height: 70%;
width: 100%;
object-fit: cover;
}

.description {
display: none;
}
.front-page-sidebar-wrapper .widget_mphb_search_availability_widget .mphb_widget_search-check-out-date, .front-page-sidebar-wrapper .widget_mphb_search_availability_widget .mphb_widget_search-check-in-date {
flex: 1 0 50%;
}
}

Debes añadirlo en el apartado Apariencia -> Personalizar -> CSS Adicional

Un Saludo 

Respondido : 15/07/2021 1:03 pm

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

Lourdes
 Lourdes
Reputable Member

@karen Gracias, Casi pero ahora queda un espacio vacio (Adj. captura)

Seria posible quita el place holder de check in y check out?

IMG 7690
 
Respondido : 15/07/2021 1:40 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Lourdes, 

No veo una opción adecuada con CSS para reducir el alto de este slider y que todos los elementos se vean de forma correcta, verifica si dentro de las opciones del tema tienes alguna configuración que te permita establecer el alto para esta sección en móvil. 

Con respecto a los placeholder dentro de los inputs para eliminarlos debes hacerlo directamente en la plantilla lo por o que este cambio debe ser de forma global, una opción que puedes hacer es reducir el tamaño de la fuente de forma que se muestre de forma correcta para móvil, para ello tendrás que añadir el siguiente código dentro de las opciones de media queries para móvil

::placeholder {
font-size: 12px;
}

Un Saludo 

 
Respondido : 15/07/2021 1:57 pm

Lourdes
 Lourdes
Reputable Member

@karen Es porque el slider creo que esta creado como mas bien una pagina. Pero no localizo donde esta... Lo puede mirar si encuentra como y donde esta realmente el banner del home?

El cambiar el tamaño del place holder me ha funcionado, gracias!

 

Respondido : 15/07/2021 2:47 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Lourdes, 

Dentro de las opciones gratuitas del tema no veo esta opción, en este caso puedes verificar con los desarrolladores del tema para que te indiquen de forma precisa como puedes modificar esto para móvil.

Ten en cuenta que cuando se desarrolla un tema los desarrolladores definen sus estilos para las diferentes vistas por lo que encontrar cuál es la clase o la regla que afecta este estilo puede ser un poco difícil de encontrar.

Un Saludo 

 

Respondido : 15/07/2021 3:17 pm

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

Lourdes
 Lourdes
Reputable Member

@karen De acuerdo muchas gracias, voy a contactarles. El resto todo resuelto =)

Respondido : 15/07/2021 4:36 pm
Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

Hola Lourdes, 

De acuerdo, con esto podemos dar el tema como solucionado.

Escríbenos si tienes cualquier otra consulta

Un Saludo 😊 

Respondido : 15/07/2021 4:42 pm

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