Плъгинът който ще направим днес, ще допринася за адекватното изглеждане на споделените връзки от нашия сайт в facebook а именно това са Open Graph Tags. Чрез Open Graph протокола изрично казваме на facebook crawler как да визуализира споделената връзка за да изглежда по-добре. Плъгинът ще прави това за нас автоматично, като на всеки пост, продукт или страница ще взима нейното заглавие, вид, адрес, съдържание и изображение.
Facebook crawler
Чрез плъгинът, който ще направим поемаме контрол върху facebook роботът, като му казваме как искаме да изглежда нашата връзка. Без Open Graph таговете процедурата става доста по тежка, след споделяне на връзка от вашия сайт роботът сканира страницата ви и взима това което му хареса.
Подходящ размер изображения
Друго на което според мен е хубаво да се обърне внимание са изображенията за високи резолюции използвайте картинка с размери 1200 x 630 пиксела, за ниски 600 x 315 пиксела. Като минимален е 200 x 200, под този размер дебъгера ще даде грешка и няма да ни се вижда изображението.
Писане на код
Преди да преминем към същинската част ще трябва да си направим основните неща, като да си направим директория в папка Plugins и самият плъгин, ако сте забравили как става може да си го припомните от статията Как да си направим WordPress Plugin.
Следваща стъпка е да копирате кода.
add_action('wp_head', 'cw_facebook_tags');
function cw_facebook_tags() {
if (is_single() || is_page() || is_home()) {
?>
<meta property="og:title" content="<?php the_title() ?>" />
<meta property="og:site_name" content="<?php bloginfo('name') ?>" />
<meta property="og:url" content="<?php the_permalink() ?>" />
<meta property="og:description" content="<?php $post = get_post($post); $content = substr($post->post_content, 0, 300);
echo htmlspecialchars($content, ENT_COMPAT, 'ISO-8859-1', true);
?>" />
<meta property="og:type" content="<?php if (is_home() || is_page()) { echo 'website'; } else { echo 'article'; } ?>" />
<?php if (has_post_thumbnail()) : $image = wp_get_attachment_image_src(get_post_thumbnail_id(), 'large'); ?>
<meta property="og:image" content="<?php echo $image[0]; ?>"/>
<?php endif; ?>
<?php
}
}
Като цяло няма нищо особено в този код, проверяваме дали е единичен пост, страница или началната страница на нашия уебсайт. Интегрираме мета таговете като за всеки взимаме данните които са необходими.
В GitHub профила съм качил малко по-разширена версия на плъгина. При интерес може да го разгледате или изтеглите от тук. Чрез него ще можете да задавате собствени og:title и og:description.
