Добавление в социальную сеть ссылок на сайт

Очень часто хочется поделиться ссылкой на какую-нибудь страницу в инете с друзьями. И самое простое — это опубликовать ссылку у себя на странице в контакте или facebook. Но данные сайты довольно специфично формируют внешний вид того как показывать ссылку. Определенным образом берут заголовок, описание и картинку со страницы, для того чтобы сформировать блок со ссылкой. Если это ссылка на «чужой» сайт, то здесь ничего сделать нельзя. Если же сайт «свой», то решение существует.

Стандартно заголовок и описание берутся из тега title мета-тега description. С картинкой сложней… судя по всему берется первая картинка, которая подходит по своим параметрам.
Для того чтобы точно указать вконтакте или фейсбуку какие данные брать для оформления ссылки, существует специальный протокол. Это мета теги, которые размещаются в блоке HEAD страницы. Называется все это протоколом мета-тегов Open Graph.
Описание есть здесь: http://developers.facebook.com/docs/opengraph/
Если коротко, то для оформления ссылки больше всего важны следующие теги:

og:url - указывается корректная ссылка на страницу
og:title - заголовок блока ссылки
og:description - описание ссылки
og:image - полный URL картинки превью.

Пример использования одного из этих тегов:

<meta property="og:image" content="http://mysite.ru/image_facebook.jpg"/>

При этом желательно чтобы размеры картинки были не больше, чем 200 на 200 пикселей.
Проверить как ссылка на вашу страницу будет выглядеть вконтакте можно только попробовав добавить ее на страницу. Для фейсбука есть инструмент для отладки: http://developers.facebook.com/tools/debug

Запись опубликована в рубрике Полезности с метками , , . Добавьте в закладки постоянную ссылку.

Добавить комментарий