У цьому посібнику ми напишемо плагін, який буде встановлювати для кожного посту у блозі зображення та короткий опис, які будуть відображатися на Facebook при публікації посту у ньому. Щоб це зробити, ми використовуємо дві можливості ядра WordPress: Популярні зображення для мініатюри та після Уривок для опису.
| Завантажити вихідні |
Крок 1. Створення плагіна
Створіть новий файл під назвою facebook-share-and-preview.php. Відкрийте його у своєму улюбленому текстовому редакторі та вставте наступний код:
<?php /* Plugin Name: Facebook Share and Preview Version: 1.0 Plugin URI: http://www.studio404.it/ Description: Adds a Share link to every post and set an image and a description for Facebook. Author: Claudio Simeone Author URI: http://www.studio404.it/ */ ?>
Збережіть файл у папку / Wp-content/plugins / та активуйте його у вкладці Плагіни у консолі адміністратора.
Крок 2. Активація мініатюр
Починаючи з версії 2.9 WordPress, дозволяє вам встановлювати мініатюру для кожного посту, але ця корисна функціональність повинна підтримуватися вашою темою. Так що відкрийте вашу сторінку додавання нового запису та перевірте, чи є блок "Мініатюра запису".
Якщо ви не бачите блок Мініатюра запису, додайте до файлу facebook-share-and-preview.php наступний код:
add_theme_support('post-thumbnails');
Ми також встановлюємо розмір зображення. Відповідно до документації Facebook, ширина та висота мініатюри повинні бути не меншими 50 пікселів і не повинні перевищувати 130х110 пікселів.
Зображення розміром 90х90 пікселів підійдуть чудово.
add_image_size('fb-preview', 90, 90, true);
Тепер WordPress автоматично створить мініатюру для Facebook із кожної мініатюри запису.
Крок 3. Отримання Featured Image та Post Excerpt (мініатюра та анонс)
Щоб отримати Популярні зображення и після Уривок, нам потрібні 2 функції:
// Get featured image function ST4_get_FB_image($post_ID) { $post_thumbnail_id = get_post_thumbnail_id( $post_ID ); if ($post_thumbnail_id) { $post_thumbnail_img = wp_get_attachment_image_src( $post_thumbnail_id, 'fb-preview'); return $post_thumbnail_img[0]; } } // Get post excerpt function ST4_get_FB_description($post) { if ($post->post_excerpt) { return $post->post_excerpt; } else { // Post excerpt is not set, so we take first 55 words from post content $excerpt_length = 55; // Clean post content $text = str_replace("rn"," ", strip_tags(strip_shortcodes($post->post_content))); $words = explode(' ', $text, $excerpt_length + 1); if (count($words) > $excerpt_length) { array_pop($words); $excerpt = implode(' ', $words); return $excerpt; } } }
Крок 4. Додавання meta-тегів Facebook на сторінку посту
Тепер ми пишемо функцію, яка отримує Популярні зображення и після Уривок посту і додає їх у блок <Head> сторінки посту.
Якщо і Популярні зображення, І після Уривок не прописані, теги не відображатимуться.
function ST4FB_header() { global $post; $post_description = ST4_get_FB_description($post); $post_featured_image = ST4_get_FB_image($post->ID); if ( (is_single()) AND ($post_featured_image) AND ($post_description) ) { ?> <meta name="title" content="<?php echo $post->post_title; ?>" /> <meta name="description" content="<?php echo $post_description; ?>" /> <link rel="image_src" href="<?php echo $post_featured_image; ?>" /> <?php } }
Щоб написати код мета-тегів у блок <Head> нашого блогу, ми прив'язуємось до wp_head:
add_action('wp_head', 'ST4FB_header');
Проблеми із шаблоном
Переконайтеся, що файл шаблону header.php є наступний шматок коду перед тегом
<?php wp_head(); ?>
Якщо його немає, додайте.
Крок 5. Додавання посилання на Facebook до сторінки посту
Відкрийте Зміст-single.php вашої теми та вставте наступний код там, де ви хочете розмістити посилання:
<a href="https://www.facebook.com/sharer.php?u=<?php echo urlencode(get_permalink($post->ID)); ?>&t=<?php echo urlencode($post->post_title); ?>">Share on Facebook</a>
Наприклад, якщо ви хочете додати посилання після вмісту поста:
<div class="entry-content"> <?php the_content(); ?> <p><a href="https://www.facebook.com/sharer.php?u=<?php echo urlencode(get_permalink($post->ID)); ?>&t=<?php echo urlencode($post->post_title); ?>">Share on Facebook</a></p> </div><!-- .entry-content -->
Проблеми із шаблоном
У цьому посібнику ми спираємося на стандартний шаблон WordPress: Двадцять одинадцять. Оскільки структура кожної теми WordPress може відрізнятись від інших, вам потрібно ідентифікувати, який файл відповідає за постову сторінку у вашій темі.
Стати в нагоді в цьому може інформація двох сторінок в WordPress Codex: Ієрархія шаблон и цикл. Якщо ви все ще не можете знайти потрібний файл, ви можете зв'язатися з автором вашої теми.
Результат
Тепер ви можете писати пост і додавати мініатюру запису (Популярні зображення) та анонс (Витримка):
Це опублікований пост з посиланнямПоділитися на Facebook":
Як тільки ви клацнете на посилання, з'явиться вікно попереднього перегляду публікації в Facebook.
Тепер у вас є деякий контроль над тим, як будуть відображатися ваші пости в Facebookколи ваші читачі ними поділяться.
Коментарі до запису: 9
Дякую за статтю. Для мене це якраз актуальна тема. Зробив та активував плагін, мета-теги виводить, але мініатюра, як і раніше, не з'являється у вікні share facebook. Може це тому, що маю мініатюру 240х180. Підкажіть плагін зменшує її автоматично для прив'язки до facebook? Допоможіть будь ласка розібратися. У мене тема twenty eleven.
Мініатюра має бути як мінімум 200х200 для підв'язки у Facebook, може бути в цьому проблема
зробив мініатюру 150х150. у коді сторінки в розділі all in one seo pack бачу rel="image_scr" з посиланням на мініатюру 150х150. Але, як і раніше, facebook її не виводить. Замість неї виводить значки соцмереж 90х90. Не можу зрозуміти, де не працює.
Повторюю, як МІНІМУМ 200 х 200!
Вставив у запис мініатюру 280х200. У коді сторінки побачив rel="image_scr" з посиланням на картинку 90х90. Але facebook відображає у вікні share неправильну (не ту) картинку. Правильно я розумію, що facebook вже прив'язав неправильну картинку і плагін буде працювати з нового запису з мініатюрою мінімум 200х200?
Можливо й так! Найкраще прожене посилання на статтю, що вам цікавить, через Facebook-парсер http://developers.facebook.com/tools/debug і ви відразу побачите, які помилки потрібно виправити
Дякую. спробую.
Так, реально, за допомогою посилання, що дає WPcafe.org, всі помилки показуються, можна як відладчик застосовувати.
все зробила, але нічого не з'явилося у записі, підкажіть.