Как изменить описание сайта, когда я делюсь ссылкой в вк?

Question

[RobinB]

Здравствуйте, когда я делюсь ссылкой на сайт в вк в описание его добавляется только содержимое title, как добавить сопутствующий текст и картинку?

Answer 1

[Leonid Fedotov]

Вам надо пользоваться OG-meta tags и Twitter-meta tags. Возможно в дальнейшем при оптимизации Вам потребуется весь набор:

<meta name="keywords" content="zuru,zuru os,zuruos,zuru cloud os,вход зуру,вход zuru,zuru entrance,zuru login">
<meta name="description" content="Entrance to the Zuru Cloud OS">
<meta name="robots" content="index,nofollow">
<meta name="generator" content="Zuru 1.0"/>
<meta name="author" content="iLeonidze">
<link rel="canonical" href="http://home.zuru.ml/"/>
<link rel="shortlink" href="http://home.zuru.ml"/>
<meta name="MobileOptimized" content="320">
<meta name="HandheldFriendly" content="True">
<meta http-equiv="cleartype" content="on">
<meta name="format-detection" content="telephone=yes">
<meta name="format-detection" content="address=yes">
<meta name="distribution" content="global">
<link rel="sitemap" type="application/xml" title="Sitemap" href="http://home.zuru.ml/sitemap.xml"/>
<meta name="application-name" content="Zuru Cloud OS">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<link rel="apple-touch-icon" href="http://home.zuru.ml/images/specials/apple/touch-icon-60x60.png"/>
<link rel="apple-touch-icon" sizes="76x76" href="http://home.zuru.ml/images/specials/apple/touch-icon-76x76.png"/>
<link rel="apple-touch-icon" sizes="120x120" href="http://home.zuru.ml/images/specials/apple/touch-icon-120x120.png"/>
<link rel="apple-touch-icon" sizes="152x152" href="http://home.zuru.ml/images/specials/apple/touch-icon-152x152.png"/>
<link rel="apple-touch-startup-image" media="(device-width: 320px)" href="http://<?=$_SERVER['SERVER_NAME']?>/images/specials/apple/touch-startup-image-320x460.png">
<link rel="apple-touch-startup-image" media="(device-width: 320px) and (-webkit-device-pixel-ratio: 2)" href="http://<?=$_SERVER['SERVER_NAME']?>/images/specials/apple/touch-startup-image-640x920.png">
<link rel="apple-touch-startup-image" media="(device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2)" href="http://<?=$_SERVER['SERVER_NAME']?>/images/specials/apple/touch-startup-image-640x1096.png">
<link rel="apple-touch-startup-image" media="(device-width: 768px) and (orientation: portrait)" href="http://<?=$_SERVER['SERVER_NAME']?>/images/specials/apple/touch-startup-image-768x1004.png">
<link rel="apple-touch-startup-image" media="(device-width: 768px) and (orientation: landscape)" href="http://<?=$_SERVER['SERVER_NAME']?>/images/specials/apple/touch-startup-image-1024x748.png">
<link rel="apple-touch-startup-image" media="(device-width: 1536px) and (orientation: portrait) and (-webkit-device-pixel-ratio: 2)" href="http://<?=$_SERVER['SERVER_NAME']?>/images/specials/apple/touch-startup-image-1536x2008.png">
<link rel="apple-touch-startup-image" media="(device-width: 1536px)  and (orientation: landscape) and (-webkit-device-pixel-ratio: 2)" href="http://<?=$_SERVER['SERVER_NAME']?>/images/specials/apple/touch-startup-image-2048x1496.png">
<meta name="msapplication-tooltip" content="Zuru Cloud OS"/>
<meta name="msapplication-config" content="IEconfig.xml" />
<meta name="msapplication-TileColor" content="#FFFFFF"/>
<meta name="msapplication-square70x70logo" content="./images/specials/windows8/square_70x70_logo.png"/>
<meta name="msapplication-square150x150logo" content="./images/specials/windows8/square_150x150_logo.png"/>
<meta name="msapplication-wide310x150logo" content="./images/specials/windows8/wide_310x150_logo.png"/>
<meta name="msapplication-square310x310logo" content="./images/specials/windows8/square_310x310_logo.png"/>
<meta name="msapplication-starturl" content="http://home.zuru.ml/"/>
<meta name="msapplication-navbutton-color" content="#FFF"/>
<meta name="msapplication-task" content="name=Start Zuru Cloud OS; action-uri=http://home.zuru.ml; icon-uri=http://home.zuru.ml/favicon.ico" />
<meta name="msapplication-task" content="name=Go to official website; action-uri=http://zuru.ml; icon-uri=http://home.zuru.ml/favicon.ico" />
<meta name="msapplication-task" content="name=Read out Twitter; action-uri=https://twitter.com/ZuruTeam; icon-uri=https://abs.twimg.com/favicons/favicon.ico" />
<meta name="msapplication-task" content="name=Subscribe to our VK Page; action-uri=https://twitter.com/ZuruTeam; icon-uri=http://vk.com/images/faviconnew.ico" />
<meta http-equiv="imagetoolbar" content="false"/>
<meta name="dc.language" content="RU">
<meta name="dc.source" content="http://home.zuru.ml/">
<meta name="dc.title" content="Zuru">
<meta name="dc.description" content="Cloud Operating System">
<link rel="yandex-tableau-widget" href="./yandex-tableau-manifest.json" />

Здесь дополнительные Meta-tags под Apple, Microsoft, Yandex Widgets и сервисы, понимающие тип dc.* + самое базовое SEO.

Comments

[Виталий Бобров]

зачем сюда кидать кучу кода с минимумом полезной инфы - куча иконок для моб и тд

[Leonid Fedotov]

bobrov1989: затем, что люди, которые интересуются оптимизацией сайта, наверняка будут также оптимизировать его под "моб и тд". Если Вы не понимаете в чем польза от этого, то это очень печально :)

[Виталий Бобров]

Leonid Fedotov: ета куча кода не имеет полностью отношения к теме - а моб и тд ето совсем другая тема в которой я разбираюсь побольше вашего

[Leonid Fedotov]

bobrov1989: никто в этом не сомневается :)

Answer 2

[Unknown Hero]

Можно использовать этот протокол - ogp.me , будет работать для многих сервисов и в ВК тоже.
Так же может возникнуть проблема с кешированием - Почему ВКонтакте не подцепляет мой OpenGraph image?

Comments

[RobinB]

Спасибо, в fb заработало, а вот в vk нет(

[Unknown Hero]

RobinB: дело в кеширование, если вы уже вставляли ссылку в ВК, то парсинг закешировался сервисов.
Решение: ждать. А сколько я не знаю

Answer 3

[Виталий Алексеенко]

Вот эта информация может оказаться вам полезной.

Здесь у них официальное вики, вот вроде вопрос схожей тематики: "Как сделать ссылку куда-либо через фото?", но у меня не получилось вставить.

Вот ещё какая-то статья на похожую тему.