Twitterカードでタイムライン上にEPUBの電子書籍を表示させる方法

TwitterカードでEPUBの電子書籍を見せる方法

EPUBの電子書籍をTwitterカードで見せられます。

Twitterカードとは

Twitterではタイムラインに紹介したサイトのMETA情報から、そのサムネイルなどをタイムラインに大きく表示してくれます。動画などですと、よくタイムラインに大きくでて、ついタップしたくなっちゃいますよね。あれは、Twitterカードといってそれらコンテンツのページに、Twitterタイムライン上でこういうふうに表示させよ、という情報を追加で記述していますと、そうなります。

>>Twitterカード | Twitter Developers

もし、あなたがブログなどをお持ちで、ヘッダー情報の記述を変更できるのであれば、上記公式サイトを読み埋め込んで見てください。Twitter経由の集客に効果が期待できるでしょう。

TwitterカードでEPUBが使えるようになりました

TwitterカードでEPUBを見せる方法

>>Twitterタイムライン上で電子書籍を読めるビューワー、KADOKAWAが開発 Twitterの協力で世界初 – ITmedia ニュース

KADOKAWAは、この度Twitterタイムライン上で電子書籍を試し読みできるようになった、と発表しました。実はこれ、EPUBというオープンなファイル形式の電子書籍が対象なんです。そして、ですから、EPUBをブラウザで見せてくれるページをごにょごにょすれば、同様のことが出来てしまうということなのです。

試しにやってみたところ、ほんと簡単!スマホのTwitterアプリで見ますと、黒い画面でちょっとさみしいですが、タップしますとちゃんとブラウザでEPUBの電子書籍が読めちゃいます。ま、ブラウザに誘導できてますので、当たり前と言えば当たり前なのですが。とはいえ、いやあ楽しいですね。KDPなどでセルフ出版されている人は、こういう試し読みのプロモーションもありかと思います。

TwitterタイムラインでEPUBを表示させる方法

>>keageさんのツイート
こちらを参考にさせていただきました、ありがとうございます。

さて、Twitter上で電子書籍を見せる方法を、以下忘備録的にメモ。じつは、実験をいろいろやっていますと、Twitterカードにキャッシュが残ってしまい、同じURLでつぶやいていますと、更新した場合、最新のものが表示されないという不思議なことが。ですので、ちょっとURLをいじるとか、工夫が必要なので、以下にレシピを紹介します。とはいえ、全部無料で出来ますので、いやはや凄いですね。

準備物

・公開フォルダ(DropboxでOK)
・BiB/i (EPUBをブラウザで公開するビューワー)
>>BiB/i | Manual – ビビ 設置マニュアル
・EPUBファイル(でんでんコンバーターで作れます)
>>電書ちゃんのでんでんコンバーター – でんでんコンバーター
・テキストエディタ(Twitterカードの追記)
・Twitterアカウント

EPUBをツイッターで見せる方法

1.EPUBを作り、拡張子をzipにしてフォルダにしておきます。(EPUBの実態はファイル群をzipでまとめたものです。)
2.Dropboxなど公開可能な場所に、BiB/iを置いておきます。
3.BiB/i フォルダ内のiフォルダにindex.htmlがありますので、このヘッダーにTwitterカード情報を追記。
4.index.htmlを複製、hogehoge.html など、重複しないような名前でリネーム。
(ただしTwitterカードに書くEPUBのURLはindex.htmlのほうを指してOK)
5.フォルダ解凍した電子書籍を、BiB/iのbookshelfフォルダに入れます。

これで準備完了です!以下のように複製したファイル名プラス?book=フォルダ名 でアクセスすればあなたのEPUBの電子書籍がブラウザで読めます。
https://dl.dropboxusercontent.com/u/1234567890/bibi-0.996/bib/i/hogehoge.html?book=hogehoge

<meta name="twitter:card" content="player" />
<meta name="twitter:site" content="Twitterアカウント名" />
<meta name="twitter:title" content="書名" />
<meta name="twitter:description" content="著者名+書名がいいかも- BiB/i にて表示" />
<meta name="twitter:image" content="https://dl.dropboxusercontent.com/u/1234567890/bibi-.996/bibi.png" />
<meta name="twitter:player" content="https://dl.dropboxusercontent.com/u/1234567890/bibi-0.996/bib/i/index.html?book=hogehoge" />
<meta name="twitter:player:width" content="520" />
<meta name="twitter:player:height" content="560" />

BiB/iのindex.htmlと複製したhtmlファイルのTITLEタグの上などに、上記を参考にTwitterカードを追記して下さい。これで、タイムライン上で見せることが出来ます。

EPUBはHTMLファイル群なので・・・

ちなみに、EPUBの実態はxhtmlファイル群なので、Googleアナリティクスのトラッキングコードも入れられるような・・・。どのページで、長く留まって、どこでさくさく読んでいるのかなど、ちゃんとパーミションとった上でわかるのであれば面白いかもしれません。

そもそも、ブラウザのEPUBビューワーに、Googleアナリティクスが実装されているものもあるくらいですし。

>>Readiumに設定されたGoogle Analyticsについて – uraitoのいまだにブログ名が未定のブログ

マーケターやウェブ担当者の方で、メルマガなどのコンテンツが眠っている方は、EPUBにして電子書籍化してみてはいかがでしょうか。タッチポイントを増やす、ちょっとしたデジタルノベリティになりえるかもしれません。

・ ・ ・ ・ ・

>>安っ!アマゾンで半額以下になっている食品タイムセール
セール特設ページを見る

↓↓↓無料のニュースレターを配信中です

皆さんは電子書籍を読んでますか?