Webflowは、直感的なビジュアルエディタを使ってプロフェッショナルなサイトを作成できる、使い勝手のいいプラットフォームです。とはいえ、サイトをしばらく運営していると、WordPressのような、柔軟で高度なプラットフォームへの移行を検討し始めるかもしれません。
WebflowからWordPressに移行する場合、特にコンテンツが多いサイトでは、大変な作業に感じられるはずです。しかし、移行作業は意外と簡単で、すぐにWordPressサイトを立ち上げることができます。
この記事では、WebflowからWordPressに移行すべき理由について触れた後、移行方法を順番にご説明していきます。
それでは、早速始めましょう！
WebflowからWordPressへの移行方法について、動画での解説もご用意しています。
WebflowからWordPressへ移行すべき理由
Webflowでは、多くのオールインワンプラットフォームと同様に、サイトの構築を簡単に行うことができます。Webflowは、ウェブサイトビルダーとサーバーの両方の役割を果たすことが大きな特長です。しかし、サイトのあらゆる要素が1つのサービスによって管理されるため、機能を追加したり、コンテンツを最適化する際には、やや制約が出てきます。
WordPressのようなオープンソースのコンテンツ管理システム（CMS）であれば、制限なく自由にサイトを管理することができます。Webflowには豊富なアプリやウィジェットがありますが、WordPressで利用できるプラグインの種類には及びません。
WordPressでは、サーバーと費用が管理でき、サイトに最適なソリューションを選んで使用することができます。さらに、WordPressのソフトウェアそのものは無料で、ほとんどのプラグインも無料で利用できます。WebflowからWordPressに移行することで、サイトの運営費用を節約もできてしまうということです。
WebflowからWordPressに移行する前に考慮すべき点
ブログにしてもECストアにしても、サイトの移管は大変で面倒な作業と思われがちですが、実はそれほど時間はかかりません。適切なツールを利用すれば、自分で移行することも可能です。
とはいえ、その前にやっておくべき作業があります。まずは、WebflowからWordPressへの移行前に必要な準備についてご説明します。
WordPressに特化したサーバーを選ぶ
先ほども触れましたが、WordPressを使用する最大のメリットの1つは、好きなサーバーを選べることです。用途だけでなく、予算に合わせたサーバーを利用することができます。
費用面から、安価なサーバーを選びたくなるかもしれませんが、ここはマネージドWordPress専用サーバーを選ぶことをおすすめします。通常、他のサービスよりも高価な選択肢になりますが、サイトのパフォーマンスを向上させ、高いレベルでのセキュリティを確保することができます。
Kinstaでは、予算に合わせた様々なサーバープランをご用意しています。KinstaのマネージドWordPress専用サーバーには、以下のような機能があります。
- 迅速かつ簡単なWordPressインストール
- 毎日の自動バックアップ
- ハッキング対処とマルウェアの除去
- 24時間年中無休のサポート体制
- 無料で使えるSSL証明書
また、無料のサイト移行サービスもあり、サイト数に限りなくすべてのサーバーからスムーズにサイトを移管できます。さらに、WordPressサイトの設計には、操作性の高い開発ツールDevKinstaの利用が可能です。
移行を開始する前に、利用するサーバーを決定し、すべてのアカウント設定を完了しておくのが理想的です。これで、より効率的にサイトを移行することができます。
データのバックアップ
なお、この移行作業では、WebflowからWordPressにコンテンツを移動するわけではありません。コンテンツのコピーをコンピュータに一度ダウンロードし、それをそのままWordPressにアップロードするという流れになります。つまり、Webflowのサイトはそのまま残るため、コンテンツのバックアップ作成は必須ではありません。
ですが、何か問題が発生した場合に備えて、念のためバックアップを作成しておくことをおすすめします。Webflowでバックアップを保存するには、Macの場合は「Command + Shift + S」、Windowsの場合は「Control + Shift + S」を押すだけでOKです。
作成したバックアップには、メモを残すことができます。入力を終えたら「Save（保存）」をクリックしましょう。その後、「Settings（設定）」＞「Backups（バックアップ）」から、作成したバックアップを確認できます。
WebflowからWordPressへの移行方法（6ステップ）
サーバーでアカウントの設定とデータのバックアップが完了したら、早速WebflowからWordPressへの移行に取りかかりましょう。この章では、WordPressサイトの立ち上げまで、すべてのステップを順にご説明していきます。
ステップ1. WordPressのセットアップ
最初のステップは、WordPressのセットアップです。ほとんどのサーバーには、ワンクリックでWordPressをインストールできる機能が搭載されており、セットアップのマニュアルも用意されているため、ほんの数分でセットアップを完了することができます。
または、WordPress.orgからダウンロードすることも可能です。
その場合は、WordPressのファイルをサーバーにアップロードすることになりますが、これも数分で完了します。次は、Webflowからコンテンツをエクスポートします。
ステップ2. Webflowのコンテンツをエクスポート
WordPressのセットアップが完了したら、WordPressサイト用のコンテンツを準備します。Webflowでは、データのエクスポートが非常に簡単に行えます。
ただし、すべてのコンテンツをエクスポートできるわけでなく、ウェブページ、ブログ記事、テキスト、埋め込みブロック、ギャラリーページ、画像などに限られます。
コンテンツをエクスポートするには、Webflowデザイナーツールにアクセスし、「CMS Collections」パネルをクリックします。このパネルは、Webflow独自のデータベースのようなもので、サーバー上の全ファイルとデータを確認することができます。
ダウンロードしたいデータ（ブログ記事など）を選択し、画面上部にある「Export（エクスポート）」ボタンをクリックします。コンテンツは、CSVファイルでコンピュータに保存されます。この手順で、移行したいデータをすべてエクスポートします。
ステップ3. コンテンツをWordPressにインポート
次に、エクスポートしたWebflowのコンテンツをWordPressにアップロードします。CMSには、XML形式のファイルをアップロードするインポート機能がありますが、WebflowではCSV形式のファイルしかダウンロードすることができません。
CSVファイルをWordPressにインポートするには、移行プラグインを使用します。おすすめは、WP All Importです。
プラグインを追加するには、WordPressの管理画面から「プラグイン」＞「新規追加」と進み、検索バーからこのプラグインを検索します。
プラグインを見つけたら、「今すぐインストール」、その次に「有効化」をクリックします。プラグインが有効化されたら、「All Import（すべてインポート）」＞「New Import（新規インポート）」に進みましょう。
「Upload a file（ファイルをアップロード）」をクリックし、先ほどダウンロードしたCSVファイルを選択すると、インポートが開始されます。
それでは、Webflowのブログ記事をインポートしてみましょう。
次に、「Drag & Drop（ドラッグ＆ドロップ）」画面で、各要素をそれぞれ表示させたい箇所にドラッグします。
例えば、タイトル欄には投稿名（name）、本文部分には投稿本文（postbody）というように、画面右側に表示されるセクションから左側の各フィールドにドラッグします。カテゴリやタグなどの要素の追加や、投稿ステータスなどの設定も可能です。
この設定は、ファイル内のすべての投稿に適用されるため、インポートした投稿すべてにそれぞれ設定を行う必要はありません。
それから、ファイル内の投稿に独自のIDを指定します。「Auto-detect（自動探知）」ボタンをクリックすると、IDを生成することができます。
最後に「Confirm & Run Import（インポートの確認と実行）」ボタンをクリックして完了です。
インポートが完了すると、画面に通知が表示されます。
インポートしたコンテンツは、WordPress管理画面の「投稿」または「ページ」で確認できます。他にもインポートが必要なファイルがあれば、この手順を繰り返します。
なお、WordPressは、Webflowなどの他のプラットフォームからの画像の自動インポートはサポートしていません。そのため、画像をインポートするには、手動で行うか、Auto Upload Imagesのようなプラグインを使用します。
Auto Upload Imagesこのプラグインは、投稿やページ内の画像URLを検出して画像をダウンロードし、URLを変更してWordPressにアップロードしてくれます。
ステップ4. WordPressテーマを選ぶ
残念ながら、WebflowのサイトデザインをWordPressに移行することはできません。ですが、人気CMSであるWordPressでは、何千種類もの魅力的なテーマの中からデザインを選ぶことができます。
また、WordPressテーマは、自由にデザインを編集することも可能です。ほとんどのテーマは無料で使用でき、有料テーマも手頃な価格で購入できます。
WordPressテーマを編集したり、さまざまな機能を試してみてください。ただし、あらゆるデバイスで適切にサイトが表示されるよう、レスポンシブデザインのテーマを選びましょう。
ステップ5. WordPressパーマリンクの設定
次に、WordPressパーマリンクの設定に移りましょう。パーマリンクは、URLの構造を決めるものです。
パーマリンクの設定は、WordPressの管理画面から「設定」＞「パーマリンク設定」に進みます。
ご覧の通り、いくつかの選択肢がありますが、「投稿名」構造がおすすめです。この構造を選ぶと、URLは各固定ページや投稿に設定したスラッグとドメイン名で構成されます。短く洗練されたURLは、検索エンジン最適化（SEO）に効果的です。
設定が完了したら、「変更を保存」をクリックして、最後のステップに進みましょう。
ステップ6. WordPressにドメインを指定
WordPressにサイトのコンテンツをインポートした後も、ドメイン（例: mysite.com）はWebflowのネームサーバーに紐づいたままになっています。同じドメインを引き続き使用する場合は、DNS設定で、ドメインの指定先をWordPress用サーバーに変更しましょう。
ネームサーバーは、サーバーのアカウントから確認できます。通常、以下のような文字列です。
- yourwebhost.com
- yourwebhost.com
- yourwebhost.com
Webflowサイトの作成時に、ドメインレジストラを使用した場合は、アカウントにログインしてDNSの設定を行います。または、WordPress用サーバーの管理画面からドメインの管理ができる場合もあります。Kinstaを利用している場合は、MyKinstaでドメインを再指定することができます。
これで、ユーザーがGoogleにURLを入力すると、移行先のWordPressサイトにアクセスできるようになります。WordPressサイトを公開する前に、必ずこの設定を行いましょう。
まとめ
Webflowは、サイトの立ち上げと管理が簡単なオールインワンのウェブサイトビルダーです。しかし、サイトの規模が大きくなるにつれ、WordPressのように、柔軟で強力なプラットフォームが必要になるかもしれません。
今回ご紹介したように、WebflowからWordPressへの移行は比較的簡単です。ただし、WordPress用に適切なサーバーを選ぶことが重要です。また、レスポンシブデザインのWordPressテーマの選択、パーマリンクの最適化、そしてユーザーがアクセスできるよう、ドメイン設定の変更もお忘れなく。
WebflowからWordPressへの移行方法についてご不明点はございますか？以下のコメント欄でお聞かせください！
Head of Content at Kinsta and Content Marketing Consultant for WordPress plugin developers. Connect with Matteo on Twitter.
