LogoCloneWebsite ドキュメント
LogoCloneWebsite ドキュメント
ホームページ

Getting Started

ようこそクイックスタート

Usage Guide

Chrome 拡張機能ガイドウェブページを Figma に書き出すウェブサイトのプロジェクト機能は廃止されました完璧なクローンのためのベストプラクティス

Developer

API リファレンス

Other

よくある質問 (FAQ)変更履歴テクニカルサポート

クイックスタート

3分以内に CloneWebsite を使い始める

最初のウェブページのクローンを始める

CloneWebsite は最もシンプルなウェブページキャプチャ体験を提供します。すぐに使い始めるための手順は以下のとおりです。

1. Chrome 拡張機能をインストール

最もおすすめの使用方法は Chrome 拡張機能経由です。多くの CORS やクロスオリジンの制限を回避できます。

  1. 最新の拡張機能インストールパッケージをダウンロード ここからダウンロード
  2. ダウンロードした .zip ファイルを解凍します
  3. Chrome ブラウザで chrome://extensions/ を開きます
  4. 右上の デベロッパーモード をオンにします
  5. パッケージ化されていない拡張機能を読み込む をクリックし、先ほど解凍したディレクトリを選択します

2. ウェブページをクローンする

拡張機能のインストールが完了したら:

  1. Chrome でクローンしたいウェブページを開きます(例:https://example.com)
  2. ウェブページが完全に読み込まれるまで待ちます(特に画像や動的コンテンツ)
  3. ブラウザのツールバーにある CloneWebsite アイコン 🧩 をクリックします
  4. ポップアップパネルで クローン開始 ボタンをクリックします
  5. プログレスバーが完了するまで待ちます(ページのサイズにより数秒から数分かかる場合があります)

3. 結果を確認する

クローンが完了したら:

  1. ブラウザがドメイン名を含む .zip ファイルを自動的にダウンロードします(例:example-com-clone.zip)
  2. このファイルを解凍します
  3. 次のディレクトリ構造が表示されます:
📁 example-com-clone/
 ├── 📄 index.html        # すべてのインラインスタイルを含む完全なページ
 └── 📁 assets/           # 抽出されたすべての外部リソース
      ├── 🖼️ images/
      ├── 📝 fonts/
      └── 📜 css/
  1. index.html をダブルクリックすると、ページがブラウザで完璧に再現されます。しかも完全にオフラインです!

高度な機能

ローカルプロジェクト

キャプチャをブラウザ拡張機能に保存し、軽量なローカル Workbench で開きます。

クローンオプション

最良の結果を得るために、フィルタルール、画像抽出、DOM クリーンアップの設定方法を学びましょう。

ようこそ

CloneWebsite ピクセルパーフェクトなウェブページクローナー

Chrome 拡張機能ガイド

CloneWebsite Chrome 拡張機能を使ってウェブページをキャプチャする方法

目次

最初のウェブページのクローンを始める
1. Chrome 拡張機能をインストール
2. ウェブページをクローンする
3. 結果を確認する
高度な機能