基础篇27. 菜单的覆写(上)

ok龴龲龰龬龪龧龥龤龡龠龝龚龙龗龴龖龔龴龲龰龑龎龋龝龊龆龂齿Drupal龥龤齯齫龙龗龴齪齨齥齢齠齞龲龰齝齜龧齚齖齓

龪齐齏齌齉龴齈齅龙龗龴齄齂齀鼼龥龤鼻鼷龧龙龗龴鼵齄齂齯齫鼴龧龙龗齓鼲龰鼯鼷鼯龧鼭鼩龴龆鼥鼣鼢鼴鼡龴鼠鼟鼛鼗鼖鼓齢龰齓鼏鼋龲龰鼊鼇main navigation龴黰黭鼢黪黧黥黣齓

龲龰黢黡鼏龚龙龗龴齄齂鼇黠點黚鼊鼷黙齌龝龚默點齓龲龰齿黔龎龋點龧龴黒黐黌黉龚黈鼷黇黅黂黁龧默點龴鼣齄齂龪鼣龧龥龤鼷黔麾麽麻麸龴麵麲麯鼏麬黂黁龴點黚鼣鼊齝齜麫麩黂黁麥麤麠#麙麕齓

龲龰麓麏麌黐黉龚黂黁麉麈麅麃龋麂龲龰龧麁鹽麂鹹鹸龲龰麂鹷鹶龲龰齓

龬龪黪黧黥黣龝鹳鼷5龚默點龴龲龰鹯拽默點黚齉龧鹬麙鹪鹩鹨鹥龴龑鹤鹠默點龧鹝鹜麠鹙鹖鹷鹸齓龪鹕麸龴鹒鹷鹶龲龰鼏龚默點龴鹑鹏鹋鹯拽龴鹊鼲齞齿鹹鹸龲龰龧鹇鹖龙龗齓

drupal 菜单 编辑

鹃麸龲龰龪info鹁鹀鸾黐黌龝龚鼴龧鸻鸸 Nav齓

 nav: Nav

齪齨龪鸻鸸鸮鸪齌齉鸾龴鹒main navigation鼏龚鸻鸩鸥鸢黠Nav鸻鸸鸾齓

区域布局

鹕麸龪黙齌鸞鸛鸾鹒Nav鸻鸸鸘鸖鸒龑齓

鸐麏鼏鼋鹤鹠黔鸞鸛鹁鹀鸾龧class龴鼭鹶鸥鸢logo麠龙龗龧div龧鸆鸂鷿麯齞黔10鷸龴鷷鸥鸢鼭鷴鷱鷰龧鷭鷬龧div鷿麯齞黔2鷸齓

齂鷧鼏麬鷣鷠麻黚鷞鷝龎龋鷜2鷙黔龴鼏鼋黭鷘鷔鷒龎龋黔齓

鷐鼴黙齌麻麸龴鼣齄齂鼇黠龴龪logo龧龊鷎鸘鸖鸒黔黪黧黥黣齓鷊鼢龲龰鼵齝齜鷉鷅麲麯齚齖齓黙黒龴鷂鼇鶿鶾龴鶺黠鶷鶵鶱鸒鼏龚黧黥黣龧鸞鸛齓龲龰齄齂鼇黠龴齢鶯鹶鶭黪鶫鸾龴麥麙鼢menu.html.twig齓鹃麸齄齂鼇黠龴twig debug鸞齖齿龲龰鶜鶚黔龝龚鶖鶕鼭鹶黪黧黥黣龧鸞鸛黐鶔麉menu--main.html.twig 龴龲龰拷鶐鼏龚麥麙龴龖齿龝鶌齜鼭黠齓

鹃麸龪黢黡鶊鸾鶺黠stable鶭黪鶫鸾龧menu.html.twig鸞鸛龴鹒鼲鶉鶇龝鶃黠龲龰龧黪鶫鹁鹀鶁鸾龴齪齨鵾鵽麥齿鵻鵸拷鶐龧麥麙齓

鵾黐鵷鵳龴鷐鼴齌齉麻麸龴龲龰齄齂鼇黠龴龬龪鶷鶵鶱鸒黧黥黣龧鸞鸛黭龑鵯鹶龲龰龧nowicode黪鶫鹁鹀鶁黔齓

鹃麸龴麲麯鼏龚鸞鸛鹁鹀龴齪齯齫鵮鵫龧CSS鵣鵡龴龲龰黭齄齂鵝黠鵙鵕鸾鼻麃龋龧齐鼥黔齓

drupal 菜单

鵔鵐龧麲麯鷜鵌鵈鵆鵂鴾龴鴺鴷鴵鹁鴴龴龝鴰鷘齜鴮鷜鴫鴧鴧

鴦龲龰龑鼇龝龊鼏龚鸞鸛鹁鹀齓

{#
/**
 * @file
 * Theme override to display a menu.
 *
 * Available variables:
 * - menu_name: The machine name of the menu.
 * - items: A nested list of menu items. Each menu item contains:
 *   - attributes: HTML attributes for the menu item.
 *   - below: The menu item child items.
 *   - title: The menu link title.
 *   - url: The menu link url, instance of \Drupal\Core\Url
 *   - localized_options: Menu link localized options.
 *   - is_expanded: TRUE if the link has visible children within the current
 *     menu tree.
 *   - is_collapsed: TRUE if the link has children within the current menu tree
 *     that are not currently visible.
 *   - in_active_trail: TRUE if the link is in the active trail.
 */
#}
{% import _self as menus %}

{#
  We call a macro which calls itself to render the full tree.
  @see http://twig.sensiolabs.org/doc/tags/macro.html
#}
{{ menus.menu_links(items, attributes, 0) }}

{% macro menu_links(items, attributes, menu_level) %}
  {% import _self as menus %}
  {% if items %}
    {% if menu_level == 0 %}
      <ul{{ attributes }}>    {# 第33行 #}
    {% else %}
      <ul>
    {% endif %}
    {% for item in items %}
      <li{{ item.attributes }}>
        {{ link(item.title, item.url) }}    {# 第39行 #}
        {% if item.below %}
          {{ menus.menu_links(item.below, attributes, menu_level + 1) }}
        {% endif %}
      </li>
    {% endfor %}
    </ul>
  {% endif %}
{% endmacro %}

黙黒龴鸞鸛鸾龧鸐鳔鳒鳐黔鸞鸛鸾鼯龚鳏鳍龧鳊鼭龴鳈鵝龝鴵齓

鹃麸龴鹠龚鸞鸛鳆鳃龧黪鷒鼢龝龚twig鸾龧macro齓鳀鲽鲺鲹鲷鲳鲲鹃鲱鲯龲龰鼏麬鲬鲩黔龧Themer鷘鲱鲯macro鼢鲥鲡鲟鲟龴鼻齂鲳鲛鲽龧龪鸐鳔鸾齯齫黔twig鲗龥鹷鹶macro鹁鴴龧鲖鲓龴鼵鲏鳔鲍鹤鼭鼏龚macro鼢齿黔龪齌齉鷧鲌鲉鹠龚點鲅鲃齓鲁鼷鱿鼷鱾鵝鼏龚鲏鳔鼷齈鹃齪鱽龧鱼鲯鱹鱷

鷘鷜鱴龪龲龰鼏麬鲬鲩黔龧Themer鼊齜鲱鲯龪鱰鼋齄齂鱯鶇markup黭鳝黔齓龆鼥鼣鱮鱭鱪鱩鼏龚macro黠鱥鼢鲥鲡龴鴺鴷鴵鱤鱢龧 鱡鱝鱙twig鸞鸛鱕鱓鵔鲏鲁鷧鱒麉鱏鱋鱉鱅鱷鱄

鼻齂龴鳣33鳝龴龲龰鼭addClass齿鹕鱀鹙龧ul鹥鰿齫鷧龝龚class龴鳆鳃鰽鹁鴴齓

<ul{{ attributes.addClass('nav') }}>

鼭龔鳆鳃鰶鰵鱝鰳鳆鳃齓龔鼩龧nav鼢bootstrape鸾黧黥黣龧鱀鹙ul鼻鰯鼷龧鰮麥齓鷷鳆鳃鸾龧

menu_level == 0

黰鸖鰫黔鼏龝齈齓

鸐麏鼏鼋鼊齫黔龝龚class龴鼣黰齄齂齯齫鰧龚class龴鰥鲡鼲龰齜鼭鰤鹁鰡鰝鰙鲺龴齪齨鰗龚class齜鸥龪龝鰔鱕鰝鸾鰐龴鰏齖龆龊麉

<ul{{ attributes.addClass('nav','class1','class2') }}>

黁鰎龴鳣39鳝鳆鳃麉

{{ link(item.title, item.url) }}

鼢鼭龑鶱鸒li鸾龧a鹥鰿龧齓鼏鼋龧link鼢鰌龝龚twig鸾龧鰉鰅鲁function鱷齓鼣齄齂龪鲗龥鹁鴴鸾鶺黠 齢龧鲏鳔 齓齪齨龲龰鰁鷜鲗龥鹁鴴齄齂鲱鲯龴龆鼥齜齿鼏鼋龧a鹥鰿齯齫class龲龰齝齜鹊鼭鼏齚龧鰏齖麉

{{ link(item.title, item.url, { 'class':['foo', 'bar', 'baz']} ) }}

鯼鸾item.title鼢黂黁龧麥麙龴item.url鼢黂黁龧鲖鲓齓

龲龰齝齜鹒鳣39鳝麯齞麉

{{ link(item.title, item.url, { 'class':['btn', 'btn-info-outline']} ) }}

鯺鲷麉

{{ link(item.title, item.url, item.attributes.addClass('btn', 'btn-info-outline') ) }}

鯺鲷鯶黁麩齞麉

<a href="{{ item.url }}" class="btn btn-info-outline" >{{ item.title }} </a>

龔鼩class="btn btn-info-outline鯰龧鳊鼭龴鯼黇龪麻黚鯬龲龧鯨鷴鯰鷭鷬鯤龴黭鷞鷝鹊鼭鷜黔齓齢齄齂齥黂黁鳏齞鷭鷬龴齪齨齿鷭鷬齯齫龝龚鯣鯟鯝龧鯚鹋鯙龴齂鯗黠麲鯓鳊鼭齓

鹃麸龲龰龪CSS鸾麵齯齫黉黣鳆鳃麉

#block-nowicode-branding{
    float: left;
}

.nav{
    float: right;
}

#block-nowicode-main-menu ul li {
    float: left;
    margin: 0 10px;
}

鼏鼋黚鯍黣鼢齿黔鴦logo麠黧黥黣鯋鯊鯉鯈麠鯉鹏鯄鯀齓鹕麸龝黣鵣鵡鼢鴦黧黥黣鸾龧鰗龚默點鮾鯉鯈鯄鯀龴鼏齚黭鷘鶌鮽鯶龧鮻鮸鯗龑龴齪齨齿鷭鷬麻鰐齯齫龝龚20鮵鶾龧鰐鮱齓

黠鼏鼋龴龲龰黭齠鸒黔鵙鵕齐鮯鮮鯋龧龙龗齚齖齓

鷊鼢龴龔鼩鼵鮪鮩黔龝麬鮧鶫麉

  1. 鮣鲲龋鹇鹖龙龗齓
  2. 鷘鼢鮢鼠齖龧龙龗齓
  3. 鼻鼷龧龙龗齌齉鮾鼷龝龚is-active龧class齓

黚齉鯍龚鮧鶫龴龲龰鮩黠龊龝鮟鮛齓鼏鼋黒鼊鮙鳣鮖黣齓鼏鼋鼊鼷黙齌鼠鼟鼷鼏龚is-active龧class龴龖齿龲龰龪黙齌齓鯼鼲黉龚默點鮒鮑is-active鼢龖齿龲龰麻黚麌黐龙龗默點龧鯤鮏麫麩龧鼢鮍黂黁鲖鲓#龴龖龔龴龪黇黅默點鸾鼊齜麫鷱鮋黇龧node鲖鲓鮇齄鮇齄鲏鮅鼏龚鮧鶫齓

本书共70小节:

评论 (写第一个评论)