Руководство для начинающих: как добавить карточки 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

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

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

Вы хотите провести аудит безопасности WordPress, чтобы убедиться, что ваш сайт в безопасности? WordPress из коробки очень безопасен. Однако, если вы подозреваете,

Как остановить и предотвратить DDoS-атаку на WordPress

WordPress - один из самых популярных конструкторов веб-сайтов в мире, потому что он предлагает мощные функции и безопасную кодовую базу. Однако это