高忠実モード
元の見た目を保持。ページをまるごと移すのに最適。
- 詳細ページ・ランディングページ・複雑なレイアウト向け。
- 元のページに最も近い見た目。
- 欠点：多くの内容が 1 つのブロックに収まるため、項目ごとの編集は弱くなります。
ヘルプ
HTML ページを Elementor 対応コンテンツに
このツールは既存の HTML ページを Elementor に貼り付けられるコンテンツに変換、またはテンプレートファイルとしてダウンロードして取り込めます。すべてブラウザ内で動作します。
クイックスタート
ツールを開き、HTML を入れ、方法を選んで変換をクリック。
- ツールを開くナビの「ツールを開く」を使ってください。
- HTML を追加.html/.htm ファイルをドロップするか、HTML を直接貼り付け。
- 方法を選ぶ見た目を残すなら高忠実、Elementor で編集を続けるならネイティブコンポーネント。
- 変換変換をクリックすると、Elementor 用のコンテンツが生成されます。
- Elementor へ直接貼り付けるか、テンプレートファイルをダウンロードしてライブラリから取り込みます。
ネイティブコンポーネントモード
ページを Elementor の見出し・テキスト・画像・ボタン・コンテナに分解します。
- 取り込み後も内容やスタイルを調整し続ける場合に最適。
- 見出し・テキスト・画像・ボタンを個別に編集しやすくなります。
- 非常に複雑なアニメーションや外部エフェクトは手動調整が必要な場合があります。
ネイティブ設定の選び方
これらのオプションは取り込み後の編集のしやすさに影響します。
| 項目 | 意味 | おすすめ |
|---|---|---|
| 見出しタグ | H1/H2/H3 のレベルを制御します。 | 全ページの場合、自動整理で見出し順の乱れを防ぎます。 |
| 画像 | 原画を保持するか、空の画像枠を作成します。 | 画像を再アップロードするなら、プレースホルダーが便利です。 |
| メディア URL | 不完全・一時的・インラインの画像 URL に対応します。 | 既定の安全オプションは失敗・欠落した画像を減らします。 |
| アイコン | Elementor のアイコンに合わせるか、元の見た目を保持します。 | ソースで Font Awesome クラスを使うと、編集可能なアイコンライブラリのアイコンとして読み込まれます。 |
| カラーとフォント | 元のままにするか、移行先サイトに合わせます。 | 新しいサイトに合わせるなら、移行先サイトに従います。 |
| 骨格のみ | 内容を埋めずに構造と余白を保持します。 | 複雑なページ向け：骨組みを作ってから埋めます。 |
| 高度なマッピング | 各ブロックがどのコンポーネントに変換されるか確認します。 | 各ブロックを自分で決めたい場合に最適。 |
| 構造マップ | ページの横でコンポーネントツリーをプレビューし、カーソルを合わせてハイライトします。 | 特定のブロックだけを書き出したり、不要な部分を除外したりできます。 |
方法 A：貼り付け
現在の Elementor ページへ最も速い方法。
- 「Elementor データをコピー」をクリック。
- Elementor の編集ページを開く。
- 空白部分を右クリックして「他のサイトから貼り付け」を選択。
- 貼り付け後、画像・アイコン・余白・モバイル表示を確認します。
方法 B：テンプレートファイル
保存して、後で Elementor ライブラリから取り込みます。
- 「JSON テンプレートをダウンロード」をクリック。
- Elementor テンプレートライブラリを開く。
- インポートを選び、ダウンロードしたファイルをアップロード。
- ページに挿入し、画像を差し替えて微調整します。
始める前に知っておくこと
ツールは安全な取り込みを目指しますが、HTML と Elementor のページは異なるため、複雑なページは確認が必要な場合があります。
- 安全のため、スクリプト・危険なリンク・外部リソース・フォーム送信はクリーンアップされます。
- 保持されるスタイルは取り込んだコンテンツに限定され、移行先サイトの他の領域に影響しません。
- 不完全・インライン・一時的な画像 URL は、取り込み失敗を防ぐため既定でプレースホルダーになります。
- 取り込めない画像を含むギャラリーやカルーセルは、画像を失わないよう分割されます。
- メニュー・商品・投稿リストは移行先サイトのデータに依存し、通常は Elementor で選び直しが必要です。
- 非常に複雑なページはまず高忠実で。編集を楽にするならネイティブや骨組みのみを試してください。