[Помогите] Как убрать циклические ссылки из меню

Тема в разделе "Wordpress", создана пользователем Rudoy1488, 20 апр 2015.

Модераторы: DzSoft, Sorcus
  1. Rudoy1488

    Rudoy1488 Постоялец

    Регистр.:
    29 июл 2013
    Сообщения:
    135
    Симпатии:
    57
    WordPress 4.1.1

    Есть вот такое меню, при переходе на пункт меню нужно что бы ссылка меню данной страницы на который в данный момент находится пользователь была не активна. Подскажите как это можно сделать?
    Код:
    <div class="menu1">
        <table width="270" cellpadding="4px" cellspacing="6px">
      <tr>
        <td><a href="http://alpograd.ru/mojka-okon.htm">Мойка окон</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/mojka-fasada.htm">Мойка фасада</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/germetizaciya-shvov.htm">Герметизация швов</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/snyatie-koshki-s-dereva.htm">Снятие кошки с дерева</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/udalenie-derevev.htm">Удаление деревьев</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/zamena-steklopaketov.htm">Замена стеклопакетов</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/pokraska-metallokonstrukcij.htm">Покраска металлоконструкций</a></td>
       
      </tr>
    </table>
    <table width="270" cellpadding="4px" cellspacing="6px">
      <tr>
        <td><a href="http://alpograd.ru/remont-fasada.htm">Ремонт фасада</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/uteplenie-fasada.htm">Утепление фасада</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/sbivanie-sosulek.htm">Сбивание сосулек</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/uborka-snega-s-krysh.htm">Уборка снега с крыш</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/ustanovka-vodostokov.htm">Установка водостоков</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/zamena-ostekleniya-na-teploe.htm">Замена остекления на теплое</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/svetoprozrachnye-konstrukcii.htm">Светопрозрачные конструкции</a></td>
       
      </tr>
    </table>
    <table width="340" cellpadding="4px" cellspacing="6px">
      <tr>
        <td><a href="http://alpograd.ru/podem-gruza.htm">Подъем груза</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/pozdravleniya-v-okno.htm">Поздравления в окно</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/montazh-naruzhnoj-reklamy.htm">Монтаж наружной рекламы</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/demontazh-dymovyx-trub.htm">Демонтаж дымовых труб</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/montazh-demontazh-metallokonstrukcij.htm">Монтаж-демонтаж металлоконструкций</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/ustanovka-i-obsluzhivanie-kondicionerov.htm">Установка и обслуживание кондиционеров</a></td>
       
      </tr>
      <tr>
        <td><a href="http://alpograd.ru/drugie-vidy-rabot.htm">Другие виды работ</a></td>
       
      </tr>
    </table>
        </div>
     
  2. vytyacom

    vytyacom Постоялец

    Регистр.:
    19 ноя 2014
    Сообщения:
    136
    Симпатии:
    55
    Меню самописное? статическое?
    Возможно стоит сделать на базе вордпрессовского меню, он сам автоматом указывает активный пункт меню.
    Если статическое, то проще всего видимо яваджс/джквери проверять страницу.

    Такой код возможно, должен работать

    Код:
    var pageUrl = jQuery(location).attr('href');
    jQuery('div.menu1 td').find('a').each(function(){
      var menuLink = jQuery(this).attr('href');
      if(menuLink == pageUrl) {
        jQuery(this).addClass('active-menu');
      };
    });
    
     
  3. vytyacom

    vytyacom Постоялец

    Регистр.:
    19 ноя 2014
    Сообщения:
    136
    Симпатии:
    55
    Соответственно у ссылки будет класс .active-menu
    Ну и далее ее можно стилизовывать.

    Ну а сделать неактивность проще в данном случае чтото вроде этого
    .active-menu {
    color: #ccc;
    cursor: default;
    }

    Так цвет будет серый (можно на любой поменять) и курсорвместо пальца - обычная стрелка.
     
  4. Rudoy1488

    Rudoy1488 Постоялец

    Регистр.:
    29 июл 2013
    Сообщения:
    135
    Симпатии:
    57
    Вордпресовское подключить нет возможности, слишком нагружает систему.

    Я не очень силен в скриптах подскажите последовательность действий пожалуйста

    Ваш скопировать js фаил
    Подключить
    ...)
     
  5. vytyacom

    vytyacom Постоялец

    Регистр.:
    19 ноя 2014
    Сообщения:
    136
    Симпатии:
    55
    Ну, если у вас всё статично то нужды соблюдать вордпрессовские требования к подключаемым скриптам видимо нет, можете прям гденибудь в редакторе футера добавить код перед закрывающимся тегом </body>
    Код:
    <script>
    jQuery(document).ready(function() {
    var pageUrl = jQuery(location).attr('href');
    jQuery('div.menu1 td').find('a').each(function(){
      var menuLink = jQuery(this).attr('href');
      if(menuLink == pageUrl) {
      jQuery(this).addClass('active-menu');
      };
    });
    })
    </script>
    
    Да, кстати, надеюсь что джквери уже подключен, а то работать не будет :)

    В редактор стилей
    Код:
    .active-menu {
    color: #ccc;
    cursor: default;
    }
    
    Цвет можете поменять
     
    Rudoy1488 нравится это.
  6. Rudoy1488

    Rudoy1488 Постоялец

    Регистр.:
    29 июл 2013
    Сообщения:
    135
    Симпатии:
    57

    к сожалению не работает. Больше нет никаких вариантов?