Создание ленты новостей в WordPress: 3 простых шага
Опубликовано: 2023-06-01Вы видели эти ползунки на телевизионных каналах? Они освещают последние новости, тенденции и важные события. Они известны как «бегущие строки новостей », которые также могут улучшить веб-сайты WordPress.
Узнайте, как создать бегущую строку в WordPress с помощью нашего пошагового руководства. Узнайте, как реализовать динамическую бегущую строку новостей с помощью плагина ElementsKit и улучшить доставку новостей на вашем веб-сайте.
Понимание ленты новостей в WordPress
Бегущие строки новостей, также называемые бегущими строками контента, создают эффект прокрутки текста на веб-сайте/любом другом носителе с краткими объявлениями. Бегущая строка помогает транслировать срочную информацию, призывы к представлению и другие текстовые сообщения. Эти бегущие строки привлекают внимание, перемещая текст на вашей странице.
Тикеры контента могут отображать широкий спектр контента. К ним относятся заголовки новостей, объявления, рекламные акции или другие детали прокрутки. Бегущая строка новостей доставляет обновления новостей, что делает ее специализированной бегущей строкой контента.
Ленты новостей или новостные ленты более чем полезны для новостных каналов. Они полезны для изменения таких тем, как новости, спорт, акции и многое другое. Лента новостей на вашем сайте позволяет посетителям оставаться в курсе. Это мотивирует их открывать для себя больше вашего контента.
Как добавить бегущую строку новостей в WordPress?
Это руководство поможет вам использовать бегущую строку контента ElementsKit на вашем веб-сайте WordPress. Прежде чем углубиться в пошаговые инструкции, давайте сначала опишем Elementor и ElementsKit .
Elementor и ElementsKit — популярные плагины WordPress, идеально подходящие для создания и настройки веб-сайтов. Elementor — это плагин визуального перетаскивания страниц для WordPress. Это инструмент, который позволяет настроить внешний вид вашего сайта WordPress без необходимости изучения кода.
С другой стороны, ElementsKit — это надстройка Elementor, которая является идеальным решением для разработки любого веб-сайта с нуля без кодирования. Он расширяет функциональность Elementor за счет дополнительных элементов, виджетов, шаблонов и функций для расширения возможностей конструктора страниц Elementor. Независимо от цели веб-сайта, вы можете создать его, просто перетащив готовые шаблоны и виджеты.
ElementsKit имеет множество мощных функций. Одним из них является виджет Content Ticker , который помогает создавать и отображать важные или актуальные новости. Это часть версии ElementsKit Pro, которая предлагает расширенные функции. Вы можете настроить бегущую строку с различными макетами, границами, анимацией и дизайном.
Ключевая особенность:
- Виджет Content Ticker для Elementor.
- Функция перетаскивания для легкой настройки.
- Удобный интерфейс.
- Продемонстрируйте важные или модные новости со стилем.
- Несколько вариантов макета для индивидуального внешнего вида.
- Границы, анимация и варианты дизайна для повышения визуальной привлекательности.
- Быстрое создание бегущей строки контента.
- Интегрируйтесь с вашим веб-сайтом на базе Elementor.
Теперь давайте приступим к подробному пошаговому руководству по эффективному использованию плагина ElementsKit в качестве ленты новостей в WordPress.
Шаг 1. Включите виджет бегущей строки контента
Чтобы добавить бегущую строку контента на свой веб-сайт WordPress, включите виджет бегущей строки контента ElementsKit . После этого откройте редактор Elementor и перетащите виджет в область дизайна.
Чтобы активировать виджет Бегущая строка контента:
- Перейдите в ElementsKit > Виджеты.
- Найдите бегущую строку в списке виджетов и включите ее.
- Нажмите кнопку « Сохранить изменения ».
Шаг 2. Настройте параметры бегущей строки контента в Elementor
Название тикера
- Показать заголовок. Активируйте функцию заголовка бегущей строки, чтобы разблокировать дополнительные параметры настройки.
- Стиль заголовка. Выберите стиль заголовка бегущей строки среди доступных вариантов.
- Текст заголовка. Введите желаемый текст для заголовка.
- Включить указатель. Рядом с заголовком бегущей строки можно отобразить указатель.
- Икона. Кроме того, вы можете отобразить значок рядом с заголовком.
- Позиция. Выберите « До » или « После » в качестве желаемого размещения.
- Включить разделитель. У вас есть возможность отображать разделитель вместе с заголовком бегущей строки.
Содержимое тикера/запрос
В этом разделе вы можете выбрать тип контента и настроить его параметры в соответствии со своими предпочтениями.
Тип контента: Сообщение
Этот выбор позволяет отображать сообщения вашего веб-сайта в бегущей строке.
- Выбор контента: установите для него значение « Опубликовать ».
- Content Count: Укажите количество сообщений.
- Обрезка заголовка: ограничьте количество символов для заголовка сообщения в тикере.
- Обрезка описания : ограничение количества символов, отображаемых в бегущей строке заголовка сообщения.
- Выберите контент: вы можете выбрать способ отображения сообщений следующими способами:
- Недавнее сообщение: отображение самых последних сообщений с вашего веб-сайта.
- Выбранное сообщение: Показать определенные сообщения, выбрав их в поле « Поиск и выбор ».
- Сообщение категории: Отображение сообщений на основе категорий. Добавьте нужные категории в поле « Выберите категории ».
- Порядок: определите порядок содержимого как нисходящий (DESC) или восходящий (ASC).
Тип контента: Пользовательский
Чтобы отобразить пользовательский контент в бегущей строке, выполните следующие действия:
- Выбор содержимого: установите для него значение « Пользовательский ».
- Добавить элемент: вы можете добавлять элементы контента.
- Заголовок содержимого: введите заголовок содержимого бегущей строки.
- Описание содержимого: введите описание содержимого бегущей строки.
- Выберите изображение: включите изображение, которое будет отображаться в тикере.
- Ссылка: введите URL-адрес, чтобы связать содержимое с веб-страницей.
Настройки
В этом разделе вы можете настроить параметры тикера.
- Показать изображение: выберите, следует ли отображать в бегущей строке рекомендуемое изображение контента.
- Размер изображения: измените размер изображения внутри бегущей строки.
- Включить тень: активируйте тень на левом и правом концах содержимого бегущей строки.
- Показать описание: решите, следует ли включать описание контента в бегущую строку.
- Эффект: выберите нужный стиль эффекта анимации из следующих вариантов: «По умолчанию», «Затухание», «Выделение» и «Ввод». Совет. Если вы выберете эффект «Выделение», увеличьте скорость анимации для лучшей видимости.
- Направление: укажите порядок прокрутки как i. Горизонтальная прокрутка или ii. Вертикальная прокрутка. Примечание. Настройка направления не применима к эффекту выделения.
- Скорость анимации: вы можете изменить и точно настроить скорость эффекта анимации. Примечание. Настройка направления не применима к эффекту выделения.
- Автозапуск: у вас есть возможность включить автозапуск бегущей строки контента. Если включено, вы можете установить время задержки между изменениями контента. Примечание. Параметр автовоспроизведения неприменим к эффекту выделения.
- Обратное направление: по умолчанию тикер будет прокручиваться справа налево. Но вы также можете выбрать направление прокрутки бегущей строки слева направо.
- Захват курсора: пользователи могут перемещать содержимое бегущей строки, просто захватывая их курсором мыши. Примечание. Параметр «Захват курсора» неприменим для эффекта «Выделение».
- Показать стрелку: включите функцию стрелки для навигации по содержимому бегущей строки вручную. Если вы решите отображать стрелки, выберите значок со стрелкой влево и значок со стрелкой вправо.
Шаг 3. Настройте стиль бегущей строки контента
На вкладке стиля в Elementor вы можете настроить бегущую строку контента по своему усмотрению.
Обертка
1. Направление: выберите расположение заголовка бегущей строки и стрелок.
- Обычный: заголовок тикера слева, а стрелка справа.
- Реверс: название тикера справа, а стрелка слева.
2. Заполнение обертки : настройте верхнее и нижнее заполнение для всего раздела бегущей строки содержимого в соответствии с вашими предпочтениями.
Название тикера
- Ширина: измените ширину раздела заголовка бегущей строки, чтобы добиться желаемого внешнего вида.
- Выравнивание: выберите выравнивание значка и текста в заголовке бегущей строки.
- Параметры указателя/значка. Настройте размер, расстояние между заголовком и указателем/значком, а также цвет указателя/значка.
- Типографика: выберите нужный типографику для текста заголовка.
- Отступы: Настройте отступы в заголовке бегущей строки.
- Радиус границы: отредактируйте радиус границы заголовка бегущей строки.
- Цвет текста: выберите цвет текста.
- Фон: выберите фон для заголовка бегущей строки.
- Значок: выберите значок, который будет отображаться в заголовке бегущей строки.
- Параметр разделителя: если он включен, вы можете настроить его стиль, изменив такие свойства, как ширина, высота и цвет.
Содержимое тикера
- Выравнивание: выберите выравнивание содержимого бегущей строки.
- Поля: установите правое и левое поля содержимого бегущей строки.
- Отступы: Настройте отступы содержимого.
- Цвет заголовка: выберите цвет заголовка содержимого бегущей строки.
- Цвет заголовка при наведении: выберите цвет, который будет отображаться при наведении курсора на заголовок содержимого.
- Типографика заголовка: задайте типографику текста заголовка контента.
- Цвет описания: изменение цвета описания содержимого.
- Типографика описания: определите типографику текста описания.
Изображение
Включив параметр « Показать изображение » в разделе «Настройки», содержимое будет включать отображение изображения.
- Настройте ширину и высоту изображения в соответствии с вашими предпочтениями.
- Выберите его тип границы.
- Отрегулируйте радиус границы.
- Установите поле для изображения содержимого.
Стрелка
Как только вы активируете функцию « Показать стрелки », стрелки будут видны на бегущей строке.
- Положение стрелки: установите положение стрелки слева или справа от бегущей строки.
- Ширина: отрегулируйте ширину стрелок.
- Высота: отрегулируйте размер стрелок.
- Пробел между: измените интервал между двумя стрелками.
- Цвет значков: выберите цвет значков со стрелками.
- Цвет фона: выберите цвет фона для стрелок.
- Тип границы: выберите тип границы и настройте ширину и цвет границы.
- Радиус границы: отрегулируйте радиус границы.
Лучшие практики для содержимого ленты новостей в WordPress
Чтобы максимально эффективно использовать бегущую строку новостей в WordPress, очень важно следовать рекомендациям по контенту. Тщательно отбирая и представляя информацию, вы можете эффективно привлечь свою аудиторию.
- Оставайтесь актуальными
Убедитесь, что содержание бегущей строки новостей актуально и актуально для аудитории. Регулярно обновляйте контент, чтобы поддерживать его свежесть и привлекательность.
- Отдайте предпочтение удобочитаемости
Выберите стили шрифта, размеры и цвета, которые визуально приятны для чтения. Избегайте использования сложных анимаций или рисунков, которые могут помешать удобочитаемости вашего контента.
- Оптимизация скорости и продолжительности
Точно настройте скорость бегущей строки, чтобы дать пользователям время прочитать и понять содержание. Не устанавливайте его слишком быстро или медленно, это может повредить пользовательскому опыту.
- Ограничить количество предметов
Поддержание разумного количества элементов рекомендуется для обеспечения бесперебойного взаимодействия с пользователем.
- Используйте лаконичный и четкий текст
Текст в ленте новостей должен быть кратким и сфокусированным. Позвольте пользователям быстро понять основную идею каждого элемента.
- Включите соответствующие ссылки
Прикрепите гиперссылки к тексту в бегущей строке новостей. Он соединяет пользователей с соответствующими страницами на вашем сайте. Бегущая строка превращается в ценный инструмент навигации, который направляет пользователей к контенту.
- Проверьте отзывчивость на разных устройствах
Протестируйте бегущую строку на разных устройствах, размерах экрана и разрешениях. Убедитесь, что он обеспечивает единообразный пользовательский интерфейс на всех платформах.
- Мониторинг и оптимизация производительности
Постоянно оценивайте эффективность бегущей строки новостей. Внесите необходимые изменения, чтобы улучшить пользовательский опыт и показатели вовлеченности.
Заворачивать
Вы можете улучшить свой сайт с помощью бегущей строки новостей в WordPress. Он может демонстрировать последние новости, тенденции и важные обновления. Убедитесь, что содержимое вашей ленты новостей актуально, удобочитаемо и оптимизировано для скорости. Используйте краткий текст, релевантные ссылки и тестируйте отзывчивость на разных устройствах, чтобы улучшить взаимодействие с пользователем.
Выберите плагин, который не только играет роль автоматически прокручиваемой бегущей строки новостей в WordPress, но и обладает универсальностью. Хороший выбор плагина бегущей строки новостей может отображать заголовки новостей, объявления, рекламные акции или любой другой тип прокручиваемой информации. Это удобство, которое наш виджет ElementsKit Content Ticker Widget может принести на ваш сайт.
Пусть ваш плагин сделает всю работу за вас. Установите и активируйте наш плагин ElementsKit, чтобы создать бегущую строку с настраиваемыми настройками. Легко интегрируйте его, следуя инструкциям и используя его потенциал на своем сайте WordPress.
Возможно, вам будет интересно узнать о лучших инструментах SEO для WordPress, которые вы должны попробовать, что улучшит ваш опыт ведения блога и повысит производительность вашего сайта.