WordPressでtwitterのシェアボタンをつけようと、
header.phpを編集中…。
OGPの設定をこのようにして最後の４行に、twitter cardsの設定を記述してみた。
twitter cardsの設定はこちらから
validatorに自分のブログを登録します
https://cards-dev.twitter.com/validator
【参考】
Twitter Cards(ツイッターカード)の設定と申請方法｜ツイートに記事の概要を表示！
http://netbiz-life.com/archives/3487Twitter Cardsの設定！ツイートされた時、概要、アイキャッチを表示する方法http://millkeyweb.com/twitter-cards/
メールアドレスが承認されてから… header.php に この４行を付け足しました！
<!–Twtter Cards–>
<meta name=”twitter:card” content=”summary”>
<meta name=”twitter:site” content=”@knnkanda”>
<meta name=”twitter:creator” content=”www.4knn.tv @knnkanda”>
<meta name=”twitter:domain” content=”https://4knn.tv/” />
なので、現在のこのwordPress のheader.phpの
<head>から</head>の部分は下記のようになりました。
<!DOCTYPE html>
<html class=”no-js” <?php language_attributes(); ?>>
<head prefix=”og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#”>
<meta charset=”<?php bloginfo(‘charset’); ?>”>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title><?php wp_title(”); ?></title>
<link rel=”pingback” href=”<?php bloginfo(‘pingback_url’); ?>”>
<?php wp_head(); ?>
<!–OGPここから–>
<meta property=’og:locale’ content=’ja_JP’>
<meta property=’fb:admins’ content=’730236113′>
<meta property=’article:publisher’ content=’https://www.facebook.com/knnkanda’ />
<?php if(is_single()){ // 投稿記事 ?>
<meta property=’og:type’ content=’article’>
<meta property=’og:title’ content='<?php the_title() ?>’>
<meta property=’og:url’ content='<?php the_permalink() ?>’>
<meta property=’og:description’ content='<?php echo mb_substr(get_the_excerpt(), 0, 100) ?>’>
<?php } else { //ホーム・カテゴリー・固定ページなど ?>
<meta property=’og:type’ content=’website’>
<meta property=’og:title’ content='<?php bloginfo(‘name’) ?>’>
<meta property=’og:url’ content='<?php bloginfo(‘url’) ?>’>
<meta property=’og:description’ content='<?php bloginfo(‘description’) ?>’>
<?php } ?>
<meta property=’og:site_name’ content='<?php bloginfo(‘name’); ?>’>
<?php
if (is_single() or is_page()){//投稿記事か固定ページ
if (has_post_thumbnail()){//アイキャッチがある場合
$image_id = get_post_thumbnail_id();
$image = wp_get_attachment_image_src($image_id, ‘full’);
echo ‘<meta property=”og:image” content=”‘.$image[0].’”>’;echo “\n”;
} elseif( preg_match( ‘/<img.*?src=([“\’])(.+?)\1.*?>/i’, $post->post_content, $imgurl ) && !is_archive()) {//アイキャッチ以外の画像がある場合
echo ‘<meta property=”og:image” content=”‘.$imgurl[2].’”>’;echo “\n”;
} else {//画像が1つも無い場合
echo ‘<meta property=”og:image” content=”http://i.gyazo.com/df48d19d1c934ac50990d60bad3a0b2d.png”>’;echo “\n”;
}
} else { //ホーム・カテゴリーページなど
echo ‘<meta property=”og:image” content=”http://i.gyazo.com/df48d19d1c934ac50990d60bad3a0b2d.png”>’;echo “\n”;
}
?>
<!–Twtter Cards–>
<meta name=”twitter:card” content=”summary”>
<meta name=”twitter:site” content=”@knnkanda”>
<meta name=”twitter:creator” content=”www.4knn.tv @knnkanda”>
<meta name=”twitter:domain” content=”https://4knn.tv/” />
<!–OGPここまで–>
</head>
