Онлайн-генератор веб-цветов
Онлайн-подбор оптимальных веб-цветов для сайта
Онлайн-редактор HTML
Цветовой онлайн-калькулятор
Онлайн-калькулятор
Онлайн-рисовалка PencilMadness
  • Web
  • Images
  • News
  • Videos
  понедельник, июля 25, 2011  

Удаляем панель навигации NAvBar
Панель NavBar является одним из лишних атрибутов блога на хостинге от Blogger, хотя с одной стороны она вполне удобна как для входа в аккаунт Google, так и для поиска по блогу. Но с другой, по сути, знаменует собой альтернативный рекламный блок платформы Blogger и не всегда приятна в плане дизайна. Ко всему, в панели NavBar присутствует ссылка "Пожаловаться на спам", что может служить неприятным инцидентом благодаря проискам недобросовестных конкурентов вашего блога. Поэтому многие пользователи стремятся искоренить ее присутствие у себя в блоге.

Существует достаточно много способов скрыть либо полностью удалить из шаблона Blogger элемент этого ненужного декора. О всех известных мне вариантах я расскажу в этом посте.
Все примеры требуют правки кода шаблона, поэтому перед манипуляциями с панелью NavBar рекомендуется сделать резервную копию шаблона для возвращения работающих функций блога в случае неправильного форматирования.
В административной панели вашего блога проследуйте Дизайн > Изменить HTML. Вы окажетесь на странице редактирования шаблона блога. Все поиски указанных ниже учасков кода выполняйте с помощью комбинации клавиш CTRL+F.

Как скрыть панель навигации NavBar:

Ищем в шаблоне отрезок

<b:skin><![CDATA[/*
-----------------------------------------------
Обычно идут атрибуты шаблона
----------------------------------------------- */

и сразу после него добавляем любой из предложенных ниже стилей CSS для сокрытия NavBar.

Первый способ:
#navbar-iframe {
  height: 0;
  visibility: hidden;
  display: none;
}
Второй способ:
#navbar-iframe {
   display: none !important;
}

Сокрытие по умолчанию панели навигации NavBar и появление при наведении курсором мыши:

Аналогично указанному ранее примеру ищем тот же отрезок кода и после него добавляем стили.

Первый способ:
#navbar-iframe {
opacity: 0.0;
filter: alpha(Opacity=0)}

#navbar-iframe:hover {
opacity: 0.5;
filter: alpha(Opacity=50,FinishedOpacity=50)}
Второй способ (для корректного отображения в браузерах IE):
#navbar-iframe {
  height:5px;
  }

/* IE7, IE8, IE6 */
  #navbar-iframe { height/*\**/: 30px\9; }

#navbar-iframe:hover {
  height:40px; !important;
  }

Убираем панель навигации NavBar и размещаем ее внизу экрана.

Ищем те же строки, что и в предыдущих примерах и после них прописываем код:
#navbar-iframe {
top:95.45%;
position:fixed;
}

Удаляем панель навигации NavBar из блога.

Ищем в шаблоне строку </head> и перед ней добавляем один из скриптов ниже.

Первый способ:
<script type="text/javascript">
function removeBloggerNavbar(){
  var parent = document.getElementById("Navbar1");
  var child = document.getElementById("navbar-iframe");
  parent.removeChild(child);
}
removeBloggerNavbar();
</script>
Второй способ:
<script type='text/javascript'>
<![CDATA[
<!--
/*<body>*/
-->
]]>
</script>

Вам остается выбрать удобный для вас способ сокрытия панели навигации и воспользоваться им.
Для возвращения панели в первородное состояние достаточно удалить выбранные вами к использованию участки кода.



Понравилась статья? Поделись ею с друзьями!

Не забудь подписаться на обновления блога:


Вы можете оставить свой отзыв через блок комментариев Вконтакте. При отсутствии профиля в этой социальной сети, воспользуйтесь удобной формой Disqus ниже.