web-dev-qa-db-ja.com

メインメニューのHTML出力を変更する方法

メインメニューを出力すると、これは生成されるhtmlです。

<ul id="main-menu" class="links inline clearfix">
    <li class="menu-218 first active"><a href="/drupal/" class="active">Home</a></li>
    <li class="menu-294"><a href="/drupal/node/2">Page</a></li>
    <li class="menu-293 last"><a href="/drupal/node/1">page</a></li>
</ul>

ただし、次のようにメニューを完全に再構築したいと思います。

<nav id="main-nav" class="animate">
            <div class="grid__wrapper">
                <div class="grid t--np nrp">
                    <a class="button animate" href="#" title="Sign up">SIGN UP</a>
                    <a class="button animate" href="#" title="Login">LOGIN</a>
                    <a class="main-nav__button animate grid__item xl--1-5 l--1-5 sp s--tbp t--tbp" href="<?php echo $front_page; ?>">HOME</a>
                    <a class="main-nav__button animate grid__item xl--1-5 l--1-5 sp s--tbp t--tbp" href="#">LINK 1</a>
                    <a class="main-nav__button animate grid__item xl--1-5 l--1-5 sp s--tbp t--tbp" href="#">LINK 2</a>
                    <a class="main-nav__button animate grid__item xl--1-5 l--1-5 sp s--tbp t--tbp" href="#">LINK 3</a>
                    <a class="main-nav__button animate grid__item xl--1-5 l--1-5 sp s--tbp t--tbp" href="#">LINK 4</a>
                </div>
            </div>
        </nav>

メニューのHTML出力と内部のリンクを変更するにはどうすればよいですか？

理想的には、任意のメニューを要素として出力し、クラスとIDをそれぞれに渡すことができるようにしたいのですが、内部のリンクについても同様です。

また、メニューの最初の2つのリンクは、特定の画面サイズでのみ表示され、他のメニューリンクとはまったく異なるクラスを持つログインボタンとサインアップボタンです。これも可能ですか？

Theme_menu_tree関数とtheme_menu_link関数を変更してみましたが、PHPとDrupalの初心者なので、運がありません。

routesnavigation
3
Joe Taylor

投稿された回答はどちらも素晴らしい解決策であると確信していますが、どちらにもうまく対処することができませんでした。私の解決策は、カスタムを作成することでしたlinks__system_main_menuこのような私のテーマの関数：

function mytheme_links__system_main_menu($variables) {
$site_frontpage = variable_get('site_frontpage', 'node');
  $html = "<nav id='main-nav' class='animate'>\n";
  foreach ($variables['links'] as $link) {
      if($link['href'] == '<front>') {
        $html .= "<a class='main-nav__button animate grid__item xl--1-5 l--1-5 sp s--tbp t--tbp' href='" .$site_frontpage ."'>" .$link['title'] ."</a>";
      }
      else {
        $html .= "<a class='main-nav__button animate grid__item xl--1-5 l--1-5 sp s--tbp t--tbp' href='" .$link['href'] ."'>" .$link['title'] ."</a>";
      }
  }
  $html .= "</nav>\n";

  return $html;
}

フロントページリンクの個別のルールは、<front>は通常、aタグのhref内にあります。

ただし、クラスに関数を渡すことはできませんでした。私のページテンプレートのここから：

print theme('links__system_main_menu', array('links' => $main_menu, 'heading' => t('Main menu')));
0
Joe Taylor

ほとんどの場合、テーマは、template.phpのtheme_preprocess_page（）のいずれかでメニューをレンダリングし、page.tpl.phpに渡します。これがガーランドのやり方です。

https://api.drupal.org/api/drupal/themes%21garland%21template.php/function/garland_preprocess_page/7

https://api.drupal.org/api/drupal/includes%21theme.inc/function/theme_links/7

あなたの質問を考えると、ほとんどのサイトでは普通のことですが、カスタムテーマで終わる可能性が高いです。これに取り組む最善の方法は、preprocess_pageのロジックを変更して、好みに合わせて設定することです。

これは、モジュール空間でグローバルにtheme_links（）を変更またはオーバーライドするよりも持続可能で具体的です。

4
Josh Koenig

テーマが出力するメインメニューのhtmlを変更しようとする代わりに、テーマ設定からメインメニューを無効にし、メニューをレンダリングするためにメニューブロックモジュールを使用し、さらにメニュー属性モジュールを使用して追加する方が簡単です。 ID、クラス、スタイルなどの属性をメニュー項目に追加します。これらの追加リンク、サインアップとログインは、admin/structure/menu/manage/main-menu/addでメニュー構成自体を作成できます。

このようにして、メインメニューを希望どおりに見せるために必要なすべてのIDとクラスを備えた高品質のHTMLを作成できます。メニューブロックを任意のリージョンに割り当てることもできます。

https://drupal.org/project/menu_block

https://drupal.org/project/menu_attributes

2
Kari Kääriäinen