VK FullSite Installer でインポートしたデモサイトを使って既存サイトを移行してみた


  1. Staff Blog
  2. WordPress
  3. VK FullSite Installer でインポートしたデモサイトを使って既存サイトを移行してみた

アドベントカレンダー参加中!

この記事は「Vektor WordPress Solution Advent Calendar 2025」の12月11日の記事になります。
今回は、VK FullSite Installer でインポートできるデモサイト「観光ブログ」を使って趣味ブログをリニューアルした際の流れや気づきをご紹介します。デモサイトを既存サイトに使ってみたい方や、移行の流れをざっくり知りたい方におすすめです。

こんにちは、スタッフのササキです。
前回の、鮎月 (あゆつき)さんによる『Lightningテーマのカスタマイズの話』の記事は読まれましたか?ページヘッダーや余白のカスタマイズ事例を楽しく紹介してくださっています。まだ読んでない人はぜひチェックしてみてくださいね。

引き続き、『VK FullSite Installer でインポートしたデモサイトを使って既存サイトを移行してみた』を紹介していきたいと思います。

デモサイト「観光ブログ」の紹介

今年5月にリリースした「VK FullSite Installer(VKフルサイトインストーラー)」、もうお試しになりましたか?専用プラグイン(無料)を使えば、選んだデモサイトをまるごとインポートしてすぐに WordPress サイトが立ち上がる…とても便利なサービスです!

VK FullSite Installer | 目的に応じたデモサイトデータから超カンタンにウェブサイトが立ち上がります

目的に応じたデモサイトデータから超カンタンにウェブサイトが立ち上がります

VK FullSite Installer でインポート可能なデモサイト一覧を見ると、業種に応じたサイト型のものが多いです。

そんな中で、今回わたしが注目したのが「X-T9 無料版 観光ブログ」。こちらはライセンスタイプがなんと「無料」!気軽に試せます。

辺久町だより | Bekumachi Dayori

辺久町の豊かな森林と清らかな空気、点在する温泉やアウトドア体験の魅力を発信する情報ブログ「辺久町だより」をお届けします。

トップのスライダーで目を引くインパクトがありながら、本文部分はシンプル&読みやすさ重視。余計な装飾を抑えた構成。趣味のブログ、地域の魅力を伝えるローカルメディアはもちろん、企業のオウンドメディアにも使えそう。

PCで表示したときに記事のタイトルが写真に重なって表示されるところも、気に入ったポイントです。

新規サイト専用だけど既存サイトで使いたい

個人で運営する趣味ブログ(Lightning を使用)をそろそろ X-T9 にしてみたいなーと思っていたので「これを使えばいいのでは?」とひらめきました💡

とはいえ、VK FullSite Installer は新規サイト専用のため、既存サイトの内容を残したまま切り替えることはできません。

そこで、「既存サイトの移行方法について」を参考にしてやってみることに。

何でもそうですが、実際に手を動かして自分で確かめてみることって大事と思うんですよね。

わたしの趣味ブログは、カスタマイズはCSS を少し追記した程度で記事も多くなく、移行を試すにはちょうどいいサイトなんです。

Lightning は今も現役バリバリ!とても多くの方に利用されているテーマですが、ブロックテーマを知るには、実際運用しているサイトで使ってみるのが手っ取り早い!と思い….

というわけでやってみた

移行した趣味ブログはこちら!今後も編集していく予定です。現時点のキャプチャーを載せておきますね。

移行前
移行後

準備

先に紹介した「既存サイトの移行方法について」にも書かれていますが、以下に注意して作業しました。

既存サイトの移行のポイント・注意

  • 移行作業は自己責任!
  • 現状のバックアップを必ず取得し、ローカルに保存する(いつでもすぐに戻せるようにするため)
  • ステージング(開発)環境を用意する

本番環境

  • Lightning、VK Blocks Pro を使用
  • 問い合わせフォームに Contact Form 7 を使用

まず、自由に作業・検証できる環境が必要ですよね。わたしの場合は、本番と同じレンタルサーバー上の異なる独自ドメインにステージング環境を用意しました。また、本番とステージング環境はあらかじめPHPのバージョンを揃えておきました。

本番環境

  1. プラグイン、テーマ、WordPress を最新に
  2. WPvivid で現状をバックアップ、データをダウンロード

ステージング環境

  1. WordPress を新規インストール
  2. VK FullSite Installer をインストール
  3. 「観光ブログ」をインポート
  4. インポート後、各プラグイン、X-T9 を最新に

VK FullSite Installer でインポートしたデモサイトは、設定 > 表示 > 検索エンジンでの表示の「検索エンジンがサイトをインデックスしないようにする」にチェックが入った状態になっています。

ExUnit の機能でダッシュボード上部にアラートが表示されるので、わかりやすいと思います。

スタッフの松田さんの記事でも、この ExUnit の便利な機能を紹介しています。

また、サイト全体にBasic認証をかけて作業していきました。

コンテンツをインポート

本番からコンテンツをエクスポートして、ステージング環境にインポートしました。

  1. [ 本番 ] ツール > エクスポート から「すべてのコンテンツ」をエクスポート
  2. [ ステージング ] ツール > インポート > WordPress のインポート(添付ファイルのインポートも)

インポートの画面に「Content Options」という項目が追加されてました。

Change all imported URLs that currently link to the previous site so that they now link to this site

【参考】Make WordPress Core: WordPress Importer can now migrate URLs in your content

チェックを入れると、元のサイトの絶対 URL を新しいサイトの絶対 URL に置き換えるみたいです。インポート後、絶対URLで入力した内部リンクのボタンなどを見ると、ステージングのドメインにちゃんと置き換わっていました。

ステージング環境でサイトを編集

コンテンツのインポートが完了すると、観光ブログの中に自身の記事が入っている状態になります。

本番にサイトをまるごと移行してもOKの状態になるまで、ステージング環境で編集していきました。

設定

本番環境と同じ設定になるように設定しました。

  • 設定 > 一般:サイトのタイトルとキャッチフレーズ
  • 設定 > 表示設定:「投稿ページ」を本番環境の固定ページに変更
  • 設定 > パーマリンク:パーマリンクを本番環境と同じ設定に変更
表示設定

必要なプラグインを追加

「観光ブログ」には VK blocks Pro と Contact Form 7 が入っていないため、追加しました。

  • VK blocks Pro をインストール・有効化
  • Contact Form 7 をインストール・有効化

コンテンツのエクスポートの際に「すべてのコンテンツ」を選んだので、Contact Form 7 のデータも含まれています。なので、インポート後はプラグインを追加するだけでOKでした。

このあと、デモサイト内にある「このサイトについて」も参考にしながら、サイトを編集していきました。

このサイトについて | 辺久町だより

インポート専用プラグイン VK FullSite Installer(ブイケー フルサイト インストーラー )のためのデモサイトです。VK FullSite Installer を使うことで、当サイトと同じ構成・設定の WordPress サイトを、わずか数ステップで再現することができます。…

目に付くところを中心に、編集したところをピックアップして紹介します!

サイトアイコン

サイトアイコンは、設定 > 一般 から変更できます。

「サイトを編集」をクリック

このあとの作業は、フロントページのテンプレート編集画面から行えばやりやすかったです。トップページを開いた状態で「サイトを編集」をクリックすると、フロントページのテンプレート編集画面に入れます。

ヘッダーのサイトロゴ

サイトロゴの画像をクリックすると変更でき、幅の調整もできます。

ヘッダーメニュー

ナビゲーションの「クラシックメニューをインポート」から本番で使用しているメニュー名を選ぶと、ナビゲーションを切り替えられます。

ヘッダーナビはPCとモバイルの2つ設置されているので、モバイルナビのメニューも「クラシックメニューをインポート」で切り替えをお忘れなく。

フッター

フッター上部の木のイラストはVK Blocks のアイコンブロックでできています!だから、他のお好みのアイコンに変更できるんですよ。

今回は、シンプルなフッターにしたくて、設定サイドバーの「デザイン」から別のデザインに切り替えてみました。

トップのスライダー

トップページは固定ページの編集から作業しました。

スライダーは、VK Blocks のスライダーブロックで作られています。スライダーアイテムの数を減らしたいときはブロックを削除するだけ。リンクの設定は各スライダーアイテムから変更できました。

デフォルトサムネイル・OGP

デフォルトサムネイルとOGP画像をそれぞれ変更しました。

  • ExUnit > メイン設定 > SNS > デフォルトのOGPイメージ
  • ExUnit > メイン設定 > デフォルトサムネイル画像
ExUnit:デフォルトサムネイル画像

各ページの調整

各記事の表示は、X-T9 にテーマを変更してもほぼ問題なかったです🙌 使用しているブロックが WordPress コアと VK Blocsk / VK Blocsk Pro くらいだからですね。

一部、余白の調整が必要ですが、移行してから追い追いやることに。CSSで少し追加していた装飾なども含めて、この機会にいろいろ見直そうと思いました。

その他

不要なプラグイン、サンプルの投稿記事や画像、カテゴリー、固定ページなどを削除しました。

追加でコンテンツをインポート

移行まで一気に作業できればよいのですが、休日や夜に作業すると一時中断の繰り返し…そのあいだに、本番で新規記事を投稿したい!ってなることありますよね。

記事を追加したのがちょうど月が変わったタイミングだったので、本番で対象月の投稿のみに絞ってエクスポートし、ステージング環境にインポートしてみました。もちろん、手動でコピペでコンテンツを移してもよいと思います。

サイトをまるごと本番に移行してもひとまずOKの状態になったので、移行へ。

ステージング環境のデータを本番環境に移行

WPvivid を使って本番環境に移行しました。

  1. [ ステージング ] WPvivid をインストール・有効化
  2. [ ステージング ] 現状をバックアップ、ダウンロード
  3. [ 本番 ] WPvivid にステージングのバックアップデータをアップロード
  4. [ 本番 ] WPvivid で復元
  5. [ 本番 ]「検索エンジンがサイトをインデックスしないようにする」のチェックを外す
  6. [ 本番 ] 各ページを確認
  7. [ 本番 ] 問い合わせフォームの動作確認
  8. [ 本番 ] 不要になったプラグインを削除
  9. [ 本番 ] 記事内の余白や色の一部調整など(これはまだ)

ほかに見落としているところないか、しばらくは確認していきたいと思います。

感想

というわけで、「観光ブログ」を使って既存サイトを移行してみました。

こまごましたやることはあるけれど、いい勉強になったなーというのが感想です。X-T9 にも切り替えられましたし、気軽に移行を試せる趣味ブログがあってよかったです!

きっとそのうち「ここ変えたいな」とか「ここにアレを表示させたい」など出てくると思うので、これからも楽しみながら触っていきます。

VK FullSite Installer よかったらお試しくださいね。

次はスタッフのトリさんが「パターンのなにか」について書いてくれるそうです!楽しみです🙌

参加特典あり!
ご参加をお待ちしてます

ベクトルスタッフ以外の
ユーザーの皆様の参加大歓迎です!
参加特典もありますのでぜひご参加
お待ちしています!

★参加賞あり★ ブログリレーに参加しませんか? アドベントカレンダー2025のお知らせ

今年もアドベントカレンダーを開催します!「X-T9」「Lightning」「VK Blocks」など、ベクトル製テーマ・プラグインに関することならお気軽に登録してください。

この記事を書いた人

ササキ カオリ
ササキ カオリ
株式会社ベクトルでリモートワークしながら某レンタルサーバー会社にも時々勤務しているパラレルワーカーです。WordCamp Osaka 2019登壇しました。フジロックが好き。
 Vektor Passport

を購入して

特典をゲットしよう!

X-T9 工務店
( ナチュラル )

19,800円 (税込)

0に!

Lightning ビジネス(Evergreen)

9,900円 (税込)

0に!

Lightning 工務店
( ナチュラル )

19,800円 (税込)

0に!

今なら!

Vektor Passport の
有効期間中、上記の
デモサイトデータを
何度でも素早くまるごと
インポートできます!

爆速!!1分デモサイトと同じ
ホームページができる

VK FullSite Installer のロゴ

選んだデモサイトと同じ状態の WordPress サイトを、わずか数ステップで再現できるインポート専用プラグインです。数クリックで、プロ品質のサイトがすぐに起動します。

フルサイト編集に対応したブロックテーマ X-T9

フルサイト編集対応ブロックテーマ

WordPress テーマ X-T9 は、WordPress 5.9 から実装されたフルサイト編集機能に対応した「ブロックテーマ」と呼ばれる新しい形式のテーマです。
ヘッダーやフッターなど、今までのテーマではカスタマイズが難しかったエリアもノーコードで簡単・柔軟にカスタマイズする事ができます。

パターンを使って

よりクオリティの高いサイトに

パターンとは、WordPressのブロックを組み合わせて作ったデザインテンプレートのようなもの。プロのデザイナーが制作したパターンを300以上公開中!コピペしながら高品質なサイトを簡単に作れます。

VK AB Testing は、ABテストを実施するための WordPress 用プラグインです。ブロックエディターでテストパターンを自由に作成でき、ランダム表示とクリック計測が可能です。Webサイトや広告などの施策の改善にぜひご活用ください。


このデモサイトは Vektor,Inc. のテーマとプラグインで構築されています。ご購入や詳細情報は下記のリンクもご参考ください。

PAGE TOP