Не выпадает выпадающее меню в Blogger - решение

выпадающее менюПривет, друзья. При установке горизонтального выпадающего меню в Blogger непосредственно под заголовком блога возникает проблема. Оно просто не выпадает. При наведении на пункт меню не открываются вкладки подпунктов.
Фиксированные выпадающие меню в верхней части блога или над гаджетом сообщения работают без проблем. Очень много вопросов, почему же не выпадает выпадающее меню именно в гаджете под названием.

Можно, конечно, подключать скрипты и библиотеки. Мороки много и не всегда это оправдывает желаемое. Не отчаивайтесь. Просто отличный вариант предложил в своё время автор этого блога. Ваши красивые менюшки будут с лёгкостью выпадать как надо, если внести совсем небольшие изменения в шаблоне блога. Не нужна возится с z-index, менять позиционирование и прочее. Для начинающих это вообще тьма непроглядная.

 Давайте уже начнём. У вас есть код выпадающего меню. Устанавливаете его в гаджет HTML/JavaScript и перетягиваете под заголовок блога. Сейчас нужно узнать идентификатор гаджета. Есть 2 способа. Первый, которым я пользуюсь. 
Правой кнопкой мыши нажимаем просмотреть код и подводим стрелку к установленному меню. Подсвечивается строка и видим номер гаджета. У меня это HTML2. Скриншот.


Для новичков, наверно, будет легче другой способ. Откройте виджет вашего меню. Левой кнопкой мыши подсветите строку до конца как показано на скриншоте. Там будет его ID.



Когда узнали, под каким номером гаджет нашего меню идём во вкладку тема ( шаблон) вверху открываем список виджетов и нажимаем на id вашего виджета. Нас сразу перебрасывает к началу всей секции. Нажимаем на чёрную стрелочку и затем ещё на одну, чтобы открыть весь код.



И на этом участке, чуть ниже, находим строку такого содержания.

<b:section class='tabs' id='crosscol-overflow' showaddelement='no'>


Заменим в ней значение tabs и crosscol-overflow на другие, допустим так.

<b:section class='menu' id='menu_1' showaddelement='no'>


Сохраните шаблон. Сейчас меню должно выпадать. У меня только на одном стандартном шаблоне это сработало. На других всё равно ни как не выпадало. Нужно сделать ещё одно изменение там же в шаблоне (теме) блога.  Находим строку ]]></b:skin>, открываем все стили CSS (чёрная стрелочка слева) и находим селектор .tabs-outer. Убираем у него строчку overflow: hidden; Смотрите скрин.


Всё. Сохраняем шаблон и меню перестало капризничать. Все вкладки и пункты выпадают как надо. 




Теперь можно брать любое, понравившееся вам, горизонтальное выпадающее меню, которых предлагается масса, и спокойно устанавливать под заголовок блога. 


TEXT.RU - 100.00%
Всем удачи.Спасибо за визит и до новых встреч.

Введите Ваш email


2 комментария:

  1. Вика привет. Я об этом способе знаю, даже тестировала на блогах разных шаблонов. Все равно вкладки не выпадают. Все зависит от шаблона. В двух демо блогах и без этого варианта вкладки прекрасно открываются, даже с установленным гаджетом "страницы". Единственный выход устанавливать над заголовком.

    ОтветитьУдалить
    Ответы
    1. Ольга, я на всех тестовых пробовала. Выпадает везде если убрать в стилях overflow: hidden;. Когда горизонтальное меню ставим код попадает в секцию tabs.
      поскольку идентификатора не должно повторятся в коде шаблона(один элемент - уникальный идентификатор). Возможно menu повторяется в шаблонах и нужно задать другое что-то.

      Удалить

Пользовательский поиск