Бегущая строка для сайта.

БЕГУЩАЯ СТРОКА ДЛЯ САЙТА

БЕГУЩАЯ СТРОКА ДЛЯ САЙТА

БЕГУЩАЯ СТРОКА ДЛЯ САЙТА

Бегущая строка привлекает внимание и иногда полезно воспользоваться ею, чтобы заострить внимание посетителей на важной информации. В этой статье мы рассмотрим, как создается бегущая строка для сайта или блога на WordPress с помощью плагина «Horizontal scrolling announcement».

Плагин бегущей строки «Horizontal scrolling announcement».

Устанавливается плагин стандартно. В левом меню панели управления выбираем пункт “Плагины”, жмем на его подпункт “Добавить новый”, в окно поиска вводим “Horizontal scrolling announcement”, устанавливаем и активируем плагин.

После активации в пункте “Параметры” появляется новый подпункт «Horizontal scrolling». Заходим в плагин. Произведем установки по умолчанию. Для этого нажимаем кнопку «Default Settings».

Плагин «Horizontal scrolling announcement».

В открывшемся окне нас в первую очередь интересует выбор направления движения бегущей строки «Direction». Я выбираю движение справа налево «Right to Left».

Панель установок по умолчанию плагина «Horizontal scrolling announcement».

Подставляя цифры в окна ввода «Scroll amount» и «Scroll delay» можно отрегулировать необходимую скорость передвижения бегущей строки.

По умолчанию параметры текста бегущей строки будут совпадать с параметрами текста Вашего сайта. Мы можем для текста бегущей строки задать собственные параметры. Для своей бегущей строки я хочу, чтобы цвет текста был малиновым (#ff00c8) и размер текста был 14pt. Чтобы осуществить свои желания я подставляю в окно ввода «CSS attribute» строку «color:#ff00c8; font-size:14pt;».

Настройки по умолчанию произведены, нажимаем кнопку «Submit».

Для ввода текста бегущей строки в параметрах нажимаем «Horizontal scrolling» и в открывшемся окне «Add new».

Вводим новую строку.

Нам открылось окно для ввода текста бегущей строки.

Панель ввода строки плагина «Horizontal scrolling announcement».

Текст вводится в окно ввода «Enter the message/announcement». Если нам нужно, чтобы при нажатии на бегущую строку открывалось новое окно, вставляем в окно ввода «Enter target link» ссылку. В окно ввода «Display order» ставим единичку и в «Announcement group» выбираем свободную группу «GROUP2». Нажимаем кнопку «Submit».

Наша бегущая строка готова! Теперь мы можем вставить её в необходимое нам место.

Если бегущую строку необходимо вставить в шапку сайта, в подвал сайта или отобразить её в каждой записи, ищем соответствующий файл php и вставляем в него код:

<?php newannouncement( $group = “GROUP2″ ); ?>

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

[horizontal-scrolling group="GROUP2"]

Вот результат только что сделанной бегущей строки.

 

 

Плагин «Horizontal scrolling announcement» позволяет в бегущую строку вставлять картинки. Для этого в окно «Enter the message/announcement» необходимо вставить код:

<img id="begstr" src="адрес картинки" />

Для примера у меня получился вот такой цыпленок.

 

 

Картинку можно вставить с сопроводительным текстом:

<img id="begstr" src="адрес картинки" /> Ваш текст

Здесь присутствует один нюанс. Если Вы хотите, чтобы бегущая строка с картинкой и текстом была ссылкой, Вам лучше объединить две бегущие строки. Дело в том, что некоторые браузеры картинки-ссылки выделяют рамкой. В результате, такая движущееся картинка не будет смотреться. Чтобы обойти этот неприятный момент, можно для картинки создать бегущую строку без ссылки, присвоив этой строке единичку – в поле «Display order» пишем 1. Для текста добавляем отдельную бегущую строку со ссылкой, в её поле «Display order» пишем 2. Необходимо, чтобы для той и другой бегущей строки была выбрана одна и та же группа «Announcement group». Результат должен получиться примерно такой:

Надеюсь, теперь Вы легко сможете справиться с плагином «Horizontal scrolling announcement» и в случае необходимости у Вас получится бегущая строка для сайта устраивающая Вас. Если есть вопросы, пожалуйста, задавайте их в комментариях.

На эту же тему можно почитать или посмотреть:

Уроки на все случаи жизни

Нажимайте кнопки! Делитесь информацией с друзьями! Нажимайте кнопки! Делитесь информацией с друзьями!

Получайте информацию о новых акциях и новостях на свою электронную почту!

 

Введите адрес электронной почты:

 

 

Бегущая строка для сайта.: 13 комментариев

    1. admin Автор записи

      Татьяна! Страничка с бегущей строкой открывается такое же время, как страничка с обычным способом загруженными картинками. Непосредственную нагрузку плагина на сервер я не замерял. Более того, в этой статье я описал возможности плагина «Horizontal scrolling announcement», но использовал для бегущих строк иной способ подключения. Об этом я расскажу в следующей статье.

  1. Татьяна

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Разместить ссылку на свою статью