Бегущая строка в определенном месте сайта служит для привлечения внимания посетителей и обычно с ее помощью публикуют наиболее важные новости и объявления.
Для wordpress есть несколько плагинов, позволяющих сделать такое. Я использую наиболее популярный и гибкий в части настроек плагин Ditty News Ticker. Ниже публикую детальную инструкцию по использованию этого инструмента.
После установки плагина в боковой колонке появится меню из 3-х пунктов. На русском языке пока перевода нет, но я написал пояснения к каждой настройке:
- New Tickers – список существующих “бегущих строк”;
- Add New – добавить новую строку;
- Settings – настройки.
Настройки здесь небольшие:
- Visual Editor – использовать визуальный редактор;
- Quick Edit Links – ссылка в “бегущей строке” на сайте для ее быстрого редактирования (будет видна для администраторов сайта);
- Custom CSS – стили оформления.
Далее добавляем новый элемент по ссылке Add New.
В минимальном варианте здесь нужно указать Заголовок (он используется только для обозначения элемента, на сайте не выводится) и ticker text (текст бегущей строки). В тексте можно использовать любое оформление (цвета, размеры) и в этом виде он будет отображаться на сайте.
После ввода данных нужно их сохранить по кнопке Опубликовать в правой боковой колонке.
Чтобы вставить бегущую строку, например, в шапку сайта, вам нужно открыть в любом редакторе файл, отвечающий за вывод шапки (обычно это header.php) и вставить там функцию вывода тикера – она приведена под заголовком справа. Или шорткод – под заголовком слева. Шорткод в wordpress выводится с помощью функции do_shortcode, например, так:
<?php echo do_shortcode('[ditty_news_ticker id="933"]'); ?>
Кроме того с помощью шорткода вы можете вывести бегущую строку на страницах вашего сайта, для этого вставьте шорткод в нужно место страницы в редакторе Вордпресс. Также можно вставить шорткод в виджет.
После этого в этом месте на сайт будет появляется введенная вами бегущая строка. Она будет с определенной периодичностью “пробегать” слева направо. На вкладке Ticker Mode можно настроить вывод более детально.
- SCROLL DIRECTION – направление движения: влево, вправо, вверх, вниз. Показывать строку изначально;
- TICK DIMENSIONS – размеры области вывода;
- SCROLLER PADDING – отступы области вывода: padding – внутренний отступ, margin – внешний отступ;
- SCROLL SPEED – скорость движения в условных единицах. Останавливать движение при наведении курсора мышки;
- TICK SPACING – расстояние между элементами бегущей строки.