12 o'clock

single.phpを用意する

既にあるsingle.phpをコピペし、シンプル個人サイトの場合は「single-novel.php」、EASELの場合は「single-works-◯◯.php（小説のタクソノミー）」にタイトル変更する

novel viewerをダウンロードし、自分のサーバーにアップロードする

こちら → novel viewer
zipファイルを展開したら自分のサーバーにアップロードする
※WordPressの画面からアップロードするのではなく、FTP等を使ってサーバーへアップロードすること。
　どこへアップロードしたらいいかわからない場合はとりあえずルートでいいです。

head.phpを編集する

</head>の直前に<link rel="stylesheet" href="/novel-viewer/novel-viewer.css">を追記
※href=の後ろはnovel viewerをアップロードした場所のアドレスに変える

singleを編集する

<?php the_content(); ?>の前後を<div class="env-base">〜</div>で囲む
</body>の直前に<script src="/novel-viewer/novel-viewer.js"></script>を追記
これでnovel viewerの導入は完了です。

novel viewerの編集をする

novel-viewer.cssとnovel-viewer.jsを編集することで、背景色・文字色・フォント等々をカスタムできます。

いいねボタン for WordPressをダウンロードしプラグインとしてアップロードする

こちら → いいねボタン for WordPress
WordPress画面のプラグイン画面からアップロードする
novel viewerと併用しない場合は有効化するだけでいいねボタンが追加されます

前提として、上記までの作業は全てやっておいてください。

singleを編集する

<div class="env-base">〜</div>の直後に<?php iineForWP(); ?>を追記

プラグイン画面からいいねボタンの設定を切っておく

「いいねボタンの自動挿入」をオフにする
これらの作業をやっておかないといいねボタンのレイアウトが崩れます

こちら → 【WordPressの子テーマ】作成方法と使い方を初心者向けに解説
functionほか新たにファイルを作る際は文字コードを「UTF-8（BOMなし）」にすること。「UTF-8N」とかの表記になってることもある。

サイト全体にbasic認証をかけているとこのエラーが出た気がする。
htaccessを修正要。

それが原因じゃない場合、プラグインをひとつずつ停止したりキャッシュ削除してエラーが消えるか確認
→消えない場合は他のテーマや公式テーマに切り替えてエラーが消えるか確認
→私の場合はこれでエラーが消えたので原因はインストールしたテーマにあった
phpファイルの中にUTF-8（BOMあり）があるとこのエラーが出る。
私の場合は子テーマを作る時にfanction.phpをBOMありにしてたのが原因。
functionをUTF-8Nにして保存しなおしてアップロードしたら治った。

いいねボタンのプラグインを消したあとにsingleの修正を忘れるとそうなる。