西野竜平の脳壊ブログ

無職同然の黒子"西野竜平"の創作物紹介から日常のあれこれまで

自身のウェブサイトで電子書籍が読める様にする方法。

スポンサーリンク

 ガラパゴスコンテンツサイト"竜平堂"を運営している孤独な西野竜平です。

 

 今まで"Amazon Kindle Unlimited"を利用して電子書籍の公開をしていましたが、管理が面倒くさくなってしまったので、「自分のウェブサイトで電子書籍を載せよう!」とより面倒くさい方向に行ってしまいました。

 

 はじめは全然やり方判りませんでしたが、いざ終わってみると管理が楽。

 

 漫画やイラスト集、電子書籍を投稿するサイトがたくさんあるので、自分のホームページで公開する事を選ぶ人っているのかな?って思いましたが、電子書籍を販売しているなら試し読み版を自炊で公開も出来るからメリット大きいのかな。と思いブログにしてしまいました。

 


 

 


無料の電子書籍リーダー「BiB/i」

bibi.epub.link

 日本電子出版協会主催「JEPA 電子書籍出版アワード2014」に特別審査員賞を受賞された松島智さんが開発した電子書籍配信ツール。

 

 「いやぁ探せばあるもんだなぁ」といざやってみたものの、プログラミング初心者の私には設置マニュアルを理解するのが難しかったです(´;ω;`)

bibi.epub.link

 

 主に「03. ウェブに公開する」「04. ウェブページに埋め込む」で躓きました。

 


実際に設置してみよう

 はじめは戸惑いましたが、何となく理解していく事が出来ました。

f:id:kamigurigurishino:20190421083839p:plain

竜平堂 | 電子書籍

 シェアボタンや目次、拡大、単一か見開きかのオプションなど付いててとっても快適です。総ページ数と現地点のページ数も表示されて使いやすいです。

 


やり方

 まず、公式サイトで「BiB/i」本体をダウンロード。

bibi.epub.link

 

 「bibi-0.999.9-r8.zip」というZipファイルが保存できましたら、いったん解凍。その中に「bib」というフォルダがあるので、中身ごとウェブサイトのローカルに引越しします。

 その後、空っぽの「bibi-0.999.9-r8」はややこしくなるので削除しましょう。

f:id:kamigurigurishino:20190421084604p:plain

 

 中身は以下の引用部分。

 

▼bib (フォルダ) …このフォルダを使用します

▼bookshelf (フォルダ
)  …ウェブ公開したい EPUB をここに入れます
▼i (フォルダ)  
…BiB/i の本体です
▼extensions (フォルダ)
 …機能拡張ファイルが入っています(中身は割愛)
▼index.html (htmlファイル)
 …これをブラウザで表示して使います。
▼presets (フォルダ
) …表示カスタマイズ用のプリセットファイルが入っています
▼default.js (jsファイル) 
…これを編集することで表示を様々にカスタマイズすることができます
▼res (フォルダ)
 …BiB/i 本体のプログラムなどがまとめられています(中身は割愛)
▼i.js (jsファイル) 
…ウェブページへの埋め込みに使用します
▼i.css (cssファイル) 
…ウェブページに埋め込まれたときの基本スタイルが書かれています。

次に、公開させたい電子書籍「.epub」ファイルを準備してください。

f:id:kamigurigurishino:20190421210457p:plain

この「.epub」の拡張子を「.zip」に書き換えます。

f:id:kamigurigurishino:20190421210622p:plain

このzipファイルを「bib」フォルダの中にある「bookshelf」フォルダの中で解凍します。

f:id:kamigurigurishino:20190421210858p:plain

 私は、ボタンを押すと電子書籍リーダーが起動する様にしたいので、

>|html|
<a href="bib/i/index.html?book=testbook" class="btn-square">READ</a>
||<

 と記述しました。

f:id:kamigurigurishino:20190421211648p:plain

 このボタンを押せば、この通り、本が開きした。

 

【ブラウザ】

f:id:kamigurigurishino:20190421211943p:plain

【スマホ】

f:id:kamigurigurishino:20190421212058p:plain

 


最後に

 これで、ウェブブラウザで電子書籍が読める様になりました!やったー!

 漫画やイラスト集をデジタル販売されている方で、自身のウェブサイトを展開されている方は試し読みページを作成して置いてみると良いかもしれませんね。

 また、私みたいに物好きで無料Web漫画を作ってる方にも持ってこいのプログラムです。

 リーダー自体に各電子書籍用のシェアボタンも付いているし、結構便利かもしれません。