0

Tengo un problema con una web y no sé por que no se despliega el menú hamburguesa. Supongo que falta algo de código. Soy principiante, si alguien me hecha un mano, se lo agradecería. https://dronnavarra.es/ Esta es la web, como podeís ver no se despliega. Si me explicais que necesitais de forma concisa, intentaré facilitar. grcias

<!doctype html>
<html <?php language_attributes(); ?>>
<head>
    <meta charset="<?php bloginfo( 'charset' ); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">

    <?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<div id="page">
    <header class="header">
        <div class="pre-head">
            <div class="container">
                <div class="row">
                    <div class="col-sm-7 col-xs-12">
                        <?php if ( get_theme_mod( 'header_address_text' ) ): ?>
                            <span class="head-text-icon">
                                <i class="fa fa-map-marker"></i>
                                <?php if ( get_theme_mod( 'header_address_url' ) ): ?>
                                    <a href="<?php echo esc_url( get_theme_mod( 'header_address_url' ) ); ?>">
                                        <?php echo esc_html( get_theme_mod( 'header_address_text' ) ); ?>
                                    </a>
                                <?php else: ?>
                                    <?php echo esc_html( get_theme_mod( 'header_address_text' ) ); ?>
                                <?php endif; ?>
                            </span>
                        <?php endif; ?>

                        <?php if ( get_theme_mod( 'header_telephone_text' ) ): ?>
                            <span class="head-text-icon">
                                <i class="fa fa-phone"></i>
                                <?php if ( get_theme_mod( 'header_telephone_url' ) ): ?>
                                    <a href="tel:<?php echo esc_attr( get_theme_mod( 'header_telephone_url' ) ); ?>">
                                        <?php echo esc_html( get_theme_mod( 'header_telephone_text' ) ); ?>
                                    </a>
                                <?php else: ?>
                                    <?php echo esc_html( get_theme_mod( 'header_telephone_text' ) ); ?>
                                <?php endif; ?>
                            </span>
                        <?php endif; ?>
                    </div>
                    <div class="col-sm-5 col-xs-12">
                        <?php if ( get_theme_mod( 'header_socials', 1 ) ) {
                            get_template_part( 'part-social-icons' );
                        } ?>
                    </div>
                </div>
            </div>
        </div>

        <div class="mast-head">
            <div class="container">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="mast-head-wrap">
                            <div class="mast-head-left">
                                <?php if ( is_front_page() ): ?>
                                    <h1 class="site-logo">
                                <?php else: ?>
                                    <p class="site-logo">
                                <?php endif; ?>
                                    <?php if ( function_exists( 'the_custom_logo' ) ) {
                                        the_custom_logo();
                                    } ?>

                                    <?php if ( get_theme_mod( 'show_site_title', 1 ) ): ?>
                                        <a href="<?php echo esc_url( home_url( '/' ) ); ?>" class="site-logo-textual">
                                            <?php bloginfo( 'name' ); ?>
                                        </a>
                                    <?php endif; ?>
                                <?php if ( is_front_page() ): ?>
                                    </h1>
                                <?php else: ?>
                                    </p>
                                <?php endif; ?>

                                <?php if ( get_theme_mod( 'show_site_tagline', 1 ) ): ?>
                                    <p class="site-tagline"><?php bloginfo( 'description' ); ?></p>
                                <?php endif; ?>
                            </div>
                            <div class="mast-head-right">
                                <nav class="nav">
                                    <?php wp_nav_menu( array(
                                        'theme_location' => 'main_menu',
                                        'container'      => '',
                                        'menu_id'        => '',
                                        'menu_class'     => 'navigation'
                                    ) ); ?>
                                </nav>
                                <div id="mobilemenu"></div><a href="#mobilemenu" class="mobile-menu-trigger"><i class="fa fa-navicon"></i><span class="screen-reader-text"><?php esc_html_e( 'mobile-menu-trigger', 'technico' ); ?></span></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
2
  • Por favor lee Como preguntar para que corrijas tu pregunta y podamos ayudarte.
    – Tecnologer
    el 21 ene. 2019 a las 20:14
  • Lo siento, no sé que poner o buscar para que me podaís ayudar... el 21 ene. 2019 a las 20:18

1 respuesta 1

0
  1. La función <?php wp_head(); ?> sirve para colocar allí la cabecera de tu proyecto, allí deberías estar declarando el head y el header, ya que esta es una buena practica de wordpress.

  2. Acabo de correr tu codigo sobre una plantilla propia de wordpress y pude visualizar lo que esta sucediendo, tu menú no se esta desplegando por:

2.1:

                  <div class="mast-head-right">
                                <nav class="nav">
                                    <?php wp_nav_menu( array(
                                        'theme_location' => 'main_menu',
                                        'container'      => '',
                                        'menu_id'        => '',
                                        'menu_class'     => 'navigation'
                                    ) ); ?>
                                </nav>
                                <div id="mobilemenu"></div><a href="#mobilemenu" class="mobile-menu-trigger"><i class="fa fa-navicon"></i><span class="screen-reader-text"><?php esc_html_e( 'mobile-menu-trigger', 'technico' ); ?></span></a>
                            </div>

Este código es el encargado del menú la vista inferior para resoluciones 991px el menú desktop se oculta con la linea de código css:

@media (max-width: 991px)
header nav > div {
    display: none;
}

Si te das cuenta el menú que se hace visible es el:

<div id="mobilemenu"></div>

Que de hecho lo tiene vació, aqui dentro deberías tener nuevamente tu menú con personalización CSS, y luego mediante javaScript o JQuery deberías estar colocando las acciones o mas sencillo lee la documentación oficial de bootstrap.

<div id="mobilemenu">
                                 <?php wp_nav_menu( array(
                                            'theme_location' => 'main_menu',
                                            'container'      => '',
                                            'menu_id'        => '',
                                            'menu_class'     => 'navigation'
                                        ) ); ?>
</div>

Quedando mas o menos así, cabe destacar que esto es solo un ejemplo hecho con apuro...

3
  • Responder con únicamente enlaces se considera de baja calidad
    – user75901
    el 21 ene. 2019 a las 19:40
  • Más que una solución a la pregunta, tu respuesta parece un comentario. Por favor revisa: ¿Cómo responder correctamente?. Adicional, las respuestas cuya solución son un enlace externo se consideran de baja calidad, por favor agrega en tu respuesta la información más relevante de dicho enlace el 21 ene. 2019 a las 19:41
  • Adicional 2: El enlace que has puesto no resuelve la pregunta, ni siquiera es la documentación oficial de Bootstrap sino un tema basado en él. el 21 ene. 2019 a las 19:44

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.