Створення сайтів - студія веб-дизайну WebStudio2U Контактні дані веб-студії WebStudio2U RSS стрічка веб-студії WebStudio2U Мапа сайту Авторизація

Налаштування віджета сайту для Табло в Яндекс.Браузері

Налаштування віджета сайту для Табло в Яндекс.Браузері Яндекс.Браузер (Yandex) входить до числа найпопулярніших серед користувачів браузерів, тому оптимізувати сайт для найкращої взаємодії з цим браузером було б вельми корисно. Наприклад, кожен власник сайту може налаштувати для свого ресурсу правильне відображення віджета сайту на так званому Табло — одному з елементів інтерфейсу Яндекс.Браузера.

Табло в Яндекс.Браузері — це спеціальна панель з міні-ескізами сайтів, яка полегшує користувачам доступ до нещодавно відвіданих, найчастіше відвідуваних або ж обраних сайтів. Представлені в Табло міні-ескізи — це і є віджети сайтів, кожен з яких може містити логотип сайту, а також різні нотифікатори (опціонально).

Для створення віджета сайту при його додаванні користувачем на Табло Яндекс.Браузер самостійно «візьме» одне з зображень, що підходять для цієї мети, а також довільно вибере один із кольорів, що використовуються на сайті, для фонової заливки віджета. Зрозуміло, в цьому випадку гарантувати, що віджет сайту буде привабливий для відвідувачів, не вдасться.

API Табло дозволяє вебмайстрам керувати відображенням віджетів своїх сайтів і тим самим покращувати досвід користувачів. При цьому налаштування віджета сайту для Табло можливе двома способами — або за допомогою мета-тегу в HTML-коді сторінок сайту, або за допомогою маніфесту віджета.

Щоб налаштувати віджет сайту для Табло Яндекс.Браузера за допомогою мета-тега, в HTML-коді кожної сторінки необхідно в блоці <head> розмістити таку конструкцію:

<meta name="yandex-tableau-widget" content="logo=logo.png, color=#ffffff, feed=feed.json" />

Обидва атрибути даного мета-тега є обов'язковими. В атрибуті name вказується найменування мета-тега – yandex-tableau-widget, а в атрибуті content — опис для логотипу, фону заливки і нотифікаторів віджета. До значення параметра logo записується шлях до файлу з логотипом, а до значення параметра color — колір фонової заливки в шістнадцятковому форматі HEX (#xxxxxx). Параметр feed вказує шлях до файлу feed.json, що містить опис нотифікаторів для віджету. Даний параметр не є обов'язковим.

Другий спосіб налаштування віджета сайту для Табло в Яндекс.Браузері передбачає використання маніфесту віджета. У цьому випадку необхідно створити файл manifest.json, а потім у блоці <head> HTML-коду кожної сторінки сайту вказати посилання на цей файл в наступному форматі:

<link rel="yandex-tableau-widget" href="/manifest.json" />

Тут в атрибуті href вказується абсолютний або відносний шлях до файлу manifest.json, розміщеного на сервері в каталозі сайту. За замовчуванням Яндекс.Браузер завантажує файл маніфесту за зазначеним шляхом 1 раз на добу. Маніфест являє собою JSON-файл, який містить інформацію про використовувану версії API Табло, опис логотипу та кольори віджетів, а також шлях до файлу feed.json, в якому описуються нотифікатори.

Структура файлу manifest.json наступна:

{ "api_version": <номер_версії_АРІ_Табло>
"layout":
{ "logo": "<посилання на файл логотипу>",
"color": "<колір віджета в коді HEX>
},
"feed": <посилання на файл feed.json>
}

Особливості налаштування віджета для Табло Яндекс.Браузера

Щоб віджет сайту коректно відображався, важливо дотримуватися певних правил при його налаштуванні. Наприклад, до зображення логотипу пред'являється цілий ряд вимог: файл з зображенням повинен за «вагою» не перевищувати 300 КБ і повинен мати формат PNG; фон зображення обов'язково повинен бути прозорим, а максимально допустимі розміри зображення логотипу складають 300 пікселів за шириною і 120 — за висотою.

Файли manifest.json і feed.json не повинні перевищувати 100 КБ і 50 КБ відповідно. З файлу feed.json на віджеті сайту відображається максимум 3 нотифікатора, і якщо їх буде вказано в файлі більше (всього доступно 6 нотифікаторів), то автоматично будуть обрані для відображення 3 перші з них.

Структура файлу feed.json має наступний вигляд:

"feed":
{
"notifications": [
{"<назва значка 1>": <число>},
{"<назва значка 2>": <число>},
{"<назва значка 3>": <число>},
],
"refresh_time" : <частота завантаження файлу feed.json, хв, за замовчуванням 60 хв>
}

Тут в атрибуті «назва значка» вказується одне з 6 можливих значень для нотифікаторів: %BELL% — попередження, %EARTH% — записи в стрічці новин, %FRIEND% — запити на додавання в друзі, %MESSAGE% — листи, особисті повідомлення, %PHOTO% — фотографії, %CHAT% — миттєві повідомлення. А в атрибуті «число» вказується кількість (ціле число або з рухомою комою) не переглянутих повідомлень відповідного типу. Рекомендується при створенні файлу feed.json залишити для цього атрибута значення «0», щоб надалі це значення оновлювалося автоматично.

Теги:
віджет сайту в яндекс браузері, api табло, табло в яндекс браузері, налаштування віджета сайту