[2022/03]WordPress運用マニュアル

Table of Content

ごあいさつ

本稿は自分と運営者用です。
このサイトはWordPressをローカルで作って記事を書いて、静的HTMLサイトジェネレータを使って高速化していますが、運用ルールが複雑です。
記事は私が書く事もあれば、家族が公開目的に書く事も想定しているので、特に子供が記事を書く事もある(ただし、公開できるかどうかは両親、特に私の承認が必要なフローにしています)ので、公開時には細心の注意を払うようにします。

記事を公開するには?

  1. 記事を書く
    1. この時のプレビューはローカルファイルなので、下書きでも公開でもどちらでもよい
    2. 画像をアップロードする場合は所定の方法でwebpに変換すること(ここには書きません)
  2. Simply-Staticでファイルを生成する(「静的ファイルを作成する」ボタン)
  3. Revisrを使ってGithubにpush
    1. 下書き状態の記事はpushされないので安心

新しくパソコンを買った時

パパが頑張って設定するので気にしなくていいです。

具体的には、localhostではつながらないので、買ったパソコンのhostsファイルを設定します。
wordpressホストマシンに向けて Local で設定した名前にしておきましょう。
なお、ホストマシンでlocalhostにするとややこしい事になるので、デフォルトのwordpress.localや他の値を任意で設定する事を推奨します。
(ここでは説明のため、デフォルトのwordpress.localとしておきます)

Windows

システムドライブ:¥Windows¥System32¥drivers¥etc¥hosts を管理者権限で開きます。メモ帳あたりでよいでしょう。

(ホストマシンのIPv4アドレス)  wordpress.local

Mac(Unix) / Linux

/etc/hosts または /private/etc/hostsにあります。編集時はnanoとかvimとか、お好きなものを使ってください。
設定内容はWindowsと同じです。

新しくスマホ(IPhone, Androidなど)を買った時

パパが頑張って設定するので、ちゃんと申告してください。

端末のhostsファイルを書き換えるのは難しいので、wordpress.localホストマシンにCharlesを入れて接続を承認する方法を採用します。
幸い、我が家では開発用途でキャリア契約していない端末が大量にあるので、これを使います。

無料版だと30分の時間制限がありますが、wordpressは自動下書き機能があるので途中でアクセス断されてもある程度は大丈夫です。
我が家ではそもそもスマホで長文を書く事は運用上想定しておらず(私の方針と意向により)1人1台の端末がある運用をしているので、基本的に自宅にいる場合はスマホを使うことはないです。

なお、外出時に使う端末から接続したい場合もあるので、そういった際はwordpress.localの「Live Links」機能を使います。
外部から接続できる事自体が問題とも言えるため、必要がなくなればLiveモードをOFFにするのが良いでしょう。

テーマ設定

今使っているのは Iconic Oneです。
以下、テーマを変えるたびに変更が必要なので注意。

header.php

<?php echo '<link rel="canonical" href="http://nomuraya.tk' . $_SERVER['REQUEST_URI'].'">'; ?>

これは、Firebaseが

  • web.app
  • firebaseapp.com

を対応している上、独自ドメインを使ったらその分まで追加されるため、リダイレクトをする等の対応が必要になります。
が、Firebaseでは.htaccessが使えなかったり、firebase.jsonのredirectsが動いたり動かなかったりリダイレクトループに陥ったりするので、そういう面倒臭い事を回避しながらドメインパワーを寄せるための措置です。

functions.php

主にQiitaのアドベントカレンダー用ですが、ダッシュボードに記事カレンダーを埋め込んでいます。
直接Googleカレンダーを見ればいいんですが、WordPressで完結したかったので埋め込みました。

/**
 * 追加部分
 */
/* ダッシュボードにスクリプトの埋め込みコードを追加 */
function announce_add_dashboard_widgets() {
  wp_add_dashboard_widget(
    'announce_dashboard_widget',          // ?
    '今日書く記事カレンダー',                  // ウィジェットのタイトル
    'announce_dashboard_widget_function'  // 呼び出す関数名
  );
}
function announce_dashboard_widget_function() {
  echo '(Googleカレンダーの埋め込みコード)';
}
add_action('wp_dashboard_setup', 'announce_add_dashboard_widgets');

プラグイン

後で目的を忘れるのでまとめておきます。

Accelerated Mobile Pages

https://nomuraya.tk/amp/ を参照。

All in One SEO

本来はこれ一つで解決するはずが、静的サイト化にあたり上手くいかないものが多かったので後述の課題を解消する。
使えたのはdiscriptionタグの制御のみ、付属のPro版前提のプラグイン(Google Analytics for WordPress by MonsterInsights)は削除。

Autoptimize

主にJavascriptの読み込みが遅いので、最適化してイライラしないページを意識。
一番辛いのはアドセンス。

BackWPup

データベース(.sql)のバックアップ用。環境を差し替える時に持っておきたいファイルを出してくれる。

Broken Link Checker

