サイトリニューアル

Remixを使ってサイトをリニューアルしてみました。

今回は複雑な機能もないので、さくらインターネットの共有サーバで動かせるSPAモードで作成しました。お問い合わせのメール送信は、クライアント側では難しいため、PHPで実装しました。

デプロイはGitHub Actionsを使用しての自動化です。ソースコードはGitHubにアップ。

https://github.com/pontago/greenstudio-web

ブログはWordPressを使用していたため、トップディレクトリから移動させる形にしましたが、どのようにRemixと共存させるのか少し悩みました。

WordPressで使用していた旧URLをリダイレクト

まずはトップディレクトリにRemixのファイルを配置するため、WordPressのファイルをwpディレクトリ以下に配置するように変更しました。

旧: /home/user/www/greenstudio.jp/[WordPressのファイル]

新: /home/user/www/greenstudio.jp/wp/[WordPressのファイル]

幸いブログ記事には、blog/をパスに割り当てていたため、記事投稿URLの移行はさほど問題となりませんでした。

旧: https://www.greenstudio.jp/blog/*

新: https://www.greenstudio.jp/wp/blog/*

wp以下にmod_rewriteを利用してリダイレクトさせます。

RewriteEngine On
RewriteRule ^blog/?$ /wp/ [R=301,L]
RewriteRule ^blog(.*)?$ /wp/blog$1 [R=301,L]

その他に個別に割り当てていた下記のようなパスをどうするかです。
https://www.greenstudio.jp/test

WordPressで個別パスのリダイレクト対応

固定ページに割り当てていた個別パスを洗い出す必要があります。そこで便利なのが「Export All URLs」というWordPressのプラグインです。

これを使うと投稿や固定ページのURL一覧をCSV出力してくれます。あとは、ブログ記事以外のURLを抽出してリダイレクトの設定を追加していくだけ。

RewriteRule ^app-privacy-policy(.*)?$ /wp/app-privacy-policy$1 [R=301,L]

URLからRewriteRuleを生成するのは、ChatGPTに任せて下記のようなプロンプトでルールを一括生成してもらいます。

下記の参考mod_rewrite設定を元に入力URL一覧からRewriteRule設定を作ってください。

参考mod_rewrite設定：
RewriteRule ^app-privacy-policy(.*)?$ /wp/app-privacy-policy$1 [R=301,L]

入力URL一覧：
https://www.greenstudio.jp/app-privacy-policy
https://www.greenstudio.jp/app-terms

301リダイレクトさせたURLはブラウザキャッシュされることがあるので、色々試しても設定が反映されない場合は気を付けましょう。ブラウザの開発者ツールでキャッシュを無効化させるか、プライベートウィンドウなどで試すといいです。