はてなブログからWordPressへの移行は、いろいろ大変な面も多いのが現状です。当ブログも移行はしたもののまだまだはてなブログから移行した記事に関しては修正等必要な状況です。
今回は、比較的手間のかかる画像の移行について解説したいと思います。
画像ファイルをはてなブログからWordPressへ移行する理由
画像ファイルをWordPressへ移行するのには理由があります。それはなんと言ってもはてなのサービスに依存し続けることになり、デメリットが発生するからです。
はてなのサービスに依存する
はてなブログにアップロードしている画像を参照すると言うことは、はてなに依存しているということです。データの一部（はてなブログ時代に書いていた記事の画像ファイル）がはてなのサーバ上にあるのです。それでは、はてながサービス終了すると画像はすべて消えてしまいます。その可能性は低くても、はてなのアカウントを削除するのも難しくなります。
サイトのレスポンス（≒サイトが表示されるまでの速度）にも影響を与える可能性があります。いくらサイトの表示速度の改善を行っても、はてなブログ上の画像への参照が残っていると、その画像の表示速度の改善を行うことができません。はてなブログのサーバがものすごい混雑したりするとその影響を回避できません。
移行ステップ
- はてなブログから画像をダウンロード
- WordPressへアップロード
- 記事中の画像タグ内のURLを書き換える
STEP1: はてなブログから画像をダウンロード
まずは、はてなブログにアップロードしている画像を全てダウンロードする必要があります。しかし、一括ダウンロドの様な便利な機能ははてなブログ上にはありません。
普段からLinuxとか使っているよと言う方や、grepとかwgetとかわかるよと言う方は以下の記事を参考にダウンロードできると思います。
[blogcard url="https://qiita.com/daisuke_nomura/items/453a62b2e7fa204c1b89"]しかし、面倒だし、そもそもWindowsだと環境構築で大変そうです（やってないのでよく分かりませんが。。。）他にも、できれば年・月でフォルダ（ディレクトリ）分けしてくれるとありがたいです。
そこで、はてなブログ上の画像をダウンロードするツールを作成しましたのでよかったら利用してください。
注意：はてなブログ上の画像をダウンロードさえできれば、どんな方法でもこの後の手順に影響はありません。
画像ダウンロードツール
画像ダウンロードツールは、Windows版とMac版を用意していますので以下からダウンロードしてください。
記事数の上限変更・各種バグ修正（2017/12/23追記）
本ツールでできることは以下の2点です。
- はてなブログ上に掲載されている画像の一括ダウンロード
※下書きや、アップロードのみで実際に記事に掲載されていない画像はダウンロードされません - WordPressフレンドリーなフォルダ分け機能
※現状、350件以上の記事には対応していない可能性が高いです。現在、3,500記事まで対応するように変更しました。(2017/12/23追記）
ツールを用いた画像ダウンロード手順
ダウンロードに必要なアカウント情報を準備します。
- はてなID
- はてなブログID
- API Key（管理画面から確認できます）
- はてなID
- 意味:あなたのはてなid
- ブログID
- 意味:ブログのID
- 書式:ブログのドメイン (例: hoge.hatenablog.com)
はてなブログProの独自ドメイン機能をご利用の方は、独自ドメイン設定前のブログのドメインがブログIDとなります。ブログの詳細設定のAtomPub項内のルートエンドポイントをご参照ください。
ダウンロード手順
ツールは1画面構成となっています。
- はてなID・はてなブログID・API Keyを入力します。
- 画像のダウンロード先を指定します。（空のフォルダを指定してください）
- 記事を取得します。
アプリが応答無しになることがありますが、記事取得が終わるまでお待ちください。
取得に成功すると、記事のID（数字の羅列が）記事数分出てきます。
出てこない場合は、認証情報を再度確かめてから再度実行してください。 - ダウンロードを開始します。こちらも時間がかかることがありますので、ばらくお待ちください。
エラーメッセージや、終了メッセージなど、丁寧なメッセージは出てきませんのでご了承ください。（もし、需要があればもう少しフレンドリーに改良するかもしれません。。。）
ダウンロードした画像の確認
ツールを用いてダウンロードしたファイルは、年/月別にフォルダ分けされています。
全てダウンロードされているか確認してください。
STEP2: WordPressへアップロード
WordPressへのアップロードは、WEB上の管理画面ではなくFTPで行います。
WordPressでは、画像などをアップロードすると以下の様なディレクトリに保存されます。
- [Wordpressインストールディレクトリ]/wp-content/uploads
管理画面からアップロードした際は、このディレクトリ以下に、年・月のディレクトリが作られ保存されていく仕様です。年・月のディレクトリは任意ですが、今後のメンテナンス制などからも年・月別のディレクトリを作成した方がいいでしょう。
なお、前のセクションで紹介した画像ダウンロードツールを利用された場合は、年・月別のディレクトリは自動で作成されているため、そのままアップロードします。
FTPクライアントを用いてアップロード
FTPクライアントを用いて実際にアップロードを行います。
FTPでの接続方法は契約しているレンタルサーバのマニュアル等で確認することができます。
FTPクライアントはなんでもかまいません。wp-content/uploadsにすべてそっくりアップロードすればOKです。
STEP:3 記事中の画像タグ内のURLを書き換える
最後に、画像のURLをはてなブログのものからWordPressのものへ書き換える必要があります。
当ブログの場合は以下の様に書き換える必要があります。
書き換え前：https://cdn-ak.f.st-hatena.com/images/fotolife/t/ttrip/20170707/20170707101641.png
書き換え後：https://ttrip.info/wp-content/uploads/2017/0707/20170707101641.png
全て、1回の置換で済ませることもできなくはないかもしれませんが、複雑さも増すので1月ごとに行っていこうと思います。
以下の検索ワードと置換ワードで置換を行っていきます。(以下は2017年8月の例です）
| 検索ワード | https?://cdn-.*hatena.com/images/fotolife/[はてなIDの先頭1文字]/([a-z]|[0-9]|-|_)*/201708[0-9][0-9] |
| 置換ワード | https://[新しいブログのURL]/wp-content/uploads/2017/08 |
検索ワードの青色で示した部分を変更しながら、実行していきます。前のステップでダウンロードした画像が2016年10月スタートなら、201610〜201710まで実行します。
検索ワードを一部修正しました（2017/12/23追記）
これから移行する方向け
まだ記事の移行も行っていない方は、WordPressへ記事をインポートする前に置換を行いましょう。まだ、WordPressでブログをスタートする前なのでリスクもすくなく、できればこのタイミングで行うのをオススメします。
はてなブログからエクスポートする
まずは、はてなブログの管理画面から記事をエクスポートします。エクスポート形式はMovable Type式です。
正規表現を利用できるエディタ
エクスポートしたファイルはテキスト形式です。そのテキスト形式のファイルをテキストエディタで開いて、URLを置換していきます。そのためのテキストエディタを準備する必要があります。今回利用できるテキストエディタの条件は、「正規表現が利用できる」テキストエディタです。
【Windowsユーザの方】
Windowsユーザの方は、サクラエディタがフリーで利用できます。
[blogcard url="http://sakura-editor.sourceforge.net/download.html"]【Macユーザの方】
Macユーザの方は、CotEditorがフリーで利用できます。
[blogcard url="https://coteditor.com"]実際の置換方法
エディタに、検索・置換メニューがあります。（エディタ毎で表現はすこし違います）
そこの検索ワードと置換ワードに以下の様に入力します。
| 検索ワード | https?://cdn-.*hatena.com/images/fotolife/[はてなIDの先頭1文字]/([a-z]|[0-9]|-|_)*/201708[0-9][0-9] |
| 置換ワード | https://[新しいブログのURL]/wp-content/uploads/2017/08 |
検索ワードを一部修正しました（2017/12/23追記）
まずは、検索を実行し、意図したものがヒットするか確認します。その後、置換を実行します。
これを、月数分実行します。
最後にファイルを保存して、WordPressへインポートし、正常に画像が表示されれば成功です。
WordPressへ移行済みの方向け
すでに、WordPressへ移行済みの方は、WordPress上の記事を直接置換することになります。
記事内のURLを置換する際には、Search Regexというプラグインを用いるのが便利です。
[appbox wordpress search-regex ]Search Regrexを用いる事で、検索結果、置換結果を確認しながら作業を行うことができます。
Search Regrexを用いた置換方法
Serch RegrexをWordPressへインストールすると、WordPress管理画面のツール→Search Regrexで設定画面を開くことができます。
Sourceが、Post contentになっていることを確認します。Limit toはNo limitにします。Order Byはどれでも問題ありません。
Search patternとReplace patternは以下の様に入力します。なお、青字の部分は年月になりますので、変更しながら月数分行います。
| Search pattern | /https?://cdn-.*hatena.com/images/fotolife/[はてなIDの先頭1文字]/([a-z]|[0-9]|-|_)*/201708[0-9][0-9]/ |
| Replace pattern | https://[新しいブログのURL]/wp-content/uploads/2017/08 |
検索ワードを一部修正しました（2017/12/23追記）
最後に、Regrexにチェックをいれます。
入力内容が確認できたら、Searchを実行します。この時点では、記事には変更は加えられないので安心してください。
そうすると、Resultsが表示されます。Searchでは、まずSearch Patternに一致するものが表示されます。ここで意図したものが一致しているか、また意図しないものが一致していないか確認します。
問題が無いことを確認できたら、Replaceを実行します。この時点では、記事には変更は加えられないので安心してください。
実行すると、Resultsに置換のプレビューが表示されます。問題がないか確認を行います。
問題が無いことが確認できたら、Replace & Saveを実行します。
あとは、これを月数分繰り返していきます。
記事の確認
置換が完了したら、記事を表示させて、確認しましょう。もし、なにかしら問題が発生したらバックアップから復元るなどを行いましょう。
まとめ
はてなブログ上の画像をWordPressに移行する手順を解説しました。WordPressを扱うことのできる人ならどうにかできるのではないかというところまでかみ砕いたつもりですが、うまく行かなかったり、よく分からない部分があったらコメントやTwitetrなどで教えてください。
なによりもツールが動くかが不安ではありますが（笑）
