はじめに
このブログはWordpressで運用しており、テーマはCocoonを利用しています。
Cocoonはカスタマイズ性が高く、テーマの中でカラースキームやUIに凝ることができます。
そこで、Cocoonの高いカスタマイズ性を活かすことにより、Wordpressの固定ページをJavaScript製Webアプリケーションの公開プラットフォームにすることができないかと考えました。
実際にやってみると思ったより簡単に実践できますが、同時にメリットデメリットが見えてきました。
この記事では、先にWordpressの固定ページを利用したWebアプリケーション公開のメリットとデメリットを解説し、その後具体的な公開方法についても解説します。
WordPressの固定ページを利用したWebアプリケーション公開のメリット
僕が感じた、Webアプリケーション公開にWordpressを利用するメリットは以下の通りです。
- サイト構築・管理の手間が省ける
- SEO評価やアドセンスの審査を本サイトから引き継ぐことができる
- メタ情報を本サイト同様に利用できる
それでは一つずつ解説していきます。
サイト構築・管理の手間が省ける
一般にWebアプリケーションを公開する場合、ホスティング先のプラットフォームを選定し、場合によってはWebサーバのインストールやVirtualHostなどの設定を行う必要があります。
またドメイン必要ですし、現代ではhttps通信が当たり前なのでSSL証明書を準備する必要もあるでしょう。
これはなかなか面倒ですね。
一方で、Wordpressの固定ページとしてWebアプリケーションを公開する場合はこれらの作業が不要になります。
既存のサイトに新たなページを追加する形になるため、Wordpressが既に設定された状態からスタートすることができます。
そのため、アプリケーション公開のハードルがかなり下がるのではないかと思います。
SEO評価やアドセンスの審査を本サイトから引き継ぐことができる
Webアプリケーションの公開後、Google検索からユーザに来てもらうためには、インデックスに登録する必要があります。
その作業自体は難しくないものの、検索結果の順位を上げるのは大変です。
その点、Wordpressの固定ページであれば本サイトのSEO評価を引き継げるため、比較的有利になります。
Google Adsenseの審査も同様で、本サイトで広告が掲載できている状態であればもちろん固定ページでも掲載することができます。
メタ情報を本サイト同様に利用できる
htmlを公開する場合、タイトル・公開日時やOGPタグなど、システムからみたWebアプリケーションの情報を記述します。
これらを記述しておくことで、例えばTwitterにリンクが貼られた際に、ツイート内にアイキャチ画像や概要を展開して表示することができます。
しかし、サイトを公開する度にいちいち手書きするのは大変です。
WordPressであればそれらの情報を自動挿入できます。
アイキャッチ画像を設定するUIでOGP画像も一緒に設定できたりするので、作業がとても楽になります。
WordPressの固定ページを利用したWebアプリケーション公開のデメリット
これまでにメリットを紹介してきましたが、一方でデメリットもあるように思いました。
僕が感じた、Webアプリケーション公開にWordpressを利用するデメリットは以下の通りです。
- デプロイを管理する仕組みがない
- 本サイトのサーバにトラフィックが集中する
デプロイを管理する仕組みがない
最近のホスティングサービスではGitHubのリポジトリと連携してCIを設定できることが多いです。
これにより、事前にコードチェックをしたりテストを走らせたりできますし、サイトを前のバージョンに戻すことができます。
WordPressの固定ページのエディタにはそのような機能がないので、オリジナルなコードの管理自体は別途リポジトリで行う必要があります。
そのため、コードが二重管理のようになってしまいます。
昔FTPでファイルを上げていた頃のようですねw
本サイトのサーバにトラフィックが集中する
こちらはサーバの冗長構成にもよりますが、例えば1台のサーバの中に詰め込んでいる場合はアクセスが過多になる可能性があります。
WordPressの固定ページとしてWebアプリケーションを公開する手順
手順としては以下のようになります。
- ダッシュボードから固定ページを作成する
- 「+」ボタンを押してブロックの追加メニューから、カスタムHTMLを選択する
- HTMLを記述する
- CSS、JavaScriptをそれぞれ「カスタムCSS」、「カスタムJavaScript」に記述する
おわりに
デプロイメントについてはまだまだ改良の余地があると思います。
例えば、GitHubのリポジトリと連携する機能をWordpressのプラグインとして実装することが考えられます。
この記事では書きませんでしたが、コンテンツ面でも便利な機能が使えそうです。
うまくやればwordpress rest apiと連携（ドメインが同じためCORSに引っかからない）してヘッドレスCMSのような使い方をすることもできるのではないかと考えています。