リンク切れを検出してくれる。参考サイトが繋がらなくなった時に大活躍。

執筆時点のもの。放置するとこんな感じにたまっていくので、気づいたらすぐやろう
スポンサードリンク

codec(AMPでは使えない)

有料記事を書くために設置。投げ銭機能がつけられるので副産物的に嬉しい効果。
運営者としては、収益化を期待はしてはいけないけど、なかったらなかったで困るもの。
利用者としては、良い記事やサービスに対して応援したい時に欲しいもの。

投げ銭機能のキャプションは利用者目線で欲しい情報がわかりやすい方が好きです

Companion Sitemap Generator

sitemap.xmlとrobots.txtを静的に出力してくれる、とても優秀なプラグイン。
All in One SEOでは足りない部分を埋めてくれている。
出力先が「/app/public」なので、これを静的サイトの出力先に移動するようCIを設定する必要がある。

生成したファイル: https://nomuraya.tk/sitemap.xml
現状はステータス「取得できませんでした」となるため、対策が必要。
設定方法: サイトマップの設定手順

Contextual Related Posts

レコメンドエンジンをいい感じにやってくれるプラグイン。
検索でページがヒットしたのに、見たい情報がなくてイラつく私にとってはレコメンド機能があるサイトは親切みすら感じる。
たとえそれが、他の記事を読ませて回遊率を上げる施策だったとしても。

これは画像です。執筆時点でこの記事の下部分にあったもの。

Easy Table of Contents

目次を自動でいい感じに挿入する。

Featured Image by URL

webpも埋め込めるのがとても良い!

アイキャッチ画像にwebpを使いたかったので、外部サイトから表示できるようにする。

Insert Headers and Footers

各ページのヘッダーに追記できるもの。名前だけで判断してしまいがちだが、ボディ部やフッター部にも追記できるのが強み。

My Database Admin(廃止)

phpmyadminを開いたりするのが面倒なので、wordpressでDBをいじろうというプラグイン。
使う時だけ入れて、使い終わったら捨てる運用をしておく事で不用意にデータをいじられる事がなくなります。
ただし、ローカルでの話なのであまり気にしなくて良かったかもしれない。

PS Auto Sitemap

https://nomuraya.tk/sitemap を参照。
人が見るためのサイトマップ。

Revisr

後述の静的サイトジェネレータで生成したファイルをgithubにpushするためのプラグイン。
他のツールを使っても良かったが、wordpressで完結したかった。

wordpressでgit commit & pushできるのは激アツ!

Simply Static

数ある静的サイトジェネレータの中で唯一使えたもの。
「出力先/simply-static-1-YYYYMMDD」を作る仕様があるので、これはGithubActions側で対応したので、生成→リネーム→Revisrのフローからリネームがなくなり、wordpressで完結できるようになった。

何も考えずに「静的ファイルを作成する」ボタンを押すだけ!これをやった後にRevisrでgit commit & pushしよう

WP Dashboard Notes

ダッシュボードを拡張。
一人でやっているなら要らないけど、複数人でやっているのできちんとプロジェクト管理ツールっぽいものが必要になった。

見せられないものがあるので途中まで。ダッシュボード画面に自由入力でコメントを書ける
変更項目はアイコンから選択できる

WP YouTube Lyte

Youtubeリンクを最適化するようですが、あまり効果を感じていません。

WP-Sweep

データベースのゴミを削除するツール。
実は必要だったものも誤って消してしまう可能性があるので、バックアップしてから実施する。

難しそうなイメージがあるのに、非常に直感的なUIで好き。バックアップ機能がないのでBackupWPと併用しよう。

GithubActionsの設定

私はGithubを使っているのでGithubActionsとしましたが、GitLabとかBitBucketの場合などは読み替えてください。
おそらく同じ事ができると思います。

ここでやることは、Simply-Staticで生成したファイルをホスティングするディレクトリ名に合わせるための設定です。

simply-staticディレクトリが出力先、この下に「simply-static-1-数値」があり、傾向が読めない

私はホスティングサービスにFirebaseを使っているので、
これを何とかfirebase.jsonのpublic欄に合わせる必要があります。

- name: simply-staticで生成したファイルをfirebase.jsonに適用させる
  run: |
    mv "$(find simply-static -type d -maxdepth 1 | grep simply-static-)" "$(cat firebase.json | grep '"public":' | cut -d'"' -f4)"

firebaseにデプロイする前のステップで入れてみてください。
これでSimply-Staticで作成したディレクトリをわざわざリネームし直すという手間がなくなります。

課題

画像はフレキシブルに扱いたいケースが多いので、画一的に扱えません。
そのため、wordpressのプラグインだけで完結するのが手間になりました。
自前で作ってもいいんですが、加工をする時はphpではなくpythonを使った方が都合が良い面が多かったので、プラグイン運用を見送った経緯があります。

本来であればwordpressで完結できた方がいいに決まっています。
execを使えばpythonを動かす事もできますが、正直気が進みません…。

シェアする