めんどくさ〜い WordPress

WordPress をほぼ無料で使う

はじめに

ブログを作るにあたって、私が、今、一番快適と感じているのは、静的サイトジェネレータ hugo を使ってコンテンツを作成し、Netlify (または、ローカル)でHTML等を生成し CDN に置く方法です。

そこで、WordPress からサイトジェネレータ(特に Netlify の活用)への乗り換えをおすすめする記事を書こうと思いました。

そこで、ラッコキーワードで、WordPress に関する検索キーワードを調べてみると、WordPress に否定的な検索はそれほど見当りませんでした。

一方で、サイトジェネレータに関して調べてみると、検索ボリュームがそれほどありませんでした。

やはり、主流派ではないのかな、と思い、WordPress をいじってみることにしまいた。

WordPress を無料で使いたい

キーワード調査をして、まず、目についたのは、「WordPress 無料」でした。

WordPress を無料で使うには、いくつか方法があります。

  • wordpress.com の無料プランを使う
  • xfree など、無料で wordpress が使えるレンタルサーバを使う

どちらも、広告が表示されるようです。ホスティングサイトの広告は表示させたくありませんでした。

WordPress の静的サイトジェネレータプラグイン Simply Static を使うと安く上げられるのでは?

冒頭に書いたように、静的サイトジェネレータを使うのが良いと考えています。WordPress は、速度、セキュリティ、メンテナンス性が良くないと考えるためです。

それに、MySQL(MariaDB でもいいですが) データベースが必要なので、メモリが多くないと不安です。自分でホスティングするとなると、データベースが動かないといけないので、それなりに費用がかかってきます。500円前後で WordPress を使えるレンタルサーバを借りればいいのですが、そこもケチってみたいと思います。Google Cloud Platform の無料枠でホスティングすれば、ある程度までは無料ですが、メモリ量が少ないように思えました。

そういった観点で調べていると、Simply Static という、WordPress を静的サイトジェネレータにするプラグインがありました。WordPress サイトを HTML 化してくれます。

このプラグインを使えば、例えば、Google Cloud Platform の compute engine の 無料枠(Free Tier) でも十分に WEB サイトが構築できそうな気がしてきます。ただし、「1 GB の北米から全リージョン宛ての下りネットワーク（1 か月あたり、中国とオーストラリアを除く）」という制限があるのに注意です。これを超えそうな人気ブログになりそうなら、Netlify の無料プラン、AWS Cloudfront+S3などを利用しても良いように思います。

Simply Static がローカルフォルダーに出力できるのと、どうせ、このブログもたいして人気化しないだろうという予測(苦笑)で、とりあえず、WordPress サイトと同じホストに静的サイトを置くことにします。記事作成用の WordPress サイトで静的サイトに変換すると、表示用のサイトが更新される感じです。

独自ドメイン取得

折角なので、独自ドメインでホスティングすることを考えます。ここだけどうしても費用がかかってしまいます。

こだわりが無ければ、中古ドメインを利用するのが良いと思います。中古ドメインのほうが、新規ドメインより URL が認識されるのが早いように感じます。

実際、このページも3日ほどでインデックスには入ったようです。Googlebot が見にくる URL に投稿があるとインデックスされやすそうに感じます。Googlebot が見にくる URL を別のページにリダイレクトしてもよさそうです。良い中古ドメインを選べば、サイトに巡回してくる頻度が高く、URL が発見されやすい、ということなのではないかと思います。ただ、私自身、どのような中古ドメインを選べばよいのか今だにわかっていません。テーマが似ていたり、wikipedia からのリンクがあったり、かつて物販をしていたサイトであったり、政治関連のサイト(割と後始末が雑な感じなので)などを試しています。

ただし、検索ランキングの上位に来るかどうかは、やはり、コンテンツの質・量に依存します。サイトの外部、内部からのリンク(被リンク、バックリンク)なども重要と言われていますが、試してみたものの効果があると感じませんでした。

それらを踏まえて、中古ドメインを使ってみてはどうかと思います。

Google Cloud Platform 上で VM インスタンスを立ち上げる

VMインスタンスの用意

  1. Google Cloud Platform にログインし、「コンソール」を押します。
  2. プロジェクトを新規作成します。
  3. 左上のハンバーガーメニューから、compute engine > VM インスタンスを選択します。Compute Engine API を Enable にします。
  4. 「CREATE INSTANCE」をクリックします。machine-type は、e2-micro を選択します。Boot disk を選んで、Operating system は Ubuntu を、Versions は Ubuntu 22.04 LTS (x86/64〜) を選択し、SELECTボタンを押します。Firewall は、Allow HTTP traffic、Allow HTTPS traffic をチェックします。(他の項目は変更しません。)
  5. インスタンスが起動したら、左上のハンバーガーメニューから、VPC Network > IP addresses を選択します。画面の上のほうにある、「RESERVE EXTERNAL STATIC ADDRESS」をクリックします。Name 欄に何か適当な名前を入力します。Attached to は instance-1 を選択します。RESERVE ボタンを押します。(他の項目は変更しません。)

この STATIC ADDRESS をドメインプロバイダに設定します。(Aレコード)

VMインスタンスの設定

ここでは、staging.YOUR_DOMAIN に WordPress サイトを置き、YOUR_DOMAIN に静的サイトを置くものとします。

  1. Google Cloud Platform の左上のハンバーガーメニューから、compute engine > VMインスタンスを選択します。
  2. 起動しているインスタンスの行の右のほうにある「SSH」をクリックします。(コンソールが開きます。)
  3. sudo -s
  4. apt update
  5. apt install -y nginx
  6. snap install certbot –classic
  7. apt install -y mariadb-server
  8. apt install -y php-fpm
  9. apt install -y php-mysql
  10. apt install -y php-fdomdocument
  11. apt install -y php-mbstring
  12. apt install -y php-zip
  13. apt install -y php-curl
  14. /etc/nginx/sites-available/staging.YOUR_DOMAIN.conf の設定
  15. mkdir /var/www/staging.YOUR_DOMAIN
  16. /etc/nginx/sites-available/YOUR_DOMAIN.conf の設定
  17. mkdir /var/www/YOUR_DOMAIN
  18. cd /etc/nginx/sites-enabled; ln -s ../sites-available/YOUR_DOMAIN.conf .
  19. systemctl restart nginx
  20. certbot –nginx
  21. WordPress インストール

staging.YOUR_DOMAIN.conf の例

upstream php {
	server unix:/var/run/php/php-fpm.sock;
}

server {
	access_log /var/log/nginx/staging.YOUR_DOMAIN-access.log;
	error_log /var/log/nginx/staging.YOUR_DOMAIN-error.log;
        # WordPress サイトを YOUR_IP_ADDRESS からだけ許可する
        # allow YOUR_IP_ADDRESS/32;
        # WordPress サイト自身のアドレスは許可しておく必要がある模様
        # (静的サイトデータが生成できずキャンセルボタンのままになる)
        # allow WORDPRESS_SERVER_IP_ADDRESS/32;
        # deny all;

        ## Your website name goes here.
        server_name staging.YOUR_DOMAIN;
        ## Your only path reference.
        root /var/www/staging.YOUR_DOMAIN;
        ## This should be in your http block and if it is, it's not needed here.
        index index.php;

        location = /favicon.ico {
                log_not_found off;
                access_log off;
        }

        location = /robots.txt {
                allow all;
                log_not_found off;
                access_log off;
        }

        location / {
                # This is cool because no php is touched for static content.
                # include the "?$args" part so non-default permalinks doesn't break
when using query string
                try_files $uri $uri/ /index.php?$args;
        }

        location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
                expires max;
                log_not_found off;
        }
}

YOUR_DOMAIN.conf の例

server {
        # エラーページが表示されないので、ページが無ければ / にリダイレクトさせる
        location @homepage {
                return 302 /;
        }
        error_page 404 = @homepage;

        access_log /var/log/nginx/YOUR_DOMAIN-access.log;
        error_log /var/log/nginx/YOUR_DOMAIN-error.log;

        server_name YOUR_DOMAIN;
        root /var/www/YOUR_DOMAIN;
        index index.html index.htm;

        location / {
                 try_files $uri $uri/ =404;
        }
}

certbot –nginx を実行すると、https の設定が追加されます。

WordPressインストール

データベース作成

ここでは、コピペできるよう、コマンドラインから設定します。

mysql -u root
create database wordpress;
grant all privileges on wordpress.* to "wpuser"@"localhost" identified by "wppass";
flush privileges;
exit

WordPress 設定 

cd ~
wget https://wordpress.org/latest.tar.gz
tar xvzf latest.tar.gz
cd wordpress
mv * /var/www/YOUR_DOMAIN

この後、https://YOUR_DOMAIN にアクセスすると WordPress の設定ができます。

DB 名 wordpress、DBユーザ名 wpuser、DBパスワード wppass を入力します。

設定が完了すると、WordPress の画面が表示されます。

Simply Static プラグインの導入

  1. WordPress の管理画面を開きます。サイドメニューから、「プラグイン」を開きます。
  2. 「新規追加」ボタンを押します。
  3. 「キーワード」の右側に「simply static」を入力し、Enter キーを押します。
  4. 「今すぐインストール」ボタンを押します。サイドメニューに「Simply Static」が追加されます。
  5. Simply Static > 設定を選択します。リンク先 URL は「相対 URL を使用する」を選択します。配送方法は「ローカルディレクトリ」を選択します。ローカルディレクトリは、/var/www/YOUR_DOMAIN を指定します。

設定 > ディスカッション設定では、動的に動く機能は使えないかもしれないので、私は、「投稿中からリンクしたすべてのブログへの通知を試みる」「新しい投稿に対し他のブログからの通知 (ピンバック・トラックバック) を受け付ける」「新しい投稿へのコメントを許可」は OFF にしました。

記事作成

投稿を作成します。

URL が日本語だと静的サイトを生成した時、リンクが正しく生成できませんでした。静的サイトデータのほうは、パーセントエンコードされたもので、WEB サーバはその URL を対応するファイルに結びつけられない、ということでしょう。WEB サーバの設定で直るのかもしれません。

とりあえず、パーマリンクを英数で設定しなおしました。

確かに WordPress の編集機能は強力です。WordPress の編集機能を生かしつつ、静的サイトを生成したいという気持ちもわかります。

Simply Static プラグインを実行して静的サイトを生成

  1. サイドメニューの Simply Static > 生成を開きます。
  2. 「動的ファイルを生成する」ボタンを押します。

これで、静的ファイルを生成し、YOUR_DOMAIN に配置されます。

まとめ

  • Google Cloud Platform に WordPress をホスティングしますが、Simply Static プラグインを使って、静的サイトとして表示できるようにします。

kizamiudn