ブログカードはアクセスを爆増させるチャンス

2016/09/14更新 カテゴリー:ビジネスハック タグ: ,
  • このエントリーをはてなブックマークに追加

wordpress4.4から、はてなのブログカードのようなリンク機能が追加されました。

メールマガジンも、まだまだ捨てたもんじゃない。


こんな感じのリンクですが、oembedという規格を使っています。oembedとはurlを貼り付けるだけで、埋め込みタグを生成できるようにするための統一規格。TwitterやYoutubeなどで採用されています。

今回は、このブログカードのいいところと、実装方法をご紹介します。

SPONSOR

過去記事にもっと光を与えられる

2014年8月29日、はてなブログがブログカードなるものを作りました。
ブログカードブログカードとは、上のようにアイキャッチ画像、タイトル、概要の情報をまとめたカード形式のリンクのことをいいます。

ただのテキストリンクに比べて、アイキャッチやタイトルと概要が書かれている方が情報量が多く、ユーザーが見たい記事かどうかが判断できるので好まれます。

このような機能がWordpressにはいままでなかったのですが、バージョン4.4から標準機能として、ついに実装されました。WordPressにURLを貼り付けるだけで使えます。

さらに記事リンクだけでなく、例えば、twitterのアドレスを貼り付けてみると…


このように表示されます。WordPressの記事内ではtwitterのURLを入れてるだけです。
ほかにも、DailyMotion, Flickr, Hulu, Instagram, Twitter, Youtubeなどに対応しています。

過去記事のリライトでコンテンツの価値を高める

ブログカードが使えるようになった機会に、過去記事のリライト(編集)をおすすめします。

ブログカードに限らず、過去記事をリライトして関連する記事にリンクをはることは大事です。関連する記事を必要な箇所でリンクすればユーザーにとっての更なる情報提供になり、満足度もあがるからです。新規記事を書くのは労力が大きいですが、過去記事のリライトなら労力も少なく、コンテンツの質を高めることができます。

さらに、もう一ついいことがあります。

ブログへのアクセスの流れは、新規記事投稿→SNS投稿でユーザー訪問→検索エンジンからユーザー訪問となっています。基本的にSNSにアップするのは新規記事を投稿した時ですが、twitterやfacebookはタイムラインですので、見逃しているユーザーもたくさんいるはず。

リライトによって記事のクオリティを高めたら、SNSでアップしましょう。こうすることで、再び見てもらえる機会も増えます。リライトはいいことばかり。ブログカードを導入したら、ぜひ過去記事をリライトしてコンテンツの価値を高めましょう。

SPONSOR

WordPressブログカードの使い方

基本的には記事内にURLを書くだけでブログカードが使えます。ただ、そのままのデザインが不満なら、カスタマイズ可能です。

wp-includes内のtheme-compatフォルダにテンプレートが入っています。下の5つのファイルをまるっとコピーして、テーマフォルダ内に入れましょう。
embed-404.php
embed-content.php
embed.php
footer-embed.php
header-embed.php

各ファイルは下図の構成になっています。
embed_parts_4.5あとは、これらのphpファイルを触ってカスタマイズできます。イリテクの場合はシェアボタンやコメント数を消したり、幅を広げたりしました。

CSSの調整もできます。まず、wp-includes/wp-embed-template.cssをコピー。
テーマ内のfunctions.phpに以下を追加。

function embed_style() {
    wp_enqueue_style('wp-embed-template-org', get_stylesheet_directory_uri() . '/resource/css/embed.css');
}
add_filter('embed_head', 'embed_style');

この場合/resource/css/embed.cssを読み込むようにしています。embed.cssを変更すればデザインも変わります。

ブラウザの開発ツールなどでCSSのセレクタなどを調べると便利です。

ブラウザ上でCSSの変更が試せる!Safariの開発ツールはコーディングに手放せない

注意点として、基本的に内部リンクはそのまま使えますが、外部リンクの場合は許可設定が必要です。外部サイトに対応するには、個別にfunction.phpに書き込みます。

wp_oembed_add_provider('http://.+hate.+', 'https://hatenablog.com/oembed');

上記ははてなブログの記事を埋め込みたい場合の設定です。

ただ、デメリットとしてoembedに対応していないサイトは使えません。また、自分のブログがhttpsだとhttpのサイトから引っ張ってこれません。たとえば、はてなブログはhttpにしか対応していないので、イリテクのhttpsではセキュリティ上の問題から表示できないのです。

ブログカードはURLを貼り付けるだけで使える手軽さがあります。導入するだけで、ただのリンクをよりリッチな表現へと変えることができます。これを使わない手はないでしょう。さらにセットで過去記事のリライトをして関連する有用な記事を活かしましょう。

  • このエントリーをはてなブックマークに追加
SPONSOR

PROFILE

プロフィール

入江 慎吾/サービス開発だけで生きていく
15年続けた受託開発をやめ、自分が作ったサービスだけで生きていくことを決意。同じゴールを目指す仲間が集まる入江開発室を運営 / 師弟関係がつくれるサービス「MENTA」をつくりました。
(詳しいプロフィール)

PRODUCT

イリテクで開発したプロダクト

RELATION

関連する記事

SPONSOR

TAG

タグから記事をさがす