Что такое Twitter Cards и как извлечь дополнительные преимущества |
||
01:16 19 апреля 2015 — Угниченко Дмитрий |
Twitter Cards — это механизм управления дополнительной информацией о вашей ссылке в социальной сети Twitter, при помощи которого веб-мастер может управлять выводом заголовков, описаний и изображений для ссылок в твитах.
Позволяет выйти за рамки 140 символов и получить больше кликов.
Карточка с расширенным описанием и маленькой картинкой
Микроразметка:
<meta name="twitter:card" content="summary"> <meta name="twitter:site" content="@ваш корпоративный аккаунт в Твиттере"> <meta name="twitter:title" content=" "Название статьи"> <meta name="twitter:description" content="Анонс материала. Например, из этой статьи вы узнаете то-то и то-то."> <meta name="twitter:image" content="http://site.ru/картинка для анонса.jpg">
Карточка с расширенным описанием и большой картинкой
Микроразметка:
<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@ваш корпоративный аккаунт в Твиттере"> <meta name="twitter:title" content="Название статьи"> <meta name="twitter:description" content="Анонс материала. Например, из этой статьи вы узнаете то-то и то-то."> <meta name="twitter:image:src" content="http://site.ru/картинка для анонса.jpg">
Галерея фотографий с описанием
Микроразметка:
<meta name="twitter:card" content="gallery"> <meta name="twitter:site" content="@с какого сайта фотографии"> <meta name="twitter:creator" content="@имя фотографа"> – этот тег можно не использовать <meta name="twitter:title" content="Название статьи или серии картинок"> <meta name="twitter:description" content="Описание статьи или серии картинок."> <meta name="twitter:image0" content="http://site.ru/картинка1.jpg "> <meta name="twitter:image1" content="http://site.ru/картинка2.jpg "> <meta name="twitter:image2" content="http://site.ru/картинка3.jpg "> <meta name="twitter:image3" content="http://site.ru/картинка4.jpg ">
Видеоплеер с описанием
Микроразметка:
<meta name="twitter:card" content="player"> <meta name="twitter:site" content="@Youtube или любой другой плеер"> <meta name="twitter:title" content="Название видео"> <meta name="twitter:description" content="Описание видео."> <meta name="twitter:image" content="http://ссылка на кадр из видео, например, http://i1.ytimg.com/vi/FMyjXRMhgVU/default.jpg"> – картинка должна быть такого же размера, как разрешение видео <meta name="twitter:player" content="URL видео"> <meta name="twitter:player:width" content="435"> <meta name="twitter:player:height" content="251">
Карточка товара
<meta name="twitter:card" content="product"> <meta name="twitter:site" content="@ваш корпоративный аккаунт в Твиттере"> <meta name="twitter:creator" content="@имя производителя"> <meta name="twitter:title" content="Название продукта"> <meta name="twitter:description" content="Описание продукта."> <meta name="twitter:image" content="http://site.ru/картинка для анонса.jpg"> <meta name="twitter:data1" content="Здесь пишем стоимость продукта. Например, 300 рублей"> <meta name="twitter:label1" content="Price"> <meta name="twitter:data2" content="Здесь пишем цвет продукта. Например, черный"> <meta name="twitter:label2" content="Color">
Валидация
Официальный валидатор, ссылка https://cards-dev.twitter.com/validator
Понравился пост?Да НетПонравилось 0, не понравилось 0 |
Расскажите о нас... |
0 комментариев
+ Добавить комментарий