Инструкция по работе виджета бегущей строки для новостей: различия между версиями
Нет описания правки |
|||
(не показано 13 промежуточных версий этого же участника) | |||
Строка 1: | Строка 1: | ||
<languages/> | |||
<translate> | |||
<!--T:1--> | |||
== '''Описание виджета''' == | == '''Описание виджета''' == | ||
Данный виджет является функциональностью, которая позволяет в режиме реального времени выводить информацию с новостных ресурсов в нескольких режимах: | Данный виджет является функциональностью, которая позволяет в режиме реального времени выводить информацию с новостных ресурсов в нескольких режимах: | ||
Строка 4: | Строка 7: | ||
# В режим бегущей строки | # В режим бегущей строки | ||
Виджет получает информацию с помощью URL-ссылки, которая является для него источником и выводит полученные по ссылке новости на экран в виде новостного блока. При помощи настроек виджета можно сделать вывод новостей на устройство уникальным и индивидуальным, в зависимости от требований пользователя. | Виджет получает информацию с помощью URL-ссылки, которая является для него источником и выводит полученные по ссылке новости на экран в виде новостного блока. При помощи настроек виджета можно сделать вывод новостей на устройство уникальным и индивидуальным, в зависимости от требований пользователя. | ||
== '''Добавление виджета в личный кабинет''' == | == '''Добавление виджета в личный кабинет''' == | ||
Чтобы добавить данный виджет в личный кабинет пользователю необходимо запросить у специалиста команды виджет. Он будет предоставлен в формате ".zip" - архива. | Чтобы добавить данный виджет в личный кабинет пользователю необходимо запросить у специалиста команды технической поддержки виджет. Он будет предоставлен в формате ".zip" - архива. | ||
[[File:Пример_виджета_rss.png|thumb|center| Пример виджета в формате ".zip" - архива|800px]] | [[File:Пример_виджета_rss.png|thumb|center| Пример виджета в формате ".zip" - архива|800px]] | ||
После пользователь должен авторизоваться в личном кабинете и перейти в раздел "Контент". | После пользователь должен авторизоваться в личном кабинете и перейти в раздел "Контент". | ||
Строка 14: | Строка 16: | ||
{{Note|Если у пользователя много различного контента в личном кабинете, то он может воспользоваться функцией сортировки и выбрать нужный тип контента "Виджет". Воспользовавшись данной функциональностью, он сможет просмотреть все добавленные в личный кабинет виджеты. | {{Note|Если у пользователя много различного контента в личном кабинете, то он может воспользоваться функцией сортировки и выбрать нужный тип контента "Виджет". Воспользовавшись данной функциональностью, он сможет просмотреть все добавленные в личный кабинет виджеты. | ||
[[File:Виджеты.png|thumb|center| Пример отображения правильной сортировки для более удобного поиска виджета |800px]]|warn}} | [[File:Виджеты.png|thumb|center| Пример отображения правильной сортировки для более удобного поиска виджета |800px]]|warn}} | ||
</translate> | |||
<translate> | |||
<!--T:2--> | |||
== '''Настройка виджета''' == | == '''Настройка виджета''' == | ||
После переноса виджета в раздел "Контент" для первичной настройки виджета пользователю необходимо дважды кликнуть по иконке виджета. Данное действие перенесет его на главную страницу виджета. | После переноса виджета в раздел "Контент" для первичной настройки виджета пользователю необходимо дважды кликнуть по иконке виджета. Данное действие перенесет его на главную страницу виджета. | ||
Строка 25: | Строка 29: | ||
'''"Блок общие настройки:"''' | '''"Блок общие настройки:"''' | ||
* Выбор языка - позволяет выбрать на каком языке будет отображаться интерфейс виджета. В текущей реализации доступны два языка: русский и английский | * Выбор языка - позволяет выбрать на каком языке будет отображаться интерфейс виджета. В текущей реализации доступны два языка: русский и английский | ||
* Ссылка на ресурс - позволяет указать URL - ссылку на новостной портал из которого будет использоваться новостной блок для виджета. В данном случае ссылка должна вести на RSS ресурс получаемый от | * Ссылка на ресурс - позволяет указать URL - ссылку на новостной портал, из которого будет использоваться новостной блок для виджета. В данном случае ссылка должна вести на RSS ресурс получаемый от сервера в виде XML разметки | ||
* Слайдер цветов - позволяет пользователю выбрать цветовое сочетание с двумя вариантами градиентов для проигрывания новостей. (подробнее см. ниже). При наличии хотя бы одного слайдера цветов не работает "Фоновое изображения" ([[#Слайдер с палитрами|смотрите ниже]]) для новостей, так как заменяет данный блок слайдером | * Слайдер цветов - позволяет пользователю выбрать цветовое сочетание с двумя вариантами градиентов для проигрывания новостей. (подробнее см. ниже). При наличии хотя бы одного слайдера цветов не работает "Фоновое изображения" ([[#Слайдер с палитрами|смотрите ниже]]) для новостей, так как заменяет данный блок слайдером | ||
* Фоновое изображение - позволяет выбрать графический контент в качестве изображения для фона виджета. Не работает при наличии хотя бы одного слайдера цветов | * Фоновое изображение - позволяет выбрать графический контент в качестве изображения для фона виджета. Не работает при наличии хотя бы одного слайдера цветов | ||
Строка 45: | Строка 49: | ||
* Чекбокс (галочка) режима бегущей строки - при активации позволяет использовать пользователю бегущую строку для текстовой части новости. Убирает из новости изображение и прокручивает текущие новости одной строкой. | * Чекбокс (галочка) режима бегущей строки - при активации позволяет использовать пользователю бегущую строку для текстовой части новости. Убирает из новости изображение и прокручивает текущие новости одной строкой. | ||
* Скорость бегущей строки - может принимать значения от "0" до "1000". Позволяет пользователю установить скорость появления и прокрутки бегущей строки | * Скорость бегущей строки - может принимать значения от "0" до "1000". Позволяет пользователю установить скорость появления и прокрутки бегущей строки | ||
* Символ разделения новостей - позволяет пользователю указать символ, который будет использоваться в качестве разделителя новостей. | * Символ разделения новостей - позволяет пользователю указать символ, который будет использоваться в качестве разделителя новостей. Рекомендуемые известные символы: ("."),(","),("/") | ||
* Отступ между текстом новостей - позволяет пользователю указать расстояние в пикселях между новостями и символом разделения новостей. Расстояние актуально как для текущей проигрываемой новости, так и для следующей. Это значит что обе новости буду находиться на одинаковом расстоянии от символа разделения | * Отступ между текстом новостей - позволяет пользователю указать расстояние в пикселях между новостями и символом разделения новостей. Расстояние актуально как для текущей проигрываемой новости, так и для следующей. Это значит, что обе новости буду находиться на одинаковом расстоянии от символа разделения | ||
* Цвет текста бегущей строки - позволяет пользователю выбрать цвет текста, который будет использоваться для бегущей строки | * Цвет текста бегущей строки - позволяет пользователю выбрать цвет текста, который будет использоваться для бегущей строки | ||
* Размер шрифта бегущей строки - позволяет пользователю указать числовое значение, которое будет использоваться в качестве размера шрифта для бегущей строки | * Размер шрифта бегущей строки - позволяет пользователю указать числовое значение, которое будет использоваться в качестве размера шрифта для бегущей строки | ||
* Направление движения бегущей строки - позволяет пользователю выбрать направление в котором будет двигаться бегущая строка. В текущей реализации доступно два варианта: слева направо и справа налево | * Направление движения бегущей строки - позволяет пользователю выбрать направление, в котором будет двигаться бегущая строка. В текущей реализации доступно два варианта: слева направо и справа налево | ||
* Отступ бегущей строки - измеряется в пикселях и позволяет указать числовым значением отступ при включенной бегущей строке относительно левой и правой части экрана | * Отступ бегущей строки - измеряется в пикселях и позволяет указать числовым значением отступ при включенной бегущей строке относительно левой и правой части экрана | ||
[[File:Настройки_бегущей_строки.png|thumb|center| Пример отображения блока настроек|800px]] | [[File:Настройки_бегущей_строки.png|thumb|center| Пример отображения блока настроек|800px]] | ||
</translate> | |||
<translate> | |||
<!--T:3--> | |||
=== '''Слайдер с палитрами''' === | === '''Слайдер с палитрами''' === | ||
Слайдер цветов позволяет пользователю выбирать как будет отображаться фон для новостей и какое количество фонов будет использоваться для новостей.<br> | Слайдер цветов позволяет пользователю выбирать как будет отображаться фон для новостей и какое количество фонов будет использоваться для новостей.<br> | ||
Для того чтобы добавить один фон пользователю необходимо нажать "Добавить цвет". | Для того, чтобы добавить один фон пользователю необходимо нажать "Добавить цвет". | ||
[[File:Добавить_слайдер_.png|thumb|center| Пример отображения кнопки "Добавить цвет" для слайдера |800px]] | [[File:Добавить_слайдер_.png|thumb|center| Пример отображения кнопки "Добавить цвет" для слайдера |800px]] | ||
{{Note|Слайдер можно удалить по иконке справа в виде мусорной корзины. | {{Note|Слайдер можно удалить по иконке справа в виде мусорной корзины. | ||
[[File:Удаление_слайдера.png|thumb|center| Пример отображения иконки для удаления слайдера |800px]]|warn}} | [[File:Удаление_слайдера.png|thumb|center| Пример отображения иконки для удаления слайдера |800px]]|warn}} | ||
После добавленная на экране настроек палитра для слайдера позволяет пользователю создать отображение новости под свой нужды. Добавлять палитры можно без ограничений, но нужно понимать что они будут меняться вместе с новостью.<br> | После добавленная на экране настроек палитра для слайдера позволяет пользователю создать отображение новости под свой нужды. Добавлять палитры можно без ограничений, но нужно понимать, что они будут меняться вместе с новостью.<br> | ||
Если у пользователя палитр меньше чем количество новостей, то проигрывание использование палитра начнется заново. | Если у пользователя палитр меньше, чем количество новостей, то проигрывание использование палитра начнется заново. | ||
=== '''Настройка цветового отображения''' === | === '''Настройка цветового отображения''' === | ||
Все палитры для слайдеров имеют возможность делать градиентный переход. Пользователь может выставить любое количество точек градиента с помощью клика на панели градиента. | Все палитры для слайдеров имеют возможность делать градиентный переход. Пользователь может выставить любое количество точек градиента с помощью клика на панели градиента. | ||
[[File:Количество_градиентов.png|thumb|center| Пример отображения нескольких точек для градиентов на палитре|800px]] | [[File:Количество_градиентов.png|thumb|center| Пример отображения нескольких точек для градиентов на палитре|800px]] | ||
Выбрав нужную точку с помощью | Выбрав нужную точку с помощью клика мыши, пользователь может установить ей определенный цвет. Когда точка не выбрана ее отображение - белый незакрашенный круг. Когда точка выбрана - ее отображение белый закрашенный круг. | ||
[[File:Пример_кругов.png|thumb|center| Пример отображения выбранной и невыбранной точки|800px]] | [[File:Пример_кругов.png|thumb|center| Пример отображения выбранной и невыбранной точки|800px]] | ||
Пользователю два вида отображения градиента: | Пользователю два вида отображения градиента: | ||
Строка 76: | Строка 82: | ||
# RGB панель - необходимо выставить числовые значения на RGB панели для каждого из основных цветов [https://colorscheme.ru/html-colors.html можно узнать в сети] | # RGB панель - необходимо выставить числовые значения на RGB панели для каждого из основных цветов [https://colorscheme.ru/html-colors.html можно узнать в сети] | ||
[[File:3_цвета.png|thumb|center| Пример отображения всех трех видов настройки цвета на палитре |800px]] | [[File:3_цвета.png|thumb|center| Пример отображения всех трех видов настройки цвета на палитре |800px]] | ||
Также пользователю доступен "ползунок" яркости цвета позволяющий регулировать яркость и насыщенность цвета. В качестве альтернативы "ползунку" можно использовать параметр "Alpha", также отвечающий за яркость | Также пользователю доступен "ползунок" яркости цвета позволяющий регулировать яркость и насыщенность цвета. В качестве альтернативы "ползунку" можно использовать параметр "Alpha", также отвечающий за яркость. | ||
[[File:Альфа_и_ползунок.png|thumb|center| Пример отображения ползунка насыщенности цвета и параметра "Alpha" |800px]] | [[File:Альфа_и_ползунок.png|thumb|center| Пример отображения ползунка насыщенности цвета и параметра "Alpha" |800px]] | ||
== '''Добавление настроенного виджета в трансляцию''' == | == '''Добавление настроенного виджета в трансляцию''' == | ||
Чтобы полностью ознакомиться с работой данной функциональность пользователю необходимо запустить трансляцию с расписанием и добавить в качестве контента данный виджет. Чтобы ознакомиться с описанными ранее шагами по созданию трансляции и расписания рекомендуется просмотреть следующие статьи из Wikipedia: | Чтобы полностью ознакомиться с работой данной функциональность пользователю необходимо запустить трансляцию с расписанием и добавить в качестве контента данный виджет. Чтобы ознакомиться с описанными ранее шагами по созданию трансляции и расписания рекомендуется просмотреть следующие статьи из Wikipedia: | ||
Строка 86: | Строка 91: | ||
* [[Раздел "Расписание"]] | * [[Раздел "Расписание"]] | ||
== '''Видеоинструкция''' == | == '''Видеоинструкция''' == | ||
[https://www.youtube.com/watch?v= | [https://www.youtube.com/watch?v=FrXttSiJLyM Настройка виджета динамического отображения новостей через RSS ] | ||
<!--T:4--> | |||
== '''Дополнительная информация''' == | == '''Дополнительная информация''' == | ||
Если данная статья не помогает использовать функционал по назначению или после ее прочтения остаются вопросы можно озвучить данные вопросы в разделе "Обсуждения" вверху страницы | Если данная статья не помогает использовать функционал по назначению или после ее прочтения остаются вопросы можно озвучить данные вопросы в разделе "Обсуждения" вверху страницы. | ||
[[File:RSS_обсуждения.png|thumb|center| Пример отображения вкладки "Обсуждения" на wiki-странице |800px]] | [[File:RSS_обсуждения.png|thumb|center| Пример отображения вкладки "Обсуждения" на wiki-странице |800px]] | ||
Также дополнительную информацию можно узнать на странице [[Как взаимодействовать пользователю с разделом "Обсуждения"]] | Также дополнительную информацию можно узнать на странице [[Как взаимодействовать пользователю с разделом "Обсуждения"]] | ||
</translate> |
Текущая версия от 09:36, 4 октября 2024
Описание виджета
Данный виджет является функциональностью, которая позволяет в режиме реального времени выводить информацию с новостных ресурсов в нескольких режимах:
- Статичной новости с графическим контентом
- В режим бегущей строки
Виджет получает информацию с помощью URL-ссылки, которая является для него источником и выводит полученные по ссылке новости на экран в виде новостного блока. При помощи настроек виджета можно сделать вывод новостей на устройство уникальным и индивидуальным, в зависимости от требований пользователя.
Добавление виджета в личный кабинет
Чтобы добавить данный виджет в личный кабинет пользователю необходимо запросить у специалиста команды технической поддержки виджет. Он будет предоставлен в формате ".zip" - архива.
После пользователь должен авторизоваться в личном кабинете и перейти в раздел "Контент".
В разделе "Контент" необходимо перетянуть данный виджет из локального хранилища в раздел "Контент". После того как пользователь перенесет виджет в личный кабинет он отобразиться в списке с контентом.
Настройка виджета
После переноса виджета в раздел "Контент" для первичной настройки виджета пользователю необходимо дважды кликнуть по иконке виджета. Данное действие перенесет его на главную страницу виджета.
На главной странице виджета можно перейти в настройки параметров виджета. Это можно сделать с помощью клика по иконке в виде шестеренки.
Параметры для настройки виджета
К действиям с помощью который можно настроить виджет относятся следующие параметры:
"Блок общие настройки:"
- Выбор языка - позволяет выбрать на каком языке будет отображаться интерфейс виджета. В текущей реализации доступны два языка: русский и английский
- Ссылка на ресурс - позволяет указать URL - ссылку на новостной портал, из которого будет использоваться новостной блок для виджета. В данном случае ссылка должна вести на RSS ресурс получаемый от сервера в виде XML разметки
- Слайдер цветов - позволяет пользователю выбрать цветовое сочетание с двумя вариантами градиентов для проигрывания новостей. (подробнее см. ниже). При наличии хотя бы одного слайдера цветов не работает "Фоновое изображения" (смотрите ниже) для новостей, так как заменяет данный блок слайдером
- Фоновое изображение - позволяет выбрать графический контент в качестве изображения для фона виджета. Не работает при наличии хотя бы одного слайдера цветов
- Анимация - позволяет пользователю выбрать анимацию при смене новостей. Доступно два вида анимации: fade (анимация с постепенно исчезающим фоном) и slide (скользящая анимация справа налево)
- Задержка смены контента - измеряется в секундах и позволяет пользователю указать числовое значение скорости смены новостей
- Чекбокс (галочка) отключить показ картинок - при активации позволяет отключить возможность отображать новость вместе с изображением. То есть при активации оставляет только текст от новости. Если же деактивировать данный чекбокс (галочку), то новость будет отображаться с изображением (при ее наличии у новости)
- Чекбокс (галочка) автоскролл - при активации позволяет использоваться автопролистывание новости если она большая по объему и не помещается на экран
Блок "Настройки для текстовой информации при отключенном режиме бегущей строки:"
- Позиционирование для текста - позволяет пользователю выбрать в какой части экрана будет расположена бегущая строка. В текущей реализации доступно два варианта: по центру страницы или наверху страницы. Не работает в режиме бегущей строки
- Цвет текста в статичной новости - позволяет пользователю выбрать цвет текста, который будет использоваться для бегущей строки. Цвет можно указать с помощью HEX-кода можно узнать в сети
- Размер шрифта текстовой новости - позволяет пользователю указать числовое значение, которое будет использоваться в качестве размера шрифта для бегущей строки
- Ширина картинки - измеряется в пикселях и позволяет пользователю указать ширину используемого для новости изображения в качестве числового значения
- Высота картинки - измеряется в пикселях и позволяет пользователю указать высоту используемого для новости изображения в качестве числового значения
- Отступ картинки - измеряется в пикселях и позволяет пользователю указать дистанцию отступа для изображения в качестве числового значения. Отступ работает от левой стороны экрана
- Тэг с rss канала - данная настройка указывает на XML-тэг, который позволяет виджету понять из какого XML-тега использовать текст для новости. В текущей реализации доступна три тега: discription, content и title.
Блок: "Настройки для бегущей строки:"
- Чекбокс (галочка) режима бегущей строки - при активации позволяет использовать пользователю бегущую строку для текстовой части новости. Убирает из новости изображение и прокручивает текущие новости одной строкой.
- Скорость бегущей строки - может принимать значения от "0" до "1000". Позволяет пользователю установить скорость появления и прокрутки бегущей строки
- Символ разделения новостей - позволяет пользователю указать символ, который будет использоваться в качестве разделителя новостей. Рекомендуемые известные символы: ("."),(","),("/")
- Отступ между текстом новостей - позволяет пользователю указать расстояние в пикселях между новостями и символом разделения новостей. Расстояние актуально как для текущей проигрываемой новости, так и для следующей. Это значит, что обе новости буду находиться на одинаковом расстоянии от символа разделения
- Цвет текста бегущей строки - позволяет пользователю выбрать цвет текста, который будет использоваться для бегущей строки
- Размер шрифта бегущей строки - позволяет пользователю указать числовое значение, которое будет использоваться в качестве размера шрифта для бегущей строки
- Направление движения бегущей строки - позволяет пользователю выбрать направление, в котором будет двигаться бегущая строка. В текущей реализации доступно два варианта: слева направо и справа налево
- Отступ бегущей строки - измеряется в пикселях и позволяет указать числовым значением отступ при включенной бегущей строке относительно левой и правой части экрана
Слайдер с палитрами
Слайдер цветов позволяет пользователю выбирать как будет отображаться фон для новостей и какое количество фонов будет использоваться для новостей.
Для того, чтобы добавить один фон пользователю необходимо нажать "Добавить цвет".
После добавленная на экране настроек палитра для слайдера позволяет пользователю создать отображение новости под свой нужды. Добавлять палитры можно без ограничений, но нужно понимать, что они будут меняться вместе с новостью.
Если у пользователя палитр меньше, чем количество новостей, то проигрывание использование палитра начнется заново.
Настройка цветового отображения
Все палитры для слайдеров имеют возможность делать градиентный переход. Пользователь может выставить любое количество точек градиента с помощью клика на панели градиента.
Выбрав нужную точку с помощью клика мыши, пользователь может установить ей определенный цвет. Когда точка не выбрана ее отображение - белый незакрашенный круг. Когда точка выбрана - ее отображение белый закрашенный круг.
Пользователю два вида отображения градиента:
- Снизу вверх - данный градиент имеет возможность сменить направление градиента с помощью "крутилки" (также ей можно указать направление в градусах)
- От центра к краю - данный градиент распространяет изменение цвета от центра к краю
После добавления одного модуля настройки слайдера пользователь сможет настроить цветовую схему для отображения фона. Цвета можно выбирать с помощью:
- Палитры - цвет выбирается на палитре с помощью мыши
- HEX кода - прописывается HEX-код нужного цвета можно узнать в сети
- RGB панель - необходимо выставить числовые значения на RGB панели для каждого из основных цветов можно узнать в сети
Также пользователю доступен "ползунок" яркости цвета позволяющий регулировать яркость и насыщенность цвета. В качестве альтернативы "ползунку" можно использовать параметр "Alpha", также отвечающий за яркость.
Добавление настроенного виджета в трансляцию
Чтобы полностью ознакомиться с работой данной функциональность пользователю необходимо запустить трансляцию с расписанием и добавить в качестве контента данный виджет. Чтобы ознакомиться с описанными ранее шагами по созданию трансляции и расписания рекомендуется просмотреть следующие статьи из Wikipedia:
Видеоинструкция
Настройка виджета динамического отображения новостей через RSS
Дополнительная информация
Если данная статья не помогает использовать функционал по назначению или после ее прочтения остаются вопросы можно озвучить данные вопросы в разделе "Обсуждения" вверху страницы.
Также дополнительную информацию можно узнать на странице Как взаимодействовать пользователю с разделом "Обсуждения"