はてなブログProからWordPressへの移行作業と設定方法(2017年版独自ドメインあり)

SPONSORED LINK

2017年2月10日に5年間使ったはてなブログProからレンタルサーバー+Wordpressへ移行を行いました。

Wordpressへ移行しました
2012年から始めたはてなブログからこの度Wordpressへ移行しました。 約300ある記事データ移行を始め3週間以上に渡る大変な作業でしたが、無事Wordpressへ移行出来て一先...

はてなブログからWordpressへ移行を検討している人も多いと思います。
自分も移行作業のエントリーを参考にしながら正解を探す感じで手順を試行錯誤してきました。
今回の移行作業と設定方法、その時注意すべき事などについて書いていきます。
長文ですがエントリーを分けずにこの記事だけ読めばいいように構成しています。

注意:本エントリーを読まれる際の注意事項

  • 本エントリーの内容はWordpressの移行や設定を保障するものではありません。
  • 記事内ではテーマ「Simplicity2」の記述がありますが、現在は別のテーマを使用しています。
  • 記事を書いた後に行っているカスタマイズによって、移行時の内容と現在のサイト状況が、必ずしも合致していない部分があります。

[目次 - Contents]

はてなブログからWordpressへ移行した主な理由

5年間はてなブログを使っていましたが、幾つかの理由からはてなブログへの不満が大きくなり、自分のブログの状況も合わせて考えるとこの時点で移行すべきという考えになったため移行作業を開始しました。

  • 2016年末の時点で560の公開エントリーがあり、これ以上エントリーが増えると現実的に移行が困難になると思っていたため。
  • 普段から見ているサイトやブログがWordpressを使っているサイトが多かったため。
  • SEとしてWordpressの実装も知識として知っておきたかったため。
  • はてなのテーマや実装に限界を感じていたため。
  • Googleがモバイルフレンドリーを進める中で「はてなスター」のような実装に意味があるのかという疑問が大きかったため。
  • SSL化の対応を自分でやりたかったため。
  • スマホのデザインを洗練された画面にしたかったが、はてなブログではデザインを大きく変更出来なかったため。

作業者のスキルレベル・移行元はてなブログ状態・移行先レンタルサーバー想定

移行作業者(筆者)のスキル

  • HTML・CSSの一般的な知識あり。
  • サーバーやネットワークについてSE職レベルの知識あり。
  • WordPressに関しては知識なし。

移行前のはてなブログPro状態

  • はてなブログPro+独自ドメイン使用(ドメイン運用期間約1年半)
  • 移行前記事数560(→記事を削減しエクスポート時点では312)
  • 画像ファイルサービス「はてなフォトライフ」(約数百枚)

移行前のドメイン状態

  • ムームードメインに独自ドメインを登録
  • ネームサーバはムームーDNSを参照
  • CNAMEレコードでサブドメイン「www」を「hatenablog.com」に設定(はてなブログ独自ドメインでは一般的な設定)

移転後のWordpressサイトとドメインの想定

  • レンタルサーバー「エックスサーバー」X10プランで契約
  • 移転後もムームードメインを引き続き利用
  • エックスサーバーのネームサーバ情報はエックスサーバー側に設定
  • ムームーDNSに設定しているCNAMEレコードは移行時に削除
  • 画像ファイルサービスにGoogleフォトを利用(はてなフォトライフから画像を移転)

移行の準備作業

準備作業1.画像サービスをはてなフォトライフからGoogleフォトに移行

2017年1月末頃から、レンタルサーバー(Wordpress)への移行を考え始め、移行方法について、情報収集を始めました。
自分の場合、はてなブログで書いていた記事データを移行する必要があり、記事データの移行時にどのような問題があるのかを中心に考えていました。
Wordpressの知識はほとんどなかったため、最初に概要を知るためビギナー用書籍(「WordPress Perfect GuideBook 4.x対応版」佐々木恵著/ソーテック社)を購入しました。
書籍では一般的なWordpressサイトの立ち上げ方法とWordpressの設定はどのようにするのかといった基本的な知識が得られました。
その後、実際に移行を行った人や、移行について検討した人のエントリーの情報を探して自分の「移行プラン」を考えました。

参考記事

将来WordPress移行を検討したいはてなブロガーがしておくべきこと4点 - 経済的自由...
はてなからWordPressへ移行した経験談をもとに、どのようにはてなブログを運営しておけば将来WordPressに移行することになった場合に楽か考えてみました。
はてなブログからWordPressに移行する際のパーマリンクなどの設定と方法 - シンス...
先日、はてなブログに設定してあったドメインをWordPressに移行したのですが、その時の手順について書き留めておきたいと思います。 単純にはてなブログの記事をエクス...

画像をGoogleフォトに移し変える

自分の場合、はてなブログで書いた記事の多くに画像を入れていましたが、画像の参照先ははてなブログ標準サービスの「はてなフォトライフ」を使っていました。
そのため、移行先でも画像の参照先をはてなフォトライフにしたままか、他の画像サービスを使うかが問題でした。
「Wordpressに移った後、画像の参照先がはてなフォトライフのままでもWordpressへデータ移行して表示することが出来た」という情報もあったため、はてなフォトライフのままでも問題なかったかもしれませんが、その場合はてなのサービスの一部を使い続けることになるため、移行を機に画像サービスも全てはてなフォトライフ以外の画像クラウドサービスに移すことにしました。
画像クラウドにはGoogleフォトを使うことにして画像データだけをまず全てGoogleフォトに移し変えました。

はてなブログでGoogleフォトの画像をアップロードする方法(2017年版picasa使用なし)
はてなブログProからワードプレスへの移行を検討していますが、移行において問題になることの一つが画像ファイルの扱いです。画像の移行先としてGoogleフォトを使うこと...

画像を全て移行するのに10日以上作業がかかりました。
その際、記事のリライトと、不要な記事の削除も平行して行い、560あった記事数を310くらいまで減らしました。

準備作業2.Wordpressに移行を試みるが失敗

2017年1月29日夜から、実際に移行作業を行いました。が、途中で失敗と判断し、はてなブログに切り戻しを行いました。

この時の移行作業の概要だけを書くと、エックスサーバーのX10プランで仮契約、はてなブログから記事データエクスポート、Wordpressをエックスサーバーインストールし、記事データをインポート、ドメインのネームサーバーをはてなブログからエックスサーバーに切り替えという流れで行っています。

エックスサーバーを選択しているのは、Wordpressを使用しているユーザーが多くネット情報やエントリーが多いこと、多機能・高機能で値段も抑えられていることなど。
情報が多いのはレンタルサーバーを選ぶ上で非常に重要ですがその点も重く見ると現状ではエックスサーバーが最有力となります。

移行作業を行ったエントリー。結果的には失敗して切り戻し

はてなブログProからWordPressへの移行失敗 移行作業で起きた問題の検証と今後の方...
このブログ(http://www.varis.jp/)について、2017年1月27日夜半からはてなブログProからWordPress(ワードプレス)への移転作業を行っていたのだが、失敗と判断して切...

この時、事前の調査で分かっていなかった問題が多数出て失敗と判断しました。
例えばドメイン切り替えから安定してWordpress管理画面に接続出来るまでに時間がかかる、Googleフォトが正常に表示されない、Amazon商品リンクのAmazletの表示が崩れる、Youtube動画、ニコニコ動画が表示されないなど。

この後、これらの問題を一つずつ調査して解決しました。

準備作業3.失敗原因を解決

ドメイン切り替えから安定してWordpress管理画面に接続させる

ドメイン切り替え後はドメイン浸透期間に繋がるか繋がらないか分からないため安定して接続するのが難しい状況になりますが、対策としてはhostsに自分用のエックスサーバーのIPアドレスと自分の独自ドメインを対応させるように書くと常にエックスサーバー側に繋がるようになります。
hostsについては移行作業の中で書きます。
エックスサーバーのマニュアルでもhostsを使った作業について説明があります。

動作確認について | レンタルサーバー【エックスサーバー】
レンタルサーバー「エックスサーバー」のご利用マニュアル|サーバー移転作業に際して、ネームサーバーの変更前に動作・表示を確認できる「動作確認URL」機能とhostsフ...

Googleフォトが正常に表示されない

テーマによって表示される・されないがあるようです。
自分はSimplicity2というテーマを使っていますがGoogleフォト画像の表示が可能です。

Amazletの表示が崩れる

これもテーマによって崩れる・崩れないがあるようです。
Simplicity2テーマでは問題なく表示されています。

Youtube動画、ニコニコ動画の表示

はてなブログとWordpressでは使っているタグが違うため記事データを移行しても表示されませんでした。
タグの書き方を変更することで表示出来るようになります。

準備作業4.Wordpress作業環境を作る

この時点で方針としては、一旦、ムームードメインで「別の独自ドメイン」を取得し、Wordpressで作業環境を作って、移行前の作業とテストを行うことにしました。
今でこそWordpressの環境では普通に作業出来ていますが、この当時はそこまで知識が無く、Wordpressのテーマはどれを選ぶべきか?といったことすら試行錯誤が必要でした。
テーマによっては、スマホサイトすらまともに表示できなかったため、「スマホサイトが表示出来るかどうか」といったこともこの時点の確認内容でした。
また、記事を単にWordpress側にインポートしただけでは、形崩れやタグ崩れが発生することが想定されたため、「Wordpressの環境でインポートした後に記事をチェックして形崩れやタグ崩れの箇所を修正する」「修正したデータを再度Wordpressにインポートしてチェックする」という工程が必要でした。

また、作業環境として別ドメインを取る理由については、本ドメイン(このサイトでは「varis.jp」)を使うと、この時点でドメインがCNAME参照しているはてなブログの方に影響があると思ったためです。
が、今思うと実際には「作業用ドメインは不要」でした。
エックスサーバーで「varis.jp」(本ドメイン)を登録し、PCのhostsファイルにエックスサーバーとvaris.jpの一対一対応を書いておけば、はてなブログに影響なく作業が可能でした。(hostsについては本エントリーの中で記します。)
この時点ではこのことに気付かなかったため、このような手段を取っていました。

以下のエントリーで作業ドメイン、Wordpress作業環境を作りそこでの作業内容を書いています。

準備作業5.Wordpress作業環境での作業

作業環境での作業内容を箇条書きで書きます。以下の作業を2/1から2/9頃まで行っていました。

  • はてなブログサブブログを作成し仮記事を作成
  • エックスサーバーX10プラン本契約(仮契約期間が過ぎたため本契約)
  • 作業用の独自ドメインをムームードメインで取得
  • 作業用ドメインをはてなブログに設定しムームードメインにCNAMEレコードを設定
  • 作業用ドメインをエックスサーバーに設定
  • エックスサーバーにWordpressインストール
  • ムームーDNSでネームサーバーをエックスサーバーのものに変更
  • はてなブログのメインブログの記事名とURLの一対一対応したXLSファイル作成
  • Akismetプラグイン導入
  • Googleフォトプラグイン導入、認証設定
  • 投稿フォーマット変更
  • 設定>パーマリンク設定>カスタム構造
  • マルチバイトプラグイン導入
  • 検索クロール回避
  • パスワードロックプラグイン導入
  • 設定>パスワード保護有効
  • はてなブログメインブログから記事データエクスポート
    PCローカル環境でエクスポートファイルの修正

    • エディタ(Sakura)でエクスポートファイルを開きH3をH2に一括置換(はてなブログではh3が最大だがWordpressではh2になるため)
    • STATUSをPrivate(非公開)に一括置換
  • はてなブログメインブログのエクスポートファイルをWordpress作業環境にインポート
  • WordPress作業環境でメインブログの記事を修正(ここで修正した記事データを最終的にWordpress本移行でインポートする)
  • 記事パーマリンク修正
    はてなブログでインポート時点では年月日とpostnameが合体してそのままでは移行元とURLが変わるため、Wordpressにインポート後記事のパーマリンクを以下の形式に修正する。

    例:
    元記事


    WordPressインポート直後


    以下の形に修正する

  • 画像をGoogleフォトサブアカウントへ変更
    サブアカウントで画像をアップロードし直す予定でしたが、表示だけならメインアカウントでアップロードした画像でも表示出来ており、作業量を少なくするため一旦このままとしました。
  • テーマの選定
    無料で使えるものとしてはSimplicity2が一番良さそうでした。
    ネット上の情報も多くカスタマイズするのに問題はないレベルの情報量があります。
    スマホ対応もSimplicity2でやってくれるためプラグインは不要です。

    Simplicity2テーマサイト
    Simplicity | 内部SEO施策済みのシンプルな無料Wordpressテーマ

    Simplicity2の親テーマと子テーマの二つはセットで使います。
    (実際に有効にするのは子テーマのみ。CSSの設定も子テーマだけに行い、親テーマのCSSは変更しない。)テーマ配布サイトからZIPをダウンロードして管理画面にアップロードして有効化します。

    Simplicity2のダウンロード
    無料WordpressテーマSimplicity2のダウンロードはこちらです。テーマのアップデート方法は、以下を参照してください。Simplicity2のダウンロードWordPress4.1以上、PHP5...
  • ニコニコ動画スクリプト修正
    Simplicity2子テーマCSSにvideo-container用記述を入れます。
    これを入れないと動画幅がレスポンシブにならないため。

    実際にニコニコ動画を記事に埋め込む時は以下のように入れます。

  • Youtubeスクリプト変更
    video-containerを使うとシークバーの表示が切れるため使わず、普通にiframeで表示させることにします。
  • アイキャッチ画像
    Simplicity2テーマ機能側で表示されるため特に作業なし。
  • CSSカスタマイズ
    Simplicity2子テーマにカスタマイズを入れます。(親テーマCSSは変更しない。)

    参考記事

    Wordpressテーマ「Simplicity」をカスタマイズする19のポイント【2016.03.03更新】
    SEOに強くて、使いやすいWordpress無料テーマ「Simplicity」のカスタマイズ方法を19のポイントで紹介します。
    【Simplicity2カスタマイズ⑥】記事一覧をカード型の枠で囲って表示する方法
    今回行うカスタマイズは、「トップページの記事一覧をカード型の枠で囲って表示する」です。こちらもスタイルシート(style.css)にコードを追記するだけで可能な簡単な...
  • カテゴリースラッグ作成、親・子階層化、グローバルメニュー作成
    グローバルメニューを作るにはカテゴリーを階層化する必要があります。
    カテゴリーははてなブログから移行した段階で反映されていますが、Wordpressの機能である英語名のスラッグには対応していないせいでスラッグに日本語が入っていて英語に変更出来ませんでした。(はてなブログの時点で英語カテゴリーにしていれば英語化されるかもしれません)
    そのため最初からカテゴリーを設定し直してスラッグを作成し記事に割り当てが必要になります。自分の場合はカテゴリーを最初から設定し直し、スラッグを設定しカテゴリーの階層化を行ってグローバルメニューを作成しました。

    • カテゴリー設定、スラッグ設定、階層化
    • 記事へのカテゴリー再設定
    • グローバルメニュー作成

    参考記事

    2.2 子テーマを編集しヘッダーとグローバルナビを設定する方法
    本記事では,インストールしたSimplicity2の子テーマを編集していき,サイトのヘッダー(画面上のタイトル部分)とグローバルナビ(画面上のメニュー部分)を設定してい...
    • 2.2 子テーマを編集しヘッダーとグローバルナビを設定する方法
    • 2.3 プラグインを用いてグローバルナビを変更する方法とスタイルシート(style.css)の編集方法
  • コメント非許可設定
    投稿一覧>編集・適用>コメントを許可しないで一括設定出来ます。
  • スマホ表示テーマまたはスマホ用プラグイン導入
    Simplicity2で対応しているため不要です。
  • サイドバー設定、ウィジェット設定
    この時点ではお知らせ(固定ページ)、最新記事と新着記事(Simplicity2機能)のみ表示させていました。
  • フッター設定(コピーライト)
    テーマカスタマイズ>その他>サイトのライセンス表記
  • 固定ページ作成
    WordPressでは通常のエントリーとは別に固定ページを作る機能があるため、運営者紹介、サイトポリシー、サイト沿革等を作成しました。
    これらは記事投稿では作らず固定ページで作成します。
  • お問い合わせフォーム設置
    通常はお問い合わせフォームとして「Contact Form 7」というプラグインを使うが、メール送信元がエラーになる、プラグインを入れた方がいいなどの情報もあり対策が面倒でした。自分は元々はてなブログの時点でGoogleフォームをお問い合わせフォームとして使っていたためそちらのコードを流用することにします。
    固定ページにはてなブログ側のGoogleフォームコードをそのままコピーして作成しました。
  • その他プラグイン導入
  • 設定>メディア>画像サイズを全て0にする

    参考記事

    【WordPress】ワードプレスでメディア(画像)がぼやけない正しいアップロード(追...
    どうしてもワードプレスの画像がぼやける。。ワードプレスで記事を投稿する時、画像があった方がわかりやすい場面って結構あると思います。 ところが、手元で(自分のパ...
  • 記事を修正後Wordpress形式でエクスポート>Wordpress形式でインポート>体裁確認>を繰り返して記事を仕上げる
  • 記事がカラム落ち(divタグ落ち)していないことをチェック
  • 全てOKになったら全記事を非公開
    投稿一覧からチェックボックス全てチェック>一括操作>編集>適用>ステータスを非公開>更新で一括変更

移行作業の前に気になっていたこと

ここまでで、Wordpress作業環境で記事データの修正、テーマの選定やCSS設定、プラグインの導入、スマホ用の表示設定など全て作業を完了していますが、移行作業に直ぐに踏み切れませんでした。
まだ自分の中で解決していない疑問点があったためです。
気になっていたのは主に3つでした。

1.エックスサーバー側で削除したドメインをエックスサーバーで再度登録出来るかどうか
1月末に行った作業の際、一度本ドメイン(varis.jp)を登録して削除していました。
このドメインを再度設定出来るのかどうか分からなかったためエックスサーバーサポートに確認しましたが使用可能という回答でした。

2.ディレクトリ構造を変更すべきか
WordPressをマルチサイト化する際はディレクトリ構造を分けてインストールするというやり方もあり、どういうやり方がいいのか迷いましたが、調べたところ、「マルチサイトはプラグインの非対応などもあり初心者には敷居が高い」という情報が気になったため、自分は慣れていないこともあり今回はディレクトリ構造に手を入れずインストールすることにしました。

3.記事に付けられているインデックス評価の維持
これは二つの側面があり、
一つ目は移行中やドメイン浸透期間に同じ内容の記事が二つ存在するため、検索エンジンにコピーコンテンツと看做されペナルティを受けることを避けること。
ペナルティを避けるためcanonical設定を入れるが、はてなブログでは記事個別にヘッダー設定が出来ないこと。

二つ目はコピーコンテンツペナルティを避けるため元記事のはてなブログにアクセスされた際にWordpressの同じ記事に301リダイレクトさせたいが、はてなブログでは個別の記事から301リダイレクトが行えないこと。

現在インデックスされているドメインはwww.varis.jpですがWordpressインストール時にサブドメインのwwwなしでインストールした際はサイトURLがvaris.jpになります。
そうすると検索エンジンから見るとwwwなしになるため別URLでインデックスされこれまでの検索エンジン評価がなくなってしまいます。
対応としてvaris.jpにアクセスされた際にwww.varis.jpに転送させる301リダイレクト設定を行うのが普通ですがはてなブログでは301リダイレクトが行えません。

これについて有志がJavaScriptで実装している例がありました。
具体的にはJavaScriptを検索クローラーが読み込むため、301リダイレクト出来ないはてなブログでも記事の本文にJavaScriptを差し込めばcanonical設定出来るという内容です。

参考記事

はてなブログでmetaタグにnoindexやcanonical設定する方法 - きりんの自由研究
はてなブログは、サイト全体のmetaタグ設定はできますが、記事毎にmetaタグ等ヘッダ操作をする事はできません。 しかし、SEO目的で特定の記事をnoindex化したりcanonica...
ブログ移転時必見!はてなブログ(無料)からリダイレクトをする簡単で効果的な方法!
はてなブログからのブログ移転では、301リダイレクトが行えません。GoogleがJavaScriptを理解することを利用し、旧記事から新記事へのリダイレクトと canonicalの設定を...
【CSS・HTML】はてなブログ記事を「noindex」。不要な記事を削除してSEOにも効果あ...
4/24日、私が運営している別のブログで、特定の記事をグーグル等の検索エンジンの検索結果にインデックスさせないようにすることが出来る、「noindex」を記事に挿入...

記事の評価の維持についてどこまでやるかですが、自分はこれらのやり方は使いませんでした。
GoogleフォーラムではてなブログからWordpress移行について質問している方がおられてGoogle社員が回答している内容を参考にしました。
質問内容は掲載しませんがGoogle社員の回答だけ掲載します。

ブログ移行に関する質問へのGoogle社員の回答

  • 移転がwebmastertool(インデックス)に反映されるには数週間程度時間がかかる
  • 旧ブログに対する noindex などの処理でGoogle のクローラーが認識する前にコンテンツは削除されてしまったのではないか(記事が先に削除されればnoindexを認識できない)
  • rel=”canonical”もサイトマップも設定されているのであれば次第にURL登録が進むはず
  • 最低でも移転から1ヶ月は様子を見るべき(webmastertoolのインデックス状況)

「ここで移行すると今もらっている検索順位やインデックス評価がなくなるかもしれない」
「はてなブログは現状を維持してWordpressは新規サイトとしてスタートすべきではないか」
移行の最終判断を行うにあたりかなり悩みましたが、ブログ移行後はある程度評価やインデックスが落ちても仕方がないと踏ん切りを付けました。

そもそもの考え方として、今もらっているブログへの評価は、はてなブログ自体が検索エンジンに評価されているという部分の影響が大きく、移行後ははてなの評価がなくなり自分の独自ドメインだけの評価に変わるため、検索エンジンから見た評価が一気に落ちる可能性があるためです。

移行というのははてなブログからもらっている評価を失うことと同義でこれを受け入れないと移行をすることは出来ません。

また、自分の場合は、「同じ独自ドメインから独自ドメイン」というURLが変わらないケースであり、サイト移行でも最も難易度が低いため、恐らく移行に当たり想定している以外に大きな問題は出ないだろうという感触もありました。
(Googleフォーラムではもっと複雑な問題も報告されていました。)

今回、結論としては、フォーラムの質問者と同じようなやり方で移行する事にしました。

WordPressに記事データ移行後に以下の対策を行います。

検索エンジン向けの対策
はてなブログ側は全記事を削除し、サイト移転の報告のみトップページに表示させます。
(全記事を削除し、サイト移転記事の掲載でもクローラーが認識するという報告があります。)
はてなブログのヘッダーにnoindex、canonical等を入れてインデックスを防ぎます。ヘッダーの設定は個別の記事ではなくブログ全体のみですがやらないよりはやっておく方が良さそうです。

ユーザ向けの対策
はてなブログヘッダーにmeta refreshを入れてWordpressサイトに自動的に移動するようにしておきます。移転記事をクリックしてもらえなくても数秒後に移動するようにしておきます。

流れ的には以下のような形で推移します。

  1. ムームードメインでドメイン切り替え
  2. はてなブログ側検索回避
  3. はてなブログ側全記事ゴミ箱
  4. はてなブログに設置している広告やサイドバーは全て削除
  5. トップ記事に移転のお知らせを書き、新ドメインを表記
  6. はてなブログ側でヘッダーにnoindex,canonical,meta refreshを設定
  7. はてなブログ側でドメイン削除

本番移行作業

本番移行作業1.Wordpress側作業

以下、移行の本作業の内容となります。
作業環境の作業と被っているものもありますがそのまま掲載します。
本作業では先にセキュリティ系の設定、プラグインでセキュリティを高めてその後記事に必要になる設定を入れて記事データをインポートするという流れで行います。
作業開始時刻は2月11日の0時頃から行いました。

  • エックスサーバーで本ドメイン設定(varis.jp)
  • エックスサーバーでデータベース作成、DBユーザー作成、DBユーザーをDBに割り当て
    自分の場合は手動で作っていますが、Wordpressインストール時に自動で作成されるため、手動・自動どちらでも可能です。
  • WordPressインストール(インストール時に作成したDBを指定)
  • ムームーDNSでネームサーバーをエックスサーバーのネームサーバーに変更
  • PCのhosts設定
    移行作業で使っているPCのhostsファイルを編集し、ドメイン浸透期間の影響を受けずに作業出来るようにします。ネームサーバーを変更するとドメイン浸透が始まるため、エックスサーバー側に到達せずエラーになる場合があります。
    そのため、ドメインの影響なくhostsファイルに一時的にエックスサーバーのIPを記して確実にエックスサーバー側に辿りつけるようにします。やり方としてはsakuraエディタでC:\Windows\System32\drivers\etc\hostsを開き、以下の2行を一番最後に入れて保存します。
  • WordPress管理画面ログイン(http://ドメイン/wp-admin/)
  • WordPressサイトタイトル、サイト説明設定
  • 設定>RSS/Atom フィードでの各投稿の表示
    抜粋のみを表示にチェック
  • WordPress検索回避設定
    設定>検索エンジンでの表示
    「検索エンジンがサイトをインデックスしないようにする」にチェック(公開準備が出来たら解除します。)
  • 投稿者ユーザー作成
  • コメント非許可設定
    設定>ディスカッション設定
    自分宛のメール通知は全てオフにする(スパムコメントでメールが大量に来るため)
  • Password Protected導入、有効化
    設定>パスワード保護有効
  • Akismetプラグイン導入
    APIキー認証>受信メールでアクティベイトしてサインイン>バーを左スライドで0円にしてcreate subscription>表示されたAPIキーをコピーしてWordpress管理画面に貼り付け
  • Edit Author Slug
    各ユーザーにAuthor Slug設定
  • Force email login
  • 投稿フォーマット変更
    設定>パーマリンク設定>カスタム構造
  • マルチバイトプラグイン導入
  • テーマの新規追加からSimplicity2テーマとSimplicity2子テーマをアップロード(作業サイト用にダウンロードしたファイル)
  • Simplicity2子テーマを有効化
  • WordPress形式のインポートを可能に設定
    ツール>インポート>Wordpress
  • 記事データのインポート
    作業用サイトで記事を修正したエクスポートファイルをインポート
    インポート時に作成した投稿者ユーザーに記事を割り当てる
    ※この時は「添付ファイルをダウンロードしてインポートするにチェック」を外していたためトップエントリーとアイキャッチ画像が全て表示されなくなったためチェックを入れるべきでした。
  • Category Order and Taxonomy Terms Order
    カテゴリーを未分類を一番上にする(デフォルトだと一番下にあってスクロールするのが面倒なため)
  • インポートした時全記事がカテゴリー未分類に分類されるため、未分類をオフにする(クイック編集で開いて編集)
  • 記事のURLがインポート元を維持しているかを確認(数個ランダムに確認)
  • カテゴリー構造とカテゴリースラッグがインポート元を維持しているかを確認します。
    作業サイトで行ったカテゴリー構造を維持していました。
  • この時点で発生していたエラーの対応(作業用環境では発生していないエラーがあったため対応)
    • 記事のアイキャッチ画像が表示されない
    • トップページのトップエントリーの画像が表示されない

    記事を一旦削除してインポートし直し、その際画像も全て添付付きでインポートする(添付ファイルをダウンロードしてインポートするにチェック)
    この対応でアイキャッチ画像とトップエントリーの画像を表示出来ました。
    インポート後、再度未分類のカテゴリーを外します。

  • Max Mega Menu導入、グローバルメニュー作成
  • ヘッダー文字を等間隔にする
  • ウィジェット等の設定
    作業サイトと同じ設定にします。
  • CSSカスタマイズ
    Simplicity2子テーマに作業サイトと同じカスタマイズを入れます。(親テーマCSSは変更しない。)
  • スマホ用のCSS、メニュー等の設定
    作業サイトと同じ設定にします。
    Simplicity2子テーマのCSSまたはモバイル用CSSに設定します。
  • 固定ページ作成
    作業サイトで作成した固定ページを維持していたため不要。
  • 固定ページにnoindex設定
  • フッター設定(コピーライト)
  • モバイル用スライドメニュー設定
  • モバイルサイトトップロゴ設定
  • 設定>メディア>画像サイズを全て0にする
  • その他プラグイン導入
    • Jetpack
    • Broken Link Checker
    • No Self Pings
    • TinyMCE Advanced
    • WordPress Popular posts
    • EWWW Image Optimizer
    • Table of Contents Plus
    • Revision Control

本番移行作業2.はてなブログ側作業(1)

  • はてなブログ側のAnalyticsコードを外す
  • はてなブログ側のGoogleSearchConsoleコードを外す
  • はてなブログ側でAdsenseに影響しそうなものは外す

本番移行作業3.ドメイン関連作業

  • はてなブログ設定でドメイン削除
    この後はてなブログへのアクセスはxxxxxx.hatenablog.comからのみ可能になります。
  • ムームードメインのCNAMEレコードを削除

この後、ドメインがある程度浸透するまでは、自分のPC環境ではhosts設定で見えていますが実際にはどういう状態なのか判断することが難しいため、キャッシュを削除したブラウザで確認します。

自分は作業環境としてFirefoxでWordpress管理画面にアクセスして設定作業。
はてなブログやWordpressブログの確認はIEでキャッシュをクリアして表示させて確認しました。

本番移行作業4.公開準備完了後

  • WordPress側でパスワード保護解除
  • WordPress側で検索回避設定を解除
    設定>検索エンジンでの表示
    「検索エンジンがサイトをインデックスしないようにする」のチェックを解除

本番移行作業5.はてなブログ側作業(2)

  • はてなブログ設定で検索回避
  • はてなブログトップページにサイト移転の記事を掲載
  • はてなブログで上記1記事を除き全記事を削除(ゴミ箱)
  • はてなブログヘッダー設定

この時点で2月11日PM19時頃でしたがドメイン浸透に時間がかかるため一旦作業を終了しました。

本番移行作業6.ドメイン浸透後作業

2月12日AM9時頃nslookupでドメインの回答が返るようになり、ブラウザからも表示されていることを確認したので作業再開しました。

  • PCのhostsファイルを元に戻す
  • 各記事のチェック
    記事名とURLの一対一対応XLSファイルでURLが全て該当の記事が表示されることを確認
    →パーマリンクやpostnameの設定ミスが数件あったため修正
  • hostsなしの状態でキャッシュをオフにしたブラウザでアクセス出来ることを確認
  • スマホのSafariからアクセス出来ることを確認
  • Simplicity2テーマ設定からAnalyticsコードを入れる
    Analyticsコードははてなブログで設定していたものをそのまま使用(移行前・後ともドメインが同じのため)

本番移行作業7.www正規化設定作業

この時点で作業開始から1日半経過していますが、ここまで順調に作業出来ているため、www正規化設定についてもクローラーからインデックスされる前に対応しておこうと思いました。

参考記事

【WordPress】.htaccessを使ってURLをwwwありに統一する方法と注意点
WordPressで構築したサイトのURLを「wwwあり」に統一する方法と注意点についてまとめました。 ※ちなみに当サイトはさくらインターネットのレンタルサーバで運用していま...

www正規化とは、自分の場合はこれまでwww.varis.jpではてなブログを運営していたため、検索インデックスがwwwありで検索クエリと結び付けられています。

で記事を公開するとwwwなしのURLでインデックスされるためこれまでのインデックス評価がゼロになります。

実際には、エックスサーバーの仕様でドメインを登録時にwwwサブドメインについてもAレコードで自動登録されているため、wwwあり・なしどちらでもアクセス可能です。
ただその場合はWordpressインストール時に設定したサイトURLに一元化されます。
掻い摘んで言うとwwwあり・なしどちらでもアクセス出来ますが到着ページはvaris.jpになります。

この状態でインデックスされるURLはwwwありとなしで半々になる可能性もありますが、恐らくwwwなしの状態でインデックスされると思います。
wwwなしだとパーマリンクの構造を維持していてもこれまでの記事のインデックス評価がゼロになります。
これをwwwありに一元化する設定がwww正規化です。
移行前の評価を引き継ぐなら、移行元が「wwwあり」の場合は移行先も「wwwあり」に設定します。

www正規化については、これまで調べていた情報から.htaccessでwwwサブドメイン付きURLへリダイレクトさせるのが正しいと思っていましたが、エックスサーバーに問い合わせすると.htaccessでの301リダイレクトは不要との回答でした。
単にWordpress管理画面でWordpressURL、サイトURLの二つをwwwありのURLに変更するだけでよいとのことです。

技術的な理由としては「WordPressの仕様で、管理画面にて設定されたサイトURLへ自動的に転送されるため、[.htaccess]ファイルへの記述は不要」とのことです。
自分もWordpressに詳しいわけではないためこの理由はよく分かりません。

WordPress管理画面からWordpressURLとサイトURLを変更した状態

変更後、管理画面に入るためのURLが変わります。

  • 変更前 http://wwwなしドメイン名/wp-admin/
  • 変更後 http://wwwありドメイン名/wp-admin/

変更後はトップページや記事のアクセス先はwww付きで表示されるようになりました。
http://varis.jpでアクセスしてもhttp://www.varis.jpがランディングページのURLになりwww正規化出来ています。

本番移行作業8.サーチコンソール・サイトマップ関連作業等

  • Google XML Sitemapsプラグインを導入しsitemapを作成します。

    参考記事

    Google XML Sitemapsの設定と使い方
    Google XML Sitemapsとは検索エンジンに自サイトの構造を認識させ、くまなくクローリングしてもらうためのサイトマップ「sitemap.xml」を自動作成するプラグインです。...

    Google XML Sitemapsはバージョン4.0以降ほぼ自動化されており、これまでのようにsitemap.xmlをサーバーに保存したり手動で送る必要はなくなっています。(手動で送る事も可能)

    Google XML Sitemapsをプラグインインストールして有効化します。
    管理画面の設定>XML Sitemapで設定して保存。
    Notify Search Engines about your sitemapの所のyour sitemapを押すと更新されます。
    サーチコンソール側のクロール>サイトマップ>サイトマップの追加/テストから
    サイトマップをURLで指定して送る事も出来ます。

  • サーチコンソールで全記事をFetch as Googleする
    本来やるべきですが面倒なのでやっていません。
  • WordPress Ping Optimizer
    リストにURLを入れてenable pingingにチェックを入れてsave settingsで保存します。
    更新通知先はWordpress公式で掲載しているほか、有志が年度毎にPing送信先サーバーを作っているのでそれを参考にします。

    WordPressCodex日本語版更新通知サービス

    参考記事

    WordPress Ping Optimizerプラグイン設定2017最新
    WordPress Ping Optimizerとは WordPress Ping OptimizerはWordPressでブログを運営しているのであれば絶対に入れるべき必須プラグインのひとつです。 WordPress Ping O...
  • Simplicity2テーマ設定から広告設置
    URL正規化し接続が安定したため広告を設置しました。(2月12日PM20時頃)
  • アドセンス広告のブロックを許可
    これまで、アドセンスの広告ではてなの規約抵触のリスクから一部のデリケートな広告をブロックしていましたが、はてなが関係なくなったため、デリケートな広告を表示可に変更します。
  • はてなブログ側アクセスが減っていることを確認
    これを書いている2月14日AM0時時点では0です。

本番移行作業9.移行の最終判断

この後、企業の本番サーバーの手順であれば「移行の最終判断」という工程が入ります。
移行手順とテスト結果からOKかNGかを判断して作業を行います。
OKケースだと切り戻しなしで現状を維持します。

NGケースではそれまで検索順位があったキーワードで極端に下がったりインデックスが新サイトにされない場合ははてなブログに切り戻しをするかどうかを検討し切り戻しを行います。
戻す場合は、はてなブログ記事管理画面の右下のゴミ箱から記事を復元出来るので記事を戻し、はてなブログを公開にして検索回避を解除します。
WordPress側を検索回避にして全記事を非公開にします。

双方のドメインも切り戻し、はてなブログのネームサーバーを復活させCNAMEレコードではてなブログにドメインを向けます。
エックスサーバーのネームサーバーを入れていた設定は削除します。
作業的には切り戻しも直ぐに行えます。

今回は特に問題なく移行出来ているため切り戻しなしとしています。
理由としてはsite:ドメイン名で表示されるインデックス数が移行前・後とも同じ。
検索結果から表示されるURLで移行先(新サイト)に飛ぶこと。
Google Analyticsの統計が取れていることなどから判断しています。

実質的にはユーザーから見て接続断がドメイン切り替えから浸透期間の間の一日程度でその間クロールされたとしてもごく僅かな記事に留まるはずなので影響はほとんどありません。

上に書いているように以前は自分のドメインでもはてなに301リダイレクトされていたため、検索順位におけるはてなの影響は少なくないと思いますが、ドメインがはてなから完全に独自ドメインの評価だけになるため検索順位はある程度落ちると思っています。
それは最初からWordpressで運営して来なかった自分の問題なので仕方ありません。

以上で移行作業は終了です。
以下残タスクやメモなどを記載します。

残タスクと付記

残タスク

  • PCサイトトップ画像
    →対応済み(暫定)
  • 個別記事の検索対策実施(SEO title、meta description、meta keyword)
  • 画像サーバー検討(エックスサーバーに移し変え、またはGoogleフォト続行)
    →一先ずGoogleフォトを継続
  • サイト全体の常時SSL化と「http→https」の個別記事リダイレクト(エックスサーバー無料独自SSLを利用)
    →対応済み
  • PubSubHubbub導入(インデックス高速自動化)
    →対応済み
  • 自動バックアッププラグイン
    →エックスサーバーデフォルトバックアップがあるため不要?
  • Favicon設定
  • モバイルサイトロゴからトップページ遷移
    →対応済み

    参考記事

    Simplicityに画面幅いっぱいのヘッダー画像を設定する方法
    Simplicity1.4から、テーマカスタマイザーだけで、以下のような画面幅いっぱいのヘッダー画像を設定できるようになりました。 このヘッダー画像をブラウザ幅いっぱいに...

    Simplicity2カスタマイザー>ロゴを画像にするにチェック>モバイルヘッダー背景画像>画像の変更から使用するロゴ画像を選択>保存して公開を押す

  • モバイルサイトで横表示の時画像の裏にサイトタイトルが出ている対応
    →対応済み(上記の対応をした時に解決)
  • グローバルメニューにFont Awesome 4 Menusアイコン表示
    →対応済み
  • 主用カテゴリーグローバルメニュー直下にカード表示
    →対応済み
  • Jetpack有効時にフッター左下にマークのようなものが出る
    →対応済み(Jetpackの設定でマーク表示をオフにする)

    参考記事

    Jetpackを使うとブログの左下にニコちゃんマークが出現するよ!
    WordPressのプラグインJetpackを利用しているなら、ブログの左下にニコちゃんマーク(スマイルマーク)が出現しているかもしれません。その原因と非表示にする方法をご...
  • Webmastertool(SearchConsole)で設定していたプロパティ「www.varis.jp」が「このプロパティにアクセスできません。」エラーが出た対応
    →対応済み
    恐らくこれまではてなブログの時にDNS側にTXTレコードで”google-site-verificationコード”を入れていたものを、サイト移行の際にTXTレコードを削除したため、発生したと思われる。
    以下のエントリーで対応していた内容。

    独自ドメインはてなブログをSearch Consoleでサブドメインwww正規化する方法を解説
    今回は独自ドメイン取得後にwww正規化問題が発覚して対処したという話題です。独自ドメイン移行後にwww正規化問題が発覚先日はてなブログ(xxxxxx.hatenablog.com)から...

    エラー解消方法

    1. meta name=”google-site-verification”以下のコードをWebmastertoolで発行
    2. 発行した以下のコードをSimplicity2子テーマのheader-insert.phpに挿入して保存
    3. Webmastertoolでプロパティを確認
  • シンプリシティ2の子テーマに反映されていたCSSが反映されなくなった
    →対応済み
    bodyの閉じタグがないため。閉じタグを入れると子テーマが反映された。
  • スマホでサイトを見た場合ニコニコプレイヤーがエラーになり更新を押してもエラーになる はてなブログスマホサイトからでもエラーとなるため解消不可。 ニコニコのプレイヤーを別のものに変えても直らない。
    →ニコニコ側の問題
    対応としては動画掲載の場合Youtubeのみを使う(ニコニコ動画は掲載しない)。
  • コピー防止プラグインのWP-Copyright-Protectionを有効化するとでカスタマイザーに入れなくなる 有効化するとテーマのカスタマイズでサイトトップにリダイレクトされるためカスタマイズ不可能になった。停止するとカスタマイザーに入れる。
    →対応済み
    別のコピー防止プラグイン(WP Content Copy Protection)を使って正常動作を確認。WP-Copyright-Protectionは削除。

その他メモ

  • キャッシュ系プラグインはPVがかなり増えない限りは導入しない方がよい。
  • はてなブログは完全に削除せず数ヶ月から数年などある程度の期間は残しておく。(移行元サイトは直ぐに削除するよりある程度残したほうがよいとの情報あり)(はてなブログ削除済み)
  • Simplicity2のブログカード機能 はてなブログのようなブログカード(カード型リンク)が使える ビジュアルで開いてリンクのURLを画面に入れてリンクを挿入から同じURLを設定するとブログカードで表示される。 (はてなブログの記事データをそのまま移行しても大抵のテーマではブログカードは表示されない。但し以下のタグでも表示はされていた。)
  • All in one SEO PackとSimplicity2の競合問題
    SEO系のプラグインとテーマ側のSEO機能は競合して相性が良くないとのことなのでプラグイン側は導入しない。SEO設定はテーマ側だけで行う。

    参考記事

    Simplicity2とAll in One SEO Packの相性問題
    何気なく、GoogleのSearchConsoleを眺めていたところエラーがありました。調査したところ、どうやらSimplicity2とAll in One SEO Packはあまり相性は良くないことがわか...
  • ソースコードやCSSをpreタグで囲んだ場合ビジュアル画面で編集するとpreタグなしに戻ることがある。
    liタグで囲んだ場所を改行して保存すると改行がなくなることがある。
    リンクのtarget=”_blank”を入れた箇所が保存するとtarget指定がなくなる。
    →原因不明(恐らくWordpressの仕様の問題)
    ビジュアル編集だとおかしくなりやすいので、修正は出来るだけテキスト編集を使う。
  • Simplicity2テーマのカードリンクの書き方をした場合、カードリンクになるリンクとならないリンクがある。
    →原因不明
    カードリンクの書き方をしない書式で統一するか、確実にカードリンクになるプラグインが今後出てくれば導入する。

本稿の終わりに

突発的に始めたため確定申告の時期に重なり、中々作業の終わりが見えず辛いものがありましたが、ようやく終わりになり、この記事が書けて良かったです。

作業的には、画像の修正とテーマの選定、記事のインデックス評価がどこまで維持されるかが分からないことの3点が難しい問題でした。
画像は元記事の画像量が多く純粋に修正量が多かったことと、Googleフォトの書式や挙動が未だによく分からないため、調べるのに時間がかかりました。

テーマの選定は、Wordpressに移ったばかりの場合は一番の問題かもしれません。
WordPressに詳しくない初心者は管理画面にログイン出来たとしても余りにも漠然とし過ぎていて何をすればいいか分からないためです。
テーマによってスマホ表示される・されないがあり、スマホ表示されない場合はプラグインを入れて出すのかという部分まで調べないといけません。
Simplicity2やSTINGERのようなパッケージ的なテーマを使うと移行で問題になりそうな大抵の事が解決されているため、作業が分かりやすいと思います。

記事のインデックス評価の維持は人によってどこまで重要視するかが違うと思いますが、独自ドメインで同じドメインにサイトを引っ越す場合は最も難易度が低いので自分のケースはそれほど難しくなかったと思います。
もし移行の判断が難しい場合はGoogleフォーラム(ウェブマスターフォーラム)で相談するといいと思います。
ブログやCMSの移行の質問と回答がスレッド形式で行われており有識者やGoogle社員が回答しています。

Google ウェブマスターフォーラム

以上はてなブログからWordpressへのサイト移行の方法について掲載しました。
本エントリーが移行の際にお役に立てれば幸いです。

移行後のテーマ変更やカスタマイズについて

WordPress移行後にテーマの変更やカスタマイズを行った内容については、以下のエントリーに記しています。

テーマ変更

Wordpress有料テーマ「STORK」に変更 テーマ導入後の変更やテーマ感想など
Wordpressの有料テーマ「STORK」に変更しました。(画像掲載元:OPENCAGE)2月にはてなブログProからWordpressに移行した際、最初に使ったテーマはSimplicity2です。 Si...

サイトSSL化

エックスサーバー「無料独自SSL」常時SSL化の設定方法と作業記録
当サイトでAOSSL(常時SSL)対応しました。 2017年4月時点でエックスサーバー(Xserver)でWordpressを運営していますが、SSLはエックスサーバーの「無料独自SSL」を使っ...
SPONSORED LINK

この記事をシェアする

1 個のコメント