アメブロの引越し

記事データ内の画像リンクを変更(置換)する。

記事データ内の画像リンクを変更(置換)する。

FC2からダウンロードした記事データをWordpressにインポートする時に、やるべきことがあります。

それは、画像のURLをWordpressに変更することです。

 

そもそもブログ上で画像を表示するというのは、アップロードした画像それぞれにURLが割り当てられ、それをHTMLタグで呼び出しているという仕組みなのです。

FC2からダウンロードした記事データのHTMLタグには、FC2にアップロードされている画像を呼び出すためのURLが記述されているのですが、FC2は移行が完了すると削除するので、画像の呼び出しができなくなります。

そのため、前のステップでWordpressにアップロードされた画像を呼び出すHTMLタグに変更してあげる必要があります。

 

アメブロからWordpressに移行する中で、一番わかりにくい項目でもあり、文字での説明が不十分で理解できない可能性がありますが、その場合はSBアカデミーのFacebookグループで質問していただけると個別にレクチャー致します。

 

 

テキストエディタについて

このURLの変更は一つずつ手動で行うのは大変なので、テキストファイルの扱いに優れた「テキストエディタ」というものを使います。

 

この「テキストエディタ」を使う理由

テキストファイルを扱う事になるので、Windowsに標準で利用できる「メモ帳」を使うという選択肢もあるのですが、文字コードが「UTF-8」という標準ではない種類のため、メモ帳では文字化けを起こしてしまう可能性があります。

当然文字化けを起こしたファイルだとページが正常に表示されません。

 

そこで、様々な文字コードに対応したテキストエディタを使って編集することで、文字化けのリスクを回避することができます。

また、テキストファイル(.txt)だけではなく、HTMLファイル(.html)や、CSSファイル(.css)、ほかにもWordpressで使われているPHPファイル(.php)も文字化けを起こすことなく編集することができるようになります。

 

もう一つの理由として、文字の一括入れ替え機能(置換機能)を使うことで、すべての画像URLを一発でFC2のURLからWordpressのURLに入れ替えることができます。

(このページのメインになります)

 

おすすめのテキストエディタ

無料のものから有料のものまで様々なテキストエディタがありますが、置換機能を使うのが目的であれば、無料のものならどれを選んでも十分です。

ここでは個人的に利用しているものをおすすめとして挙げておきます。

 

・Windowsの場合「テラパッド」

多機能なテキストエディタで、当然置換機能は備わっています。

こちらからダウンロードしていただき、.exeファイルをクリックしてインストールします。

(画像クリックでダウンロードサイトのページが開きます)

Screenshot_86

 

 

・Mac OSXの場合「mi」

Mac用の多機能テキストエディタで、個人的に愛用しています。

ダウンロードして、.appファイルをダブルクリックもしくは、Appフォルダにドラッグ&ドロップしてインストールします。

置換機能はもちろん備わっています。

(画像クリックでダウンロードサイトのページが開きます)

mi_-_テキストエディタ

 

 

画像のURLを変更する(置換機能を使う)

ここから実際にテキストエディタを使ってURLの変更(置換)を行うわけですが、Windows(テラパッド)の場合とMac OSX(mi)の場合の両方のケースで解説します。

 

変更(置換)する画像URLの取得(共通)

まずは変更前(FC2)の画像URLと変更後のURL(Wordpress)を取得します。

 

1.ダウンロードしたテキストファイルをテラパッドで開くと、このような感じで表示されます。

Screenshot_2

テキストエディタでは、リンクのHTMLタグが違う文字色で表示されるので、より見やすくなります。

ちなみに現在表示されているURLが、FC2での画像URLとなります。

「http://blog-image-78.fc2.com/g/a/m/FC2のアドレス/ファイル名.png(.jpgの場合もあります)」

この場合のファイル名は「blog_import_5503〜.png」の部分になります。

 

2.Wordpressでの画像URLを取得する。

blog_import_550393c7c70d4_jpg__220×165_

WordPressの画像URLは、基本的に以下のようになります。

「http://ドメイン/フォルダ名/wp-content/uploads/image/画像ファイル名.jpg(.pngの場合もあります)」

となり、基本的に画像ファイル名はFC2と同じファイル名になります。

 

3.この二つのURLをテキストエディタにコピー&ペーストします。

Screenshot_1

URLの変更(置換)作業としては、記事データ内における上記の部分を、入れ替えるということになりますので、この作業に関してはFC2とWordpressとでファイル名が違っていても構いません。

 

テラパッド(Windows)でのURL変更(置換)作業

 

1.上部メニューの「検索」から「置換」を選択します。

Screenshot_3

 

2.検索する文字列にFC2の「http://blog-image-78.fc2.com/g/a/m/FC2のアドレス」

 置換後の文字列にWordpressの「http://ドメイン/フォルダ名/wp-content/uploads/image」を

 それぞれ入力し、「すべて置換」をクリック。

Screenshot_4

※誤って片方の末尾に「/」が入るとリンクエラーで読み込めなくなる可能性があるので、両方とも末尾の「/」は入れないでください。

 

4.「はい」を押して画像URLを変更(置換)します。

Screenshot_5

 

 

5.先ほど選択した箇所の画像RULが変更(置換)されました。

Screenshot_6

 

6.同じように「すべて」をクリックすると該当するすべての画像URLが変更(置換)されます。

Screenshot_7

 

7.変更(置換)したファイルは、失敗したときのために必ず「名前をつけて保存」で、

 新しく保存してください。

Screenshot_8

 

 

mi(Mac OSX)での画像URL変更(置換)作業

画像ではリンクの文字色が変わっていませんが、設定で変更することができますが、設定方法に関して、このページでは割愛させていただきます。

 

1.上部メニューの「検索」→「検索・置換」を選択します。

スクリーンショット_2015-03-17_23_52_21

 

2.検索文字列にFC2の「http://blog-image-78.fc2.com/g/a/m/FC2のアドレス」を。

 置換文字列にWordpressの「「http://ドメイン/フォルダ名/wp-content/uploads/image」を入力する。

 「次を検索」をクリックすると、検索文字列に該当する部分がすべて反転します。

スクリーンショット_2015_03_17_23_57

「全て」にチェックを入れ、「全てを置換」をクリック。

 

 

3.置換完了のメッセージが表示され、URLがすべてWordpressのものに変更(置換)されます。

スクリーンショット_2015_03_18_0_00

 

 

4.Windowsの時と同様に、必ず「別名で保存」で変更後のファイルを保存する。

スクリーンショット_2015-03-18_0_03_32

 

 

この画像URLの変更作業では、正確にURLを取得する必要があります。

URLの取得さえしてしまえば、あとはテキストエディタの方で一括で行ってくれるので、ぜひテキストエディタはインストールしておきましょう。

 

ダウンロードしたテキストファイルは、失敗した時のために必ず残しておきましょう。

変更後のテキストファイルを別名で保存するのはそのためですが、もし上書き保存をしてしまった場合は、こちらの記事を参考にダウンロードしなおしてください。

 

この作業は、アメブロの記事をWordpressへ移行する作業の中で、一番難解なステップになります。

文字での解説には限界があるので、もしわからない場合があれば、SBアカデミーのFacebookグループにてご質問ください。

 

以上「記事データ内の画像リンクを変更(置換)する」の解説でした。

 

 

 

手順一覧に戻るには、バナーをクリックしてください。

アメブロからWordpressへ移行する手順の一覧

コメントを残す

*