WordPress製サイトをある日いきなり運用することになった人のためのTips

# その日はいきなりやってくる

今年の印象深いマイ出来事のひとつに、WordPressのサイト運用に携わったことがあります。

メインのタスクは他に多数あり、片手間でWordPressのサイトを運用していくような感じでした。

WordPressは今まで何度かインストールをして軽く使ってみたことはありましたが、実戦で使ったのは初めてで、今までにない知見をいくつか得ることができました。

一年の締めくくりにWordPressにまつわるTipsを記していこうと思います。

# 注) 対象読者について
このTipsは何らかのメインの仕事があるけれどサブ的なWordPress関連のタスクをうまく捌くことを目的として記事を書いております。
WordPressでじっくりとよいサイトを構築して運営するというよりは、
必要最低限の工数でいわば逃げ切り型でその場をしのぐことに特化した作戦が前提になっています。

WordPress詳しい人からしたら失笑レベルの内容も多分に含まれていると思います。
末長く運用を続けていくことになるようなサイトの扱いには向いていません。
ご注意ください。

逆にこのTipsが役にたちそうなのは次のようなケースでしょうか。

- 本命を立ち上げるまでの仮サイトとしてWordPressを使っている
- デモサイト的な立ち位置でWordPressを使っている
- キャンペーンサイトのような短期間でクローズできるサイト

# 目次

以下のようなことができればなんとか運用できるでしょう。

- JavaScriptやCSSをカスタマイズしたい
- PHPのコードを追加したい
- 検証用の環境を用意したい
- APIを経由してWordPressの記事情報を取得する

# JavaScriptやCSSをカスタマイズしたい

[Simple Custom CSS and JS](https://wordpress.org/plugins/custom-css-js/) というプラグインを利用すると、自分で用意したJavaScriptやCSSのコードを追加することができます。

どんなテーマやプラグインを使っていてもこのプラグインを入れれば、ページ内にあるタグを掴んであれこれできるのでとりあえず戦えます。とりあえず戦えるの、重要です。

コードを流し込む場所をheaderかfooterから選択できたり適用する画面をサイトのフロントか管理画面かを選べたりできるのも非常に助かります。有償版を購入すると流し込むページを指定できたり、SASSが使えたりとより柔軟に設定できるようですが、無償版でも十分重宝します。

プラグインをインストールすると、管理画面のサイドバーに「Custom CSS & JS」というメニューが出現します。
コードは分割して設定することができるので、機能ごとに分けて管理ができるので色々と使いやすいです。有効無効の設定もできます。
管理画面から自分たちが設定したコードが見えるのは引き継ぎもしやすいし、とてもよいことですね。

![custom_css.png](https://qiita-image-store.s3.amazonaws.com/0/10138/e8b99f49-3730-d455-3f66-65bcc54e4ba8.png)

# PHPのコードを追加したい

[Code Snippets](https://github.com/sheabunge/code-snippets)というプラグインを使うことで実現できます。
ネットで調べると、functions.phpに直接追加や修正する方法がたくさんヒットしますが、このプラグインを使うほうがお手軽かつ安全に実現できます。まずはCode Sinppetsから始めてみるほうがリスク少なく、カスマイズできるかもしれません。

Code Sinppetsを追加すると、管理画面に「Snippets」というメニューが追加されます。
ここから、任意のPHPコードを追加することが可能です。
追加したコードはadd_filter関数などを使って、発火タイミングを設定する感じですね。

![snippets.png](https://qiita-image-store.s3.amazonaws.com/0/10138/422b7f79-eb2b-d298-79e8-0a44920bd54c.png)

PHPコードにSyntax Errorとかが含まれていた場合、コードを適用する前の段階で止めてくれるのが超優秀です。
良くも悪くもWordPressはコードの変更をいきなり適用する仕組みなので、こうした機能がついているのはとてもありがたいですね。
同じ修正をfunctions.phpを直接編集する形でやってしまうと、サイトがいきなり停止してしまいます。

<img width="451" alt="スクリーンショット 2018-12-02 11.56.56.png" src="https://qiita-image-store.s3.amazonaws.com/0/10138/847f8995-360c-d4a1-2e05-31a7bdbb27e9.png">

こんな風に「Don’t Panic」と出て、がっちり守ってくてます。頼もしい !

# 検証用の環境を用意したい

いきなり本番環境に適用するのは怖い！といった事態に遭遇することがあります。
開発環境を調達する方法はいろいろあると思いますが、今ならDockerを使えばローカルでお手軽に環境が立ち上がります。
怪しそうなプラグインの検証や、破壊を招くかもしれぬPHPのコードなどこれなら気楽に試すことができるでしょう。

セットアップ方法は素晴らしいまとめがこちらにありました。ぜひご覧ください。
https://qiita.com/mom0tomo/items/7e611ac829863d4c5c82

# APIを経由してWordPressの記事情報を取得する

WordPressにはAPIが標準で導入されていて、APIを経由して記事などの情報を取得することができます。
たとえば、WordPressの記事データを他のサイトに掲載したい場合などに使えます。
知っている人にとっては当たり前すぎて新鮮味に欠けるかもしれないですが、これを知ったときはWordPressこんなこともできるようになってたんだって感動しました。

エンドポイントはこんな感じです。

```
https://{your-domain}/wp-json/wp/v2/posts
```

GETすると、こんな感じで返ってきます。

```
[
    {
        "id": 1234,
        "date": "2018-03-19T21:37:36",
        "date_gmt": "2018-03-19T12:37:36",
        "guid": {
            "rendered": "https://{your-domain}/?p=1234"
        },
        "modified": "2018-03-19T22:10:07",
        "modified_gmt": "2018-03-19T13:10:07",
        "slug": "qiita_advent_calendar",
        "status": "publish",
        "type": "post",
        "link": "https://{your-domain}/sample/",
        "title": {
            "rendered": "お試し投稿"
        },
        "content": {
            "rendered": "<p class=\"par5\”>こんにちは！</p>\n<p class=\"par5\”>こんばんは!</p>
        },
(その後、categoriesやtagsなどの情報が続く)
```

データ連携の方法は色々ありますが、例えばWordPressのDBにSQLで問い合わせをするやり方と比較すると使い勝手の面ではとても優秀だと思いました。
WordPressのDBは構造が結構複雑で、初見でどこにどのデータがあるのかがよくわからなかったですし、APIを使ったほうが調査工数を減らすことができてすぐにデータ連携が開始できそうです。

ただし、APIをフルで開放してしまうともちろん、第三者が容易にAPIを実行できてしまうので、認証設定などを入れてアクセス制御をする必要性が出てくるでしょう。あと、APIサーバーとして動かすことになった場合の負荷を想定してサーバースペックを整えないといかねいかもしれません。

# おわりに

これほどWordPressを使うことになるとは思いもしませんでした。
人生、何が起きるのかわかりません。

重要なのはWordPressが提供している仕組みにうまく乗ることですね。
WordPressも一種のWebアプリケーションのフレームワークだとすると
そのフレームワークが提供しているフレーム(=仕組みやルール)に従って開発保守をしていくに限ります。

コードとかを直接編集したくなることは多々ありますが、極力プラグインを使って解決していくとよいでしょう。