[Resuelto] Añadir Buscar al menú movil de Generatepress

que mal se ve así...

add_filter( 'wp_nav_menu', 'my_wp_nav_menu', 10, 2 );
function my_wp_nav_menu( $nav_menu, $args ) {
if ( $args->theme_location === 'slideout' ) {
$nav_menu = aws_get_search_form( false ) . $nav_menu;
}
return $nav_menu;
}

Ya lo he conseguido, me faltaba activar una pestaña, pero queda muy raro y no consigo centrar el logo

Hola Nadinne, 

Entiendo que quieres centrar el logo en movil, si es asi prueba el siguiente codigo CSS y verifica como va todo

@media (max-width: 768px) {

.main-navigation.mobile-header-navigation .inside-navigation{
display: flex;
flex-wrap: wrap;
align-items: center;
}

.main-navigation.mobile-header-navigation .site-logo.mobile-header-logo{
order: 0;
flex: 0 0 100%;
width: 100%;
justify-content: center;
margin: 8px 0 6px;
position: static !important;
transform: none !important;
text-align: center;
z-index: 1;
}

.main-navigation.mobile-header-navigation .site-logo.mobile-header-logo img{
display: inline-block;
height: auto;
max-width: 180px; /* ajusta si quieres */
}

.main-navigation.mobile-header-navigation .menu-toggle{
order: 1;
flex: 0 0 auto;
}

.main-navigation.mobile-header-navigation .aws-container{
order: 2;
flex: 1 1 auto;
min-width: 0;
margin: 0 8px;
}

.main-navigation.mobile-header-navigation .menu-bar-items{
order: 3;
flex: 0 0 auto;
margin-left: auto;
}
.mobile-header-navigation.has-menu-bar-items .mobile-header-logo{
margin-right: 0 !important;
margin-left: 0 !important;
}
}

Un Saludo

a quedado muy bien y centrado pero lo ideal seria reducir el campo de búsqueda para que quedara en una sola línea el menú +buscar + carrito, lo he intentado pero solo consigo reducir el campo de búsqueda y la lupa se queda separada, ¿Es posible?

será depende del móvil usado tal vez?

Hola Nadinne, 

En este caso prueba elimina el CSS anterior y prueba el siguiente:

@media (max-width: 768px) {
.main-navigation.mobile-header-navigation .aws-container{
order: 2;
flex: 1 1 140px;
min-width: 120px;
max-width: 240px;
margin: 0 8px;
}

.main-navigation.mobile-header-navigation .aws-search-form{
display: flex !important;
align-items: stretch;
flex-wrap: nowrap;
width: 100%;
}

.main-navigation.mobile-header-navigation .aws-wrapper{
flex: 1 1 auto;
min-width: 0;
}

.main-navigation.mobile-header-navigation .aws-search-field{
width: 100% !important;
box-sizing: border-box;
}

.main-navigation.mobile-header-navigation .aws-form-btn.aws-search-btn{
flex: 0 0 42px;
width: 42px;
margin: 0 !important;
}

.main-navigation.mobile-header-navigation .aws-search-btn_icon{
display: flex;
align-items: center;
justify-content: center;
}
}

Un Saludo

no te decía eso, te decía el logo arriba solo, pero ahora viéndolo bien, me encanta. Cuanto vales Karen.

Muchísimas gracias y buenas noches que te lo has ganado.

Hola Nadinne,

Ecantados de ayudar, si necesitas alguna otra cosita puedes crear un nuevo tema y con gusto lo vemos.

Un saludo 🖐️