HTMLサイトをWordPressに引越しする方法

例えば、古くから運営しているサイト、または、当初は数ページ程度の小規模なサイトだった場合、HTML(タグ打ちやホームページビルダーなど)で構成されていることが多いです。

これをオウンドメディアのように積極的に更新するためには、HTMLよりもCMS(Content Management System)の1つであるWordpressに引越ししたほうがより便利です。

筆者が2014年ごろに運営を始めたサイトはHTML(メモ帳 + タグ打ち)で作ったサイトでしたので、今回は今後の強化に向けてWordpressに引越しすることにしました。

今回はその手順を紹介します。

前提条件

今回の前提条件は以下の通りです。

  • URLは変更しない
  • サーバーの移転も行わない

この場合、現在公開されているHTML下にWordpressをインストールし、引越し作業を行って、準備できたらHTMLサイトと交換する形でリリースします。

以下、エックスサーバーを前提に話を進めます。

レンタルサーバー 高速・高機能・高安定性の【エックスサーバー】
レンタルサーバーの【エックスサーバー】は、高速かつ高機能、稼働率99.99%以上の高い安定性で、業界トップクラスの高コストパフォーマンスを誇る、月額900円(税抜)からの高品質レンタルサーバーです。

HTML → WordPress引越し手順

WordPressを手動インストール

エックスサーバーはWordpressを自動インストールする簡易機能を有しています。

しかし、これを使うと現在公開されているindex.html(ウェブサイトのトップページ)が消えてしまうので、

  1. WordPress公式サイトより一式をダウンロード
  2. ダウンロードしたファイルをローカルで解凍して展開
  3. FTPソフトを利用してサーバーにアップロード(今回は「WP」というフォルダを作り、この中にアップする)

という手動の方法でWordpressをインストールします。

日本語
WordPress 日本語ローカルサイトブログ

WordPressをアップすると、「https://ドメイン名/wp/」にてWordpressサイトを閲覧できるようになりますので、アカウントを作成し、ログインします。

なお、Wordpressインストール後は「検索エンジンがサイトをインデックスしないようにする」にチェックを入れ、移転が完了するまでは、検索にかからないようにしておきます。

HTML import 2を使ってHTMLを投稿記事にインポート

WordPressサイトにプラグイン「HTML import 2」をインストールし、これを使って記事をWordpressにインポートします。

HTML Import 2
Imports well-formed HTML files into WordPress pages.

正しくディレクトリを指定しないとインポートできなかったり、英語の文字列からなるページが生成されたりしますが、筆者環境では一通りの記事をインポートできました。

記事をインポートできたら、あとはリリースに向けて構成の修正などを行います。

例えば、HTMLの最下部にランディングページへの誘導リンクを設置していたりすると、これを削除しなければいけないので結構面倒です。

WordPressサイトのアドレスを変更する

インポートした記事を修正し終えたら、HTMLサイトからWordpressサイトへの表示切替を行います。

ここが特にどきどきするシーンですね!

WordPressの管理画面から、「サイトアドレス」部分を変更します

WordPressアドレス部分はそのまま変更しません。

このアドレスを変更すると、Wordpressの管理画面は「https://ドメイン名/wp/」で表示されるようになりますが、ユーザーが見る外側の画面は「https://ドメイン名/」で表示されるようになります。

ただし、このままでは、Wordpressの本体がwpディレクトリ下にあるので、不十分です。

そこで、index.phpファイルをテキストエディタで開き、

  • ‘/wp-blog-header.php’を
  • /wp/wp-blog-header.php’へ

と変更し、wpディレクトリの1つ上のディレクトリ(エックスサーバーの場合、public_htmlディレクトリ)アップします。

これで、Wordpressのトップページと本体のあるディレクトリが結びつきます。

index.phpファイルをアップ後に、元々あったindex.htmlを削除すると、「https://ドメイン名/」でWordpressサイトが表示されるようになります。

正しく、Wordpressサイトが表示されるようになったら、「検索エンジンがサイトをインデックスしないようにする」のチェックを外せば完了です。

難しいところ

  • HTML import 2でインポートするところ(うまくインポートできないこともあるとか・・・)
  • WordPressのURLを変更するところ

この2点でしょうか。

もしも、サイトURL変更に失敗し、404になる場合には

もし、WordpressのURLを変更するタイミングを間違えたり、間違ったURLを指定し、ログインできなくなった場合(ログイン画面で404になる場合)には、wp-configファイルに

  • define( ‘RELOCATE’, true );

と記載し、アップロードすれば再度ログインできるようになります。

  • define(‘WP_HOME’,’サイトURL’);
  • define(‘WP_SITEURL’,’ワードプレスがインストールされているURL’);

と指定する方法もありますが、これでは管理画面上からWordpressのURLを修正できないので、本質的な解決にはなりません。

まとめ

  • 古いHTMLサイト、ホームページビルダーのようなソフトを利用したHTMLサイトをWordpressに引っ越すことができます
  • WordPressに引っ越すことで、コンテンツの追加と管理が容易になります
  • 手順は述べたとおり。FTPを利用したり、サイトのURLを変更するなど、難しく感じる部分があります

今回記事で紹介したサイトは、現在Wordpressで運用中です。

WordPressは様々な無料テーマが公開されていることもあって、手間をかけずに見栄えの良いサイトを作るのも1つの魅力ですよね。

続編:500ページ超のサイトをWordpressに引っ越した話

実録!500ページ超のHTMLサイトをWordpressに移転した話
1ヶ月ほど前になりますが、HTMLサイトをWordpressに移転するための手順を紹介しました。実はこの記事で紹介したサイトは「練習」で、この話には「本番」があるんです。 今回は、 稼動ページ:450ページほど ...

コメント