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

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

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

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

Итак, у нас есть два разных поведения. Начните с простого:

Публикация в социальных сетях на компьютере:

Мы сосредоточимся только на Twitter, Facebook и LinkedIn. Поделиться на рабочем столе довольно просто. Все, что вам нужно сделать, это добавить тег привязки с href в качестве общих URL-адресов.

Twitter:

<a href="https://twitter.com/intent/tweet?text=<Your text>" > Share On Twitter </a>

Попробуйте поделиться этим: Поделиться в Twitter

Вы можете просто ввести URL-адреса в текст, и он будет автоматически выбран. Убедитесь, что вы используете encodeURI(text) для кодировки текста uri.

Facebook:

<a href="https://www.facebook.com/sharer/sharer.php?u=<URL>" >Share To Facebook </a>

Это поделится URL-адресом на Facebook: Поделиться на Facebook

LinkedIn:

<a href="https://www.linkedin.com/shareArticle?mini=true&url=<Your URL" >Share on LinkedIn </a>

Вот демонстрация: Поделиться в LinkedIn

Совместное использование на мобильных устройствах:

Каждый раз, когда вы нажимаете кнопку «Поделиться» в большинстве приложений, снизу появляется небольшое окно со списком всех приложений, которым вы можете поделиться. Что-то вроде этого

Это возможно, потому что приложения имеют доступ к API Native Share платформы. Веб-сайты также могут использовать собственный обмен через API WebShare. WebShare API. Он поддерживается как в Android, так и в IoS (уровень 2 не поддерживается в IoS, что позволяет обмениваться файлами).

Вы можете проверить, поддерживает ли браузер совместное использование, проверив, существует ли navigator.share. Чтобы проверить, можете ли вы делиться файлами (например, если доступен уровень 2 WebShare API), проверьте, существует ли navigator.canShare.

Также WebShare API доступен только на https и недоступен на http веб-сайте.

Вот код для обмена текстом и URL-адресами:

Совместное использование файлов (не поддерживается в IoS):

Если вы хотите увидеть, как это работает, зайдите на coronadaily.org, где я недавно реализовал общий доступ (доступный только на мобильных устройствах) с использованием API WebShare как для текста, так и для изображения (файла).

Сделайте свой сайт вирусным !!!