令和に個人サイトを作る話～WordPressテーマ「EASEL」を使ってみた～
初めて作った個人サイト（自作の小説展示用）はMicrosoft Word+HTMLタグ手打ちでジオシティーズ産でしたあれいつだっけ？？？ 2001年とかその辺だな？？？？？ そのまま放置してたらジオシティーズごと消えました。というのが去年の話。
その後、2004年にfc2ホームページで作った個人サイト（女性向け二次創作同人サイト）はまだ生きてるけど10年以上更新できてない。あまりにひどい状態なのでそのうち何とかしたいとは思ってる。
という状態で最初の個人サイト開設から約20年、Twitterのちょっと近場の遠くの方（概念）で学級会（概念）が起こるたびに「個人サイトに帰る！」と叫びつつ、しかしCSSとかCMSとか言われてもわかんない……と検索画面を閉じてpixivに投稿する日々を送っていたのですが。
「do」では、個人の創作・同人サイトを盛り上げたいという目的のもと、htmlテンプレートを無料で配布しています。その他役立つ情報なども、多くの方に喜んでいただくためできる限り無償で提供していく方針です。
（「do」の活動への支援について https://do.gt-gt.org/patreon/）
Twitterでこちらサイトの紹介ツイートがRTされてきて、世の中には親切な人がいるんだなぁ、と思っていたら。
EASELは、イラスト・小説などを自主制作・発表する人のためのWordPressテーマです。無料で利用でき、ライセンスはGPLを採用しています。
WordPressに不慣れな人でも悩まず、かんたんに、そして便利に作品を展示できるよう、いろいろな機能を実装しました。
これなら私でもなんとかなるんじゃない？？？？？？
ってなったので早速ダウンロードして無料サーバーに会員登録して設定してみました。この時点でWordPress初体験です。
ここからは自分自身の備忘録として「よくわからないけど親切な人が書いてくれたとおりにいじったらなんとかなった」レベルの人間がWordPressを選んだ理由と個人サイト公開前までのメモです。根本的にわかってないのでとんちきなこと言ってても流してくれると嬉しいというか、そのレベルでもなんとかなりましたよ、という記録。
WordPressにした理由
上記のWordPressテーマを見つけて使ってみたかったから、というのが前提としてあるのですが、もともと個人サイトに踏み切れない理由に「小説の数が多くてめんどくさい」というのがありまして。
・一千字から一万字程度の小説を複数投稿するので面倒をなるべく省きたい（本文の改行とかカテゴリー分けとかリスト化とか）
・自力でなんとかなるのはHTMLまで、CSSは無理
・iPhoneをメインにして、複数のPCからも投稿・管理を行いたい
という条件のもと、ブラウザに表示される管理画面で操作するCMSを利用するのがいいのだろうな、CMS利用で同人サイトを作るなら自由度が高いらしいWordPressがいいんじゃないだろうか、という結論に至りました。
CMSが何なのかよく分かってなかったけど、親切な人が書いてくれた説明を読みながら実際に使ってみたらなんとなくわかったしなんとかなった（というか、もともとはてなとかのブログを調整してサイトっぽいものを作っていたので導入と設定さえできればなんとかなった）インターネット上の親切な人たちありがとう。
レンタルサーバーを借りよう
これは10年以上時が止まっているオタクでもわかるぞ！ ロリポかさくらでしょ！ って思って検索したら本当にロリポかさくらだったのでびっくりした。平成終わってないのか？ P.A.R.T.Y踊るか？
いや、WordPressが使えるという条件を付けても他にもいろいろなレンタルサーバーがありますけど、実際私も練習用に借りたのはスターサーバーのフリープランですけど、同人サイト設置のために利用することを考えると老舗の安心感を選ぶのだろうな、っていう。規約的な意味で。
サーバーの設定からWordPressの設定まで
WordPressで２時間で同人サイトを作る方法【初心者向け】
練習用にスターサーバーのフリープランを借りたのはこのページを参考にしたからでした。だいたいここに書いてあるとおりにやればなんとかなる（なった）
通常のWEBページやブログが「検索結果の上位に表示されてたくさんの人に見て欲しい」ものであるのに対して、同人サイトは基本的に「検索結果（特に作品名やキャラ名）に表示されたら困るし同好の士だけに見て欲しい」ものなので、こういう古（いにしえ）の同人サイトを知っている親切な人が書いてくれた同人サイトとしてのWEBページの作り方は必要な情報が揃っててとてもありがたいです。親切な人ありがとう。
今回、WordPressのテーマはここに書いてある「First」ではなく「EASEL」を使うので、通常の『投稿』と『カテゴリー』ではなく、「EASEL」独自のカスタム投稿タイプ『作品』で小説本文を投稿して『作品タイプ』でカテゴリー分けします。『投稿』のブログっぽさを排除したのが『作品』なのかな。固定ページやタグの使い方は同じ。
WordPressとテーマ「EASEL」の調整メモ
サイトのマニュアルを見ながら設定して、いじりたおしてる時に気になって調整した部分のメモ。
・テーマのCSSをいじるなら子テーマを設定した方が良いみたいだけど。
→親テーマがバージョンアップされた時、特にセキュリティ関係は子テーマにも同様の修正が必要になる場合があるけど私のレベルではその判別ができそうにない＋作業の手間が増えるだけなので子テーマは設定せず、テーマには直接触らないことを基本方針にする。固定ページ内でちょっとだけスタイル設定したいなら各投稿画面内のカスタムCSSを使えば済む。
・実際の投稿画面と「EASEL」マニュアルに表示されてる投稿画面が違うので混乱する。
→マニュアルで使ってるのはクラシックエディターなので、プラグイン「Classic Editor」をインストールする。
・ショートコード等で作品（小説）一覧を表示したときに、本文の冒頭部分ではなくpixivのキャプションみたいな説明を表示させたい。
→一覧表示の時は本文より「抜粋」が優先的に表示されるのでそちらに入力する（抜粋は本文ページに表示されない）
・パーマリンクの共通設定が作品投稿には反映されない（日本語タイトルがそのままURLとスラッグになる）
→別に問題はなさそうだけど気になるなら面倒くさがらずにファイル名を付ける。又は、新規作成時にタイトルを入力しないで本文だけで一回保存すれば自動的にURL（とスラッグ）を設定してくれる。
・ヘッダーと固定ページのセンターがなんか微妙にずれてるのが気になる。
→ウィジェット（サイドバー）を表示して２カラムにしたら解消した。
・作品のタグ機能は最近実装されたばかりみたいなのでしばらく様子見。
あとこれはテーマじゃなくてWordPressの設定の話なんだけど、
・小説をコピペした時に行頭の一字空白が自動的にリセットされてしまう。
→プラグイン「TinyMCE Advanced」をインストールして「クラシックブロックとクラシックエディター内のパラグラフタグを保持」にチェックを入れる。
参考：WordPressで行の先頭に入力した空白が消えてしまうとき
https://www.nishi2002.com/8817.html
これを設定したあたりで「WordPressでこれどうするんだ？ ってなったら検索して親切な人の言うとおりにプラグインを設定すればだいたいなんとかなる」ことを覚える。親切な人たちありがとう。
その他、セキュリティ関係あたりの設定は先にWordPressで個人サイト作ってたお友達が参考ページをまとめてたので参考にさせてもらいました。
あとは実際に運用しながら足りない部分を足していく感じになるかな。
そもそも個人サイトを作る理由
私は自分が書いたものを「見て見てーーーー！ あ、イイネついた？ 見てくれてありがとーーーー！」でだいたい満足するので基本的にはPrivatterを使ってTwitterに投稿、で十分です。もちろん反応とか感想とかもらえたらやったー！ って大はしゃぎする。
とはいえツイートはどんどんタイムラインを流れていってしまうし、他のことにも使っているPrivatterは一覧表示しても雑多な感じになるので「ついでに以前書いたのも見てくれるならここにあります」という固定の展示スペースが必要でした。それをpixivに託していたわけです。
せっかくpixivに投稿するなら同好の士に見てもらいたいと思って検索しやすいようにタグをつけてたけど、大きいジャンルだとジャンル内ルールみたいなのがあるっぽいことに気が付きまして。まあ性癖展示場だからタグによる棲み分けは大事だよねうんうんって一応ルールを調べるけど、だんだん面倒になってくる。
どうせ展示スペースとして間借りしてるだけなのだからタグはつけなくてもいいのではないか。でもそれだと投稿数と取り扱いジャンル数が多いから自分で探す時に面倒。じゃあもう個人サイトで好きにカテゴリー分けしてラベリングすればいいのでは……？ それだ！（それです）
というわけでこの夏、なんとか山奥に一軒家を建てられそうなので都会のタワマンから引っ越し予定です。無事に引っ越し完了したら旧宅（pixiv）の玄関前にご挨拶をそっと貼るつもりなのでよろしくね。
追記:ブログも引っ越したので修正版へのリンクを置いておきます。