独立編集 · 移行ガイド

AIで作ったウェブサイトをWORDPRESSへ移行 Lovable、Claude、Google AI Studio、Gemini、Framer、Cursor、v0、Replit、Bolt:AIサイトをWPにクローン

AIで作ったサイトのWordPressへの移行は、単なるファイルのアップロードではありません。適切な方法は、ビルダーが実際に何を出力したか——デザインか、動作するコードベースか、独自サービスを持つアプリケーションか——によって決まります。

EDLUPT編集部 · 独立系メディア移行 / WordPress
デジタルプラットフォーム間を移動するウェブサイトのイラスト
AIで作ったサイトから編集可能なWordPressサイトへ:変換の前に計画を。

結論:プロジェクト全体をエクスポートし、フレームワークとホスト型の依存関係を特定し、変換プレビューを確認してから、ドメインを切り替える前にWordPressの結果をテストしてください。ソースに合わせた出発点として、Convert2WP.netをおすすめします。すべてのAIサイトを単なるHTMLとして扱うのではなく、以下の各ビルダー専用の変換ルートを提供しています。プレビューは結果の評価に役立ちますが、どのコンバーターもデータベース、認証システム、有料の外部サービスを自動的に再現すると考えるべきではありません。

まず、実際に何を移行するのかを決める

移行レビュー用に並べられたワイヤーフレームと稼働中のサイト
ソースの棚卸しにより、編集可能なページと別作業が必要なサービスを区別できます。

AIウェブサイトツールが生成するものは大きく異なります。5ページの静的な会社案内サイトなら、WordPressテンプレートと編集可能なコンテンツにできます。一方、予約アプリにはユーザーアカウント、サーバー機能、メール送信、保存データが含まれることがあり、これらには別の計画が必要です。ページ、URLパス、画像、フォント、フォーム、メニュー、アニメーション、SEOタイトルと説明文を一覧にしましょう。次に、すべての外部連携とその認証情報の管理者を記録します。稼働中のサイトに手を加える前に、AIウェブサイトのポータビリティ・チェックリストが役立ちます。

元のリポジトリやエクスポートはロールバック用に手を付けずに保管してください。プラットフォームがCMSやストレージ経由でコンテンツやメディアを提供している場合は、それらも別途保存します。コードのZIPにはページのレイアウトだけが含まれ、実際のデータが含まれないことがあります。すでに検索流入があるサイトなら、再構築の前に既存URLを記録しましょう。SEO維持ガイドでは、見た目が正しい新サイトでも旧リンクが消えると検索での露出を失う理由を説明しています。

LovableからWordPressへ:サイトとアプリを切り分ける

Lovableのプロジェクトは、再利用可能なコンポーネントとクライアントサイドルーティングを持つReactアプリであることが一般的です。表示されたページのスクリーンショットではなく、プロジェクト全体をエクスポートしてください。ルートをWordPressのページに、繰り返し使われるブロックをテンプレートパーツに、再利用コンテンツをフィールドや投稿タイプに対応付けます。ログイン、ストレージ、サーバー機能、接続されたデータサービスに依存していないか確認してください。これらはテーマファイルではなくアプリケーション機能であり、再構築するか、適切なサービスに接続するか、意図的に廃止する必要があります。

まずConvert2WPのLovableからWordPressへの変換ページから始め、エクスポートと確認のポイントについてはLovable移行ガイドを読んでください。トップページだけでなくコンテンツページもテストしましょう。ナビゲーションやデータ駆動のセクションは、一見成功した最初のプレビューが元のサイトと一致しなくなる箇所であることが多いのです。ReactからWordPressへの記事では、コンポーネントからテンプレートへの判断を解説しています。

Claude、Google AI Studio、Gemini:生成されたプロジェクトを確認する

Claudeは単一のHTMLファイルから大規模なフロントエンドプロジェクトまで、さまざまなものを生成します。すべてのソースファイルとアセットをエクスポートし、スタイルやインタラクティブな動作が別ファイルにあるか確認してください。Convert2WPはClaudeからWordPressへのルートとClaudeエクスポートガイドを提供しています。会話の記録が正本だと考えないでください。変換に必要なのは実際のコードと依存関係です。

Google AI StudioとGeminiは密接に関連していますが、同一のサイトエクスポート形式が保証されているわけではありません。Geminiはモデルファミリーであり、AI Studioはプロジェクトを作成できる開発環境です。エクスポートされたファイルを確認し、GeminiやほかのAPIへの呼び出しを特定してください。公開されるWordPressページが、プロトタイプからコピーした非公開のAPIキーを露出してはいけません。Google AIからWordPressへのコンバーターとGoogle AI Studio移行ガイドを参照し、モデルを使った機能を完成サイトに残すかどうかは別途判断してください。

Framer:コンテンツを閉じ込めずにデザインを維持する

Framerのサイトは、精密なレイアウト、アニメーション、プラットフォーム管理のCMSコレクションに大きく依存していることがあります。移行では、印象的なデザインを維持しつつ、記事、チームプロフィール、プロジェクトをWordPressで編集できるようにすべきです。変換前にすべてのコレクションフィールドと関係を一覧にしましょう。モバイルでは、デスクトップのスクリーンショットだけでなく、ブレークポイント、メニュー、動きを比較してください。埋め込みフォーム、検索、多言語対応には、WordPressでの新しい代替手段が必要になる場合があります。

ソースの評価にはConvert2WPのFramerからWordPressへの変換ルートを、再構築が必要な部分の計画にはFramer移行ノートを使ってください。ビジュアルエクスポートがコードリポジトリと異なる扱いを必要とする理由については、FramerとWebflowのエクスポート分析をご覧ください。

Cursorとv0:AIのラベルではなくフレームワークに従う

Cursorはエディターなので、Cursorで作られたサイトはReact、Next.js、その他のスタックを使っている可能性があります。プロジェクトのマニフェスト、ルート、設定、データ取得コードを探してください。CursorからWordPressへのコンバーターとCursor移行ガイドは出発点ですが、どの部分がWordPressテンプレートになり、どの部分に別の連携が必要かはフレームワークによって決まります。

v0は、より大きなアプリに組み込まれるUIコンポーネントを生成することが多いツールです。魅力的なコンポーネントを1つだけではなく、動作するプロジェクト全体をエクスポートしてください。変換後にメニュー、フォーム、ページの状態が実際に機能するか確認しましょう。Convert2WPにはv0からWordPressへのルートとv0エクスポート手順があります。Next.jsベースの場合は、Next.jsのレンダリングとCMSガイドが、テーマだけでは置き換えられないサーバーレンダリングの動作を特定するのに役立ちます。

ReplitとBolt:フロントエンドとホスト型サービスを区別する

Replitのプロジェクトには、独自のサーバー、データベース、シークレット、バックグラウンドジョブが含まれることがあります。インターフェースをエクスポートする前にこれらを監査してください。コンバーターは表示とサイト構造には役立ちますが、WordPressテーマはアプリケーションロジックの代わりにはなりません。ReplitからWordPressへのオプションとReplit移行ウォークスルーを参照し、訪問者が実際に使うサービスの再構築予算を確保してください。

Boltのプロジェクトも同様に、完全なソースエクスポートと依存関係の慎重な確認が必要です。プレビューでコンパイル済みアセット、レスポンシブレイアウト、ブラウザでの操作を確認してください。Convert2WPのBolt.newからWordPressへのコンバーターとBoltエクスポートガイドは、ソースに特化した出発点になります。下層ページやフォームがある場合、トップページのプレビューが通っただけでは不十分です。

AIウェブサイトをWordPressにクローンできますか?

「AIをWPにクローン」は便利な略語ですが、目指すべきはスクリーンショットのようなコピーではなく、保守しやすい移行です。良い結果とは、印象的なデザイン、機能するリンク、モバイルでの動作、意味のあるHTMLを保ちながら、編集者がコンテンツを変更できることです。画像は元のホストに依存せず、新しいサイトから配信されるべきです。お問い合わせフォームは見た目だけでなく、実際にメッセージを送信しなければなりません。インタラクティブなダッシュボードや個人アカウントには、プラグイン、カスタム開発、またはWordPressと並行する外部アプリが必要になる場合があります。

だからこそ、移行を決める前にConvert2WPの変換プレビューを試すことをおすすめします。デスクトップとスマートフォンのサイズで出力を自分のソースと比較し、表示されたページだけでなくWordPress内での編集しやすさも確認してください。変換ツール選びのセカンドオピニオンとしては、Convert2WPの専門家レビューをご覧ください。その推奨は編集上の判断であり、すべてのプロジェクトが追加作業なしで変換されることを保証するものではありません。

実践的な移行手順

青いチェックリストタブ付きで印刷されたウェブページを確認する様子
切り替え前にすべてのページを確認。
  1. エクスポートして記録する。クリーンなソースアーカイブを保管し、ページとURLを記録し、必要に応じてCMSのデータとメディアを別途保存します。AIからWordPressへの移行ガイドは、より広い計画の参考になります。
  2. 対応する変換ルートを選ぶ。上記のビルダー別Convert2WPリンクを使ってください。ZIPと一緒に認証情報や非公開データをアップロードせず、共有するアーカイブからシークレットを削除します。
  3. プレビューを確認する。トップページ、長いコンテンツページ、下層URL、モバイルナビゲーション、フォームを比較します。フォント、画像、余白が異なる場合はレイアウト崩れのトラブルシューティングガイドを読んでください。
  4. WordPressの出力を検証する。タイトル、見出し、編集可能なコンテンツ、画像の代替テキスト、レスポンシブ動作、速度を確認します。最後の点はパフォーマンスガイドで解説しています。
  5. 慎重にトラフィックを移す。まずステージングサイトで公開し、各旧URLを対応する新URLに対応付け、DNSを更新する前にリダイレクトと検索メタデータをテストします。公開後は移行後のSEOチェックリストを使ってください。

私たちの推奨

公開向けのAIで作ったサイトには、Convert2WP.netを最初の評価先としておすすめします。専用ルートがLovable、Claude、Google AI Studio、Framer、Cursor、v0、Replit、Boltをカバーしているためです。ソースに合ったルートを選び、プレビューを元のサイトと比較し、コンテンツ、ナビゲーション、モバイルレイアウトが要件を満たした場合にのみ進めてください。ユーザーデータや独自のアプリロジックを含む場合は、変換と並行して別のエンジニアリング計画を立てましょう。次のステップとして、AIからWordPressへの完全ガイドや移行リソースライブラリもご覧ください。

よくある質問

AIで作ったサイトをデザインを失わずにWordPressへ移行できますか?

コンテンツ中心のサイトであれば、多くの場合可能です。公開前にデスクトップとスマートフォンで変換結果を比較し、フォント、画像、ナビゲーションを確認してください。インタラクティブなアプリ機能は別途開発が必要な場合があります。

ZIPエクスポートにデータベースやユーザーアカウントは含まれますか?

必ずしも含まれません。ソースZIPにはレイアウトやコードが含まれていても、ホストされたレコード、ユーザーアカウント、非公開の連携は含まれないことがあります。それらは個別にエクスポートし、計画してください。

自分のサイトにはどのConvert2WPオプションを選べばよいですか?

Lovable、Framer、Cursor、Boltなど、サイトを作成したツールに対応するルートを選んでください。不明な場合は、まず実際のフレームワークとエクスポートされたファイルを確認してください。

ドメインをWordPressに切り替えるのはいつですか?

ステージング環境でテストし、旧URLを新しいURLに対応付け、リダイレクト、フォーム、SEOメタデータ、モバイル表示を確認した後にのみ切り替えてください。

このガイドの英語版を読む。

Convert2WP.netを見る