Мета теги для соціальних мереж
Створюю і просуваю комерційні сайти та інтернет-магазини з 2008 року. 23-05-2014, 22:21 3 439 0Ні для кого не секрет, що інтеграція вашого сайту з такими соціальними мережами, як Facebook, Twitter або Google Plus може значною мірою збільшити трафік і продажу на вашому сайті. У цій статті ми розглянемо набір мета тегів соціальних мереж, які дозволять вам чітко визначати заголовки, описи та іншу інформацію, яку повинна забирати та чи інша соціальна мережа з ваших сторінок.
Замітка: всі розглянуті мета теги необхідно помістити в розділ HEAD.
Почнемо з Facebook і VK які розуміють наступні теги.
<meta property="og:type" content="website"/> <!-- Можливі варіанти: article, website, book, profile -->
<meta property="og:title" content="Название страницы"/>
<meta property="og:description" content="Описание"/>
<meta property="og:image" content="https://website.com/image250X250.png"/>
<meta property="og:url" content="http://www.site.com"/>
<meta property="og:site_name" content="Название сайта"/>
<meta property="og:see_also" content="http://www.website.com"/>
<!-- далі тільки для фейсбуку -->
<meta property="fb:admins" content="Facebook_ID"/>
<meta property="profile:first_name" content="Имя"/>
<meta property="profile:last_name" content="Фамилия"/>
<meta property="profile:username" content="Ник"/>
Twitter зрозуміє ось такі мета-теги:
<meta name="twitter:card" content="summary"/> <!-- Тип окна -->
<meta name="twitter:site" content="Название сайта"/>
<meta name="twitter:title" content="Название страницы">
<meta name="twitter:description" content="Описание"/>
<meta name="twitter:creator" content="автор"/>
<meta name="twitter:image:src" content="https://website.com/image250X250.png"/>
<meta name="twitter:domain" content="website.com"/>
Далі кілька мета тегів, зрозумілих соціальній мережі Google Plus:
<meta itemprop="name" content="Название сайта"/>
<meta itemprop="description" content="Описание сайта"/>
<meta itemprop="image" content="https://website.com/image250X250.png"/>
Допомагаємо Google визначити місце розташування вашого магазина або офісу, а так само іншу контактну інформацію:
<meta property="place:location:latitude" content="13.062616"/>
<meta property="place:location:longitude" content="80.229508"/>
<meta property="business:contact_dаta:street_address" content="Название улицы"/>
<meta property="business:contact_dаta:locality" content="Город"/>
<meta property="business:contact_dаta:postal_code" content="Индекс"/>
<meta property="business:contact_dаta:country_name" content="Страна"/>
<meta property="business:contact_dаta:email" content="cotact@mail.com"/>
<meta property="business:contact_dаta:phone_number" content="+91 1234567890"/>
<meta property="business:contact_dаta:website" content="http://www.website.com"/>
Мета теги для сторінок з відео:
<meta property="og:title" content="Мій улюблений ролик"/>
<meta property="og:url" content="http://myhost.ua/video.html"/>
<meta property="og:image" content="http://myhost.ua/video/my_video.jpg"/>
<meta property="og:description" content="Формула 1, перемога моєї улюбленої команди"/>
<meta property="og:video" content="http://myhost.ua/video/my_video.swf" />
<meta property="og:video:height" content="640" />
<meta property="og:video:width" content="480" />
<meta property="og:duration" content="56" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
og:title — заголовок сторінки/статті/відеоролика (обов'язковий для індексування)
og:video — шлях до відеоплеєра або файлу (обов'язковий для індексування)
og:video:type — тип відео, наприклад: application/x-shockwave-flash, video/webm, video/mp4, video/ogg (обов'язковий для індексування)
og:image — посилання на обкладинку (обов'язкове для індексування)
og:description — опис сторінки/статті/відеоролика (бажано)
og:video:height і og:video:width — висота і ширина ролика (бажані атрибути).
og:duration — тривалість ролика в секундах (бажана)
og:url — канонічний шлях до сторінки, наприклад: http://myhost.ua/video.html (необов'язковий)
og:latitude і og:longitude — широта і довгота місця зйомки (необов'язкові)
Звертаємо увагу, що також обов'язковим є зазначення простору імен: xmlns:og="http://ogp.me/ns#".