Как установить Георгиевскую ленточку на сайт

Здравствуйте, друзья! Остается меньше недели до самого великого праздника — Дня победы.  Вы наверняка обратили внимание, что зародившаяся в далеком 2006 году акция «Георгиевская ленточка», уже перенеслась и в онлайн пространство. Во многих социальных сетях созданы сообщества и группы в ее поддержку. Именно такой ленточкой в свое время была обтянута орденская колодка к медали «За победу над Германией в Великой Отечественной войне 1941—1945 гг.» А в наши дни ленточка стала настоящим символом Победы!

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

Я Вам предлагаю воспользоваться на выбор одним из трех скриптов, которые нашел на форуме Кабинет Админа.ru.  Думаю, что Вы сможете подобрать себе предложение по вкусу и согласно дизайну своего сайта. Более того, скрипты позволяют вставить свою картинку и тем самым, выразить свою индивидуальность. Итак, за дело. Внимание! Все скрипты установить очень просто, нужно выбрать необходимый вариант и вставить его перед закрывающим тегом </head>.

Найти его можно в админ панели блога Внешний Вид — Редактор - Заголовок (header.php). Внимание! У меня на блоге установлен плагин, который при копировании добавляет ссылку на мой блог, так что будьте внимательны. Если вы скопировали нужный Вам код скрипта, то удалите из кода ссылку на мой блог.

1-й вариант, ленточка устанавливается слева:

<layer name="lenta" top=0 left=0 >
<nolayer>
<div id="lenta" style="position:absolute; top:0; left:0;">
</nolayer>
<a href="http://www.9may.ru/">
<img border="0" src="https://s58.radikal.ru/i159/1004/04/56913d658b12.gif" align="left">
</a>
<nolayer>
</div>
</nolayer>
</layer>

Поначалу этот вариант мне очень понравился, но имеет такую особенность, чтоб при прокрутке страницы ленточка уходит вверх. Это конечно не критично, но... Впрочем, наверняка те из Вас, кто силен в html смогут внести соответствующие коррективы в код.

2-й вариант, ленточка в виде банта справа или слева:

Код:

<img src=" https://sovetywebmastera.ru/wp-content/uploads/2015/05/9m__1_.png « border=»0" title="С Днём Победы 9 мая!" alt="С Днём Победы 9 мая!" class="cut9mai" style="cursor: move; position: absolute; top: 20px; right: 0px;"/><link rel="stylesheet" href="http://file-many.ru/9may/es.css" type="text/css" /> <script language="javascript" type="text/javascript" src="https://file-many.ru/9may/s.js"></script>

Очень стильное исполнение, тем более, что саму ленточку можно курсором поставить в любое место страницы. Но, как Вы видите на картинке, ленточка получается очень близко к установленной на моем блоге дополнительной панели RuBizPanel 2.0. И посетитель, пожелавший бы «потрогать ленточку», вполне может случайно вызвать срабатывание панели. Пришлось исключить для себя такой вариант. Хотя можно просто изменить отображение слева, заменить «right» на «left» и все будет отлично. В общем, я еще буду экспериментировать с разными вариантами. Можно также прописать любую другую картинку, все в ваших руках.

3-й вариант, ленточка устанавливается, как справа, так и слева.

Изначально в коде прописано правое размещение, но заменив  в этой строке: position: fixed; top: 0%; right: 0; всего только одно значение «right» на «left», мне удалось установить ленточку слева (как сейчас). А вот и сам код:

<div style="position: fixed; top: 10%; left: 0;">
<img src=" https://sovetywebmastera.ru/wp-content/uploads/2015/05/73681879.png  "
title="Мы помним! Мы Гордимся! Мы не забудем!">
</div>

Устанавливаются все скрипты очень просто. Достаточно просто скопировать текст (выбранный вариант скрипта) и вставить его перед закрывающим тегом </head>. Думаю, что это не составит особого труда, а на все про все у Вас уйдет не более пяти минут. Надеюсь, что эта информация будет полезна Вам. Пишите в комментариях, что у Вас получилось. А я еще хочу напомнить, что акция «Георгиевская лента» официально заканчивается 12 мая.

На этом у меня на сегодня все. Жду Ваших вопросов и комментариев к данной статье. С Великим Вас Праздником Великой Победы!

P.S. Напоминаю Вам о том, что продолжается набор в мою Годовую Мастер-группу с гарантией результата. Все подробности по данной ссылке.

С уважением, Евгений Вергус.