Руководство для начинающих: как добавить карточки Twitter в WordPress

/

Вы хотите добавить Twitter Cards на свой сайт WordPress? Twitter Cards позволяет прикреплять мультимедийные материалы к твитам, которые ссылаются на ваш контент. Это очень похоже на публикацию ссылки в Facebook, которая автоматически отображает предварительный просмотр с заголовком, сводкой и миниатюрой содержимого вашей страницы. В этой статье мы покажем вам, как добавить карточки Twitter в WordPress.

Добавление карточек Twitter на сайт WordPress

Как работают карточки Twitter?

Если в вашем твите есть ссылка на сайт, на котором включены карточки Twitter, есть возможность просмотреть сводку. Каждый раз, когда другой пользователь нажимает на твит, он видит это резюме, как на скриншоте ниже.

Предварительный просмотр карточек Twitter

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

Мы заметили это у некоторых популярных кураторов контента. Они будут твитнуть наши статьи без каких-либо сообщений через @abcили RT @cde. Это их право, но мы / вы как издатели особенно упускаем из виду, когда другие люди ретвитят ваш контент с чужими атрибутами.

Например, @def ретвитирует сообщение @abc без указания авторства, а другие люди ретвитируют @def. Тогда пользователи, просматривающие эти ретвиты, с большей вероятностью будут подписываться на @def, чем на @abc.

Часто кураторы контента делают это для того, чтобы твиты были короткими, и чтобы обеспечить ретвиты собственных твитов. С помощью твиттер-карт эта проблема решается, потому что вы получаете кредит на свой сайт за каждый твит, в котором упоминается ваша статья. Примечание: мы не выбираем кураторов контента. Это недостаток в 140 символов, и Twitter помогает исправить его с помощью карточек Twitter.

Например, когда Энни написала нашу статью в Твиттере, она не упомянула @abc. Но благодаря интеграции с нашими твиттер-картами мы получили полный кредит и риск. Обратите внимание на то, что на нем также есть кнопка перехода в один клик.

Превью ретвита с карточкой Twitter

Теперь, когда вы знаете о преимуществах твиттер-карт, давайте посмотрим, как реализовать их в WordPress.

Как добавить карточки Twitter в WordPress

Есть два способа добавления твиттер-карт в WordPress. Давайте посмотрим на них обоих.

Метод 1: плагин Yoast SEO

Если вы используете плагин WordPress SEO by Yoast, то вам повезло. Yoast имеет встроенную интеграцию с твиттер-картами, поэтому включить ее можно в несколько кликов.

Просто перейдите на страницу «Социальные сети» страницы настроек Yoast SEO. Введите свое имя пользователя Twitter и сохраните изменения.

Добавьте имя пользователя twitter на страницу в соцсетях в настройках SEO

После этого перейдите на вкладку Twitter. На вкладке Twitter вам нужно установить флажок Добавить метаданные карты Twitter. Выберите тип карты по умолчанию. Вы можете выбрать отображение сводки или сводки с большим изображением.

Включение твиттер-карт

Следующее, что вам нужно сделать, это перейти на страницу Пользователи »Мой профиль. Вы увидите новое поле в разделе «Контактная информация» для вашего имени пользователя Twitter. Введите здесь свое имя пользователя в Twitter.

Если у вас сайт с несколькими авторами, посоветуйте своим авторам заполнить эту часть в своем профиле. Таким образом, каждый конкретный автор также получает признание за свою работу. См. Пример ниже:

Предварительный просмотр карточек Twitter с указанием создателя или автора контента

Это все, что вы успешно добавили метатеги Twitter Cards на свой сайт WordPress.

Этот метод, безусловно, самый простой. Поскольку мы используем WordPress SEO от Yoast на всех наших веб-сайтах, мы используем этот метод.

Метод 2: жестко запрограммируйте это самостоятельно

Этот метод требует добавления кода в вашу тему или файлы дочерней темы. Просто откройте файл header.php и добавьте этот код непосредственно перед тегом </head>.

<?php
#twitter cards hack
if(is_single() || is_page()) {
    $twitter_url    = get_permalink();
    $twitter_title  = get_the_title();
    $twitter_desc   = get_the_excerpt();
    $twitter_thumbs = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), full );
    $twitter_thumb  = $twitter_thumbs[0];
    if(!$twitter_thumb) {
        $twitter_thumb = 'http://www.gravatar.com/avatar/8eb9ee80d39f13cbbad56da88ef3a6ee?rating=PG&size=75';
    }
    $twitter_name   = str_replace('@', '', get_the_author_meta('twitter'));
    ?>
<meta name="twitter:card" value="summary" />
<meta name="twitter:url" value="<?php echo $twitter_url; ?>" />
<meta name="twitter:title" value="<?php echo $twitter_title; ?>" />
<meta name="twitter:description" value="<?php echo $twitter_desc; ?>" />
<meta name="twitter:image" value="<?php echo $twitter_thumb; ?>" />
<meta name="twitter:site" value="@libdemvoice" />
    <?
    if($twitter_name) {
    ?>
    <meta name="twitter:creator" value="@<?php echo $twitter_name; ?>" />
    <?
    }
}
?>

Источник: Райан Каллен @artesea

Если вы не знаете, как работать с PHP или у вас возникли проблемы с методом 2, используйте метод 1.

Заключительный шаг: тестирование и проверка

Прежде чем ссылки с вашего сайта WordPress начнут показывать карты Twitter, вам необходимо сначала проверить их в валидаторе карт Twitter.

Просто перейдите на страницу Card Validator на сайте разработчиков Twitter. Введите URL-адрес любого сообщения с вашего сайта WordPress и нажмите кнопку предварительного просмотра карты.

Тестирование предварительного просмотра карт Twitter с помощью Cards Validator

Twitter покажет вам предварительный просмотр вашей карточки Twitter.

Обновление: раньше вам нужно было подавать заявку на участие в Twitter Cards. Однако Twitter внедрил систему, которая автоматически заносит домены в белый список, когда вы тестируете их с помощью валидатора или просто делитесь URL-адресом в Twitter.

Мы надеемся, что эта статья помогла вам добавить карточки Twitter в WordPress. Вы также можете увидеть наш список из 10 самых популярных уловок и плагинов Twitter для WordPress.

Нужна помощь с WordPress? Свяжитесь сейчас
[email protected]

Это переведенная версия оригинальной статьи от wpbeginner, весь контент, изображения и авторство принадлежит автору

Как сохранить данные контактной формы в базе данных WordPress

Недавно один из наших читателей спросил, можно ли сохранить данные контактной формы WordPress в базе данных? Обычно самые популярные плагины форм

Как исправить ошибку слишком большого количества запросов в WordPress 429

Вы видите ошибку 429 слишком много запросов на своем сайте WordPress? Эта ошибка может быть очень неприятной, потому что трудно понять, что ее вызывает.

13 плагинов и советов по улучшению админки WordPress

Хотите настроить админку WordPress? Возможно, вы хотите изменить цветовую схему по умолчанию, добавить свой собственный бренд или даже добавить новый

Как добавить выбор изображений в формы WordPress (повысить вовлеченность)

Недавно один из читателей спросил нас, как добавить выбор изображений в их формы WordPress. Может быть, вы тоже об этом задумывались. Вместо простого