2015-03-03 62 views
0

我有两个菜单与安装在WordPress的二十十四默认插件:的WordPress:选择菜单中的header.php

  • 菜单法国
  • 菜单英文

我有使用两个模板取决于语言的不同header.php。

我想自定义header.php,所以我可以选择使用哪个菜单。

在header.php中有如下代码:

<nav id="primary-navigation" class="site-navigation primary-navigation" 
                    role="navigation"> 
    <button class="menu-toggle"> 
     <?php _e('Primary Menu', 'twentyfourteen'); ?> 
    </button> 
    <a class="screen-reader-text skip-link" href="#content"> 
     <?php _e('Skip to content', 'twentyfourteen'); ?> 
    </a> 
    <?php wp_nav_menu(array('theme_location'=>'primary','menu_class'=>'nav-menu'));?> 
</nav> 

我想要的目标 - 菜单英文 -

我不知道该怎么添加这样做。

回答

1

你可以使用下面的代码在你的PHP。

<?php 

    $args_en = array(
     'theme_location' => 'English Menu', 
     'menu_class'  => 'menu', 
     'menu_id'   => 'en_menu' 
    ); 

    $args_fr = array(
     'theme_location' => 'French Menu', 
     'menu_class'  => 'menu', 
     'menu_id'   => 'fr_menu' 
    ); 

?> 

<nav id="primary-navigation" class="site-navigation primary-navigation" role="navigation"> 
    <button id="switch_menu" class="menu-toggle"> 
     <?php _e('Primary Menu', 'twentyfourteen'); ?> 
    </button> 
    <a class="screen-reader-text skip-link" href="#content"> 
     <?php _e('Skip to content', 'twentyfourteen'); ?> 
    </a> 

    <?php wp_nav_menu($args_en);?> 
    <?php wp_nav_menu($args_fr);?> 

</nav> 

<?php wp_nav_menu($args_en);?>将呈现英文菜单。

<?php wp_nav_menu($args_fr);?>将呈现法国菜单。

因为$ arg_en当然

包含'theme_location' => 'english_menu'您将登记functions.php文件菜单,如下所示:

add_action('init','My_Menus'); 
function My_Menus(){ 
    register_nav_menus(
     array(
      'English Menu' => __('My English Menu'), 
      'French Menu' => __('My French Menu'), 
     ) 
    ); 
}; 

然后使用JavaScript,你可以设置一个默认的菜单显示。另一个将被隐藏。

假设你使用jQuery的,这是你需要使用的代码:

var fr_menu = $('#fr_menu'), en_menu = $('#en_menu'); 
en_menu.toggle(true); //shows english menu by default 
fr_menu.toggle(false); //hides english menu by default 

$('#switch_menu').on('click',function(){ 
    en_menu.toggle() 
    fr_menu.toggle() 
})