К основному контенту

Как добавить свой виджет верхнего меню в блог на Blogger

Есть у меня в Блоггере другой блог, в который я решила добавить верхнее горизонтальное меню навигации. Можно было бы воспользоваться существующим местом для виджета горизонтального меню, но я бы не хотела его фиксировать: в новых темах на Блогспот имеется стикер с названием блога, который немного конфликтует с фиксированным меню. Меню должно прокручиваться вместе со страницей, однако с помощью стандартного места для виджета горизонтальное меню без фиксации можно установить только после названия блога и описания.

Как добавить свой виджет верхнего меню в блог на Blogger

Что делать? Добавить место для виджета горизонтального меню. Для этого необходимо зайти в HTML-код своей темы и найти строку <body> (или <body class='container'>, в зависимости от темы). Не стану объяснять, как это сделать. Если вы дошли до жизни такой, что добавляете в блог новые места для виджетов, вы должны хорошо разбираться и в настройках блога, и в HTML.

Итак, после тега <body> необходимо добавить следующие строки.

<!-- Верхнее горизонтальное меню -->
<nav role='navigation'>
   <b:section class='clearboth' id='top_nav_bar' name='Верхнее меню' showaddelement='false'/>
</nav>
Как добавить свой виджет в блог на блогспоте

В теме Contempo код можно добавить чуть ниже, после следующих строк

      <div class='page'>
        <div class='bg-photo-overlay'/>
        <div class='bg-photo-container'>
          <div class='bg-photo'/>
        </div>

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

Как добавить свой виджет в блог на блогспоте

В теме Contempo вне зависимости от того, куда вы добавили код, сразу после тега <body> или после контейнера <div class='bg-photo'/>, в настройках дизайна место для верхнего меню будет находиться в правом столбце. Причина заключается в особенностях сайдбара этой темы.

Как добавить свой виджет верхнего меню в блог на Blogger

При желании в коде выше можно задать showaddelement='true'. Тогда в позиции верхнего меню появится окно с надписью «Добавить гаджет».

Как добавить свой виджет в блог на блогспоте

Добавить в верхнее меню можно только виджет «HTML/JavaScript». Виджет «Страницы» представляет пункты меню в горизонтальном виде только под названием и описанием. В любом другом месте блога список страниц будет вертикальным.

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

Вам также может понравиться

Комментарии

  1. Не зная броду, не суйся в воду. Также и в блоговедении. Без понимания того, что делаешь, лучше не влезать в HTML-код.

    ОтветитьУдалить
  2. А ещё нельзя влезать в электрощиток, трансформатор. На них так и написано. Не влезай - убьет.

    ОтветитьУдалить
    Ответы
    1. Молодец, хорошо знаешь технику безопасности.

      Удалить
    2. Все инструкции по технике безопасности написаны кровью.

      Удалить
  3. Прикольно про технику безопасности. А в тему Soho получится добавить виджет с меню?

    ОтветитьУдалить

Отправить комментарий

Можно использовать теги форматирования: жирный <b></b>, курсив <i></i> и <a href="...">...</a>.

Новые записи

Страницы

Новые комментарии