Добавить идентификатор в пункты меню главного меню drupal - PullRequest
Новая
       4

Добавить идентификатор в пункты меню главного меню drupal

1 голос
/ 15 августа 2011

Прикрепленный к моему шаблону, который я получил от моего слайсера, был файл javascript для раскраски пунктов меню. Теперь мне нужно преобразовать шаблон в шаблон Drupal. Javascript основан на том факте, что каждый пункт меню имеет идентификатор, в соответствии с порядком пунктов. В Drupal пункты меню имеют только классы (menu-341, menu-342 и т. Д.). Я знаю, что могу настроить javascript, чтобы он получал пункты меню по классам, но на самом деле это невозможно, потому что тогда мне нужно полностью расстроить весь файл, что я пытаюсь предотвратить.

Так можно ли добавить идентификатор для всех моих пунктов главного меню, например, «menu-item-1», «menu-item-2» и т. Д.? Должен ли я сделать это в template.tpl.php или напрямую изменить вывод в page.tpl.php?

Спасибо за помощь.

EDIT: Я в отчаянии, потому что я просто не знаю, как это исправить. Есть ли другой способ раскрасить мои пункты меню? Сценарий, который я использую, выбирает пункты меню по их возрастающему идентификатору (custom-menu-item-id-x) и дает им фон из массива, который ассоциируется с «x» идентификатора. Четыре цвета: цвет 1 для элемента 1, цвет 2 для элемента 2, цвет 1 для элемента 5 и т. Д. ..... Разве нет другого способа это исправить? Не могу ли я позволить jQuery автоматически выбирать их в порядке возрастания (первый встреченный элемент получает первый фон, второй фон - второй фон и т. Д.)? Пожалуйста, придумайте идеи. Я все перепробовал, на мой взгляд.

Это мой текущий скрипт: 

//Sequence of the background colors from the menu items, from left to right.
var backgrounds = ["blue", "green", "pink", "purple"];

//Gives the menu items a style when hovering over it, in the sequence of the setting in the variable 'backgrounds', on top.
jQuery(document).ready(function MenuColor($){
    for (var i = 0; i <= 10 ; i++) {
        document.getElementById("custom-menu-item-id-" + (i + 1)).onmouseover = (function(valueOfI){ return function() {
        this.style.background = "url('images/" +  backgrounds[(valueOfI % backgrounds.length)] + ".jpg')";
        }; })(i);
        var ActiveLi = $('.active').attr('id');
        if("custom-menu-item-id-" + (i + 1) != ActiveLi) {
            document.getElementById("custom-menu-item-id-" + (i + 1)).onmouseout = function() {
                this.style.background = 'none'; 
            }
        }
    }
});

Ответы [ 3 ]

0 голосов
/ 17 августа 2011

Но я наконец-то справился сам.Сначала я вставил этот фрагмент кода (скопированный из шаблона Bartik page.tpl.php) в мой page.tpl.php: 

<?php if ($main_menu): ?>
  <div id="main-menu" class="navigation">
    <?php print theme('links__system_main_menu', array(
      'links' => $main_menu,
      'attributes' => array(
        'id' => 'main-menu-links',
        'class' => array('links', 'clearfix'),
      ),
      'heading' => array(
        'text' => t('Main menu'),
        'level' => 'h2',
        'class' => array('element-invisible'),
      ),
    )); ?>
  </div> <!-- /#main-menu -->
<?php endif; ?>

Это поместило «главное меню» в нужное место.НО, все, что я изменил в menu.inc или template.php, к нему не относится.Таким образом, вместо того, чтобы разместить этот код там, я поместил «главное меню» БЛОКА в соответствующий регион, и внезапно я смог изменить все.

Так что в моем template.php я добавил эту функцию, которая написалаидентификатор для предметов. 

<?php
/**
 * Returns HTML for a menu link and submenu.
 *
 * @param $variables
 *   An associative array containing:
 *   - element: Structured array data for a menu link.
 *
 * @ingroup themeable
 */
function exofes_menu_link(array $variables) {
  $element = $variables['element'];
  $sub_menu = '';

  if ($element['#below']) {
    $sub_menu = drupal_render($element['#below']);
  }
  static $item_id = 0;
  $output = l($element['#title'], $element['#href'], $element['#localized_options']);  
  return '<li id="custom-menu-item-id-' . (++$item_id) . '"' . drupal_attributes($element['#attributes']) . '>' . $output . $sub_menu . "</li>\n";
}
?>

И ЧТО РАБОТАЕТ: D!

0 голосов
/ 03 октября 2013 
function THEME_preprocess_page(&$vars) {
  $menu = menu_navigation_links('menu-your-custom-menu-name');
  $vars['custom_menu'] = theme('links__menu_your_custom_menu_name', array('links' => $menu));
}
0 голосов
/ 15 августа 2011

Быстрый поиск предоставляет несколько вариантов, включая то, что выглядит как ответ . И да - шаблонные функции на 100% разработаны для такого рода вещей. :)

РЕДАКТИРОВАТЬ - Нет проблем, но ваш ответ на самом деле есть в комментарии RichTheGeek. Он связал новую функцию D7, и в ветке комментариев для этого приведен пример, который добавляет классы к элементам меню на основе их заголовка. Это не блестящий пример, поскольку использование preg_replace является «тяжелым» способом, но я не понимаю, почему это не сработает. все, что я сделал, это поменял "class" на "id" в строке 11.

Не забудьте заменить «yourtheme» реальным системным названием используемой темы. 

  function yourtheme_menu_link(array $variables) {
  $element = $variables['element'];
  $sub_menu = '';
  $name_id = strtolower(strip_tags($element['#title']));
// remove colons and anything past colons
  if (strpos($name_id, ':')) $name_id = substr ($name_id, 0, strpos($name_id, ':'));
//Preserve alphanumerics, everything else goes away
  $pattern = '/[^a-z]+/ ';
  $name_id = preg_replace($pattern, '', $name_id);
  $element['#attributes']['id'][] = 'menu-' . $element['#original_link']['mlid'] . ' '.$name_id;
  if ($element['#below']) {
    $sub_menu = drupal_render($element['#below']);
  }
  $output = l($element['#title'], $element['#href'], $element['#localized_options']);
  return '<li' . drupal_attributes($element['#attributes']) . '>' . $output . $sub_menu . "</li>\n";
}
?>
...