Как добавить превью ссылок на сайт без плагинов

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

Зачем это нужно

Когда клиент наводит курсор на внутреннюю ссылку, он не знает, что за ней. Карточка с заголовком, описанием и картинкой снимает этот вопрос и повышает переходы внутри сайта. Подробнее о пользе в статье "Превью ссылок: как удержать клиента".

Как это работает

Скрипт newUX следит за ссылками внутри вашего домена и при наведении подгружает данные страницы: заголовок, описание и изображение. Данные кэшируются, поэтому повторный показ происходит мгновенно. Внешние ссылки по умолчанию не обрабатываются, чтобы не создавать лишних запросов.

Шаг 1. Подключите скрипт

Добавьте код вставки на сайт так же, как для остальных функций. Инструкция есть в статье "Как подключить скрипт newUX".

Шаг 2. Включите превью ссылок

В панели управления сайтом отметьте функцию "Превью ссылок". Отдельный плагин или тег для этого не нужен.

Шаг 3. Настройте контейнер (необязательно)

Если карточки должны появляться не везде, укажите селектор контейнера, например .main-content или main .article. Тогда превью работает только для ссылок внутри первого совпадения. Если такой контейнер на странице не найден, функция продолжает работать по всему документу.

Шаг 4. Проверьте результат

Откройте страницу сайта и наведите курсор на внутреннюю ссылку. Через короткую задержку должна появиться карточка. Уведите курсор: карточка исчезает.

Вставка на разных платформах

WordPress

Установите плагин для вставки кода в <head> или подвал темы и добавьте строку скрипта туда. Отдельный плагин для превью не нужен.

Tilda и конструкторы

Используйте блок "HTML-код" и вставьте скрипт один раз в футер сайта.

Обычный HTML

Вставьте строку перед закрывающим тегом </body> в общем шаблоне.

Частые ошибки

• Селектор указан, но не совпадает. Проверьте, что класс или тег на странице действительно существует. Если контейнер не найден, превью работает по всему документу, и это не ошибка.
• Ссылки ведут на другой домен. Превью работает только внутри вашего домена. Для внешних ссылок оно не срабатывает.
• Карточка не появляется. Проверьте, что скрипт подключён и функция включена в панели управления. Обновите страницу с очисткой кэша браузера.

Итог

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