対応マニュアル:公開版 第1版(Ver.1.0.0)
まず「動画を保管する場所」「公開URLを配る窓口」「作品の中へ動画を置く操作」を分けて考えると、設定の順番が分かりやすくなります。このページではBunny側の配信準備を行い、最後に公開URLをAdToonのEditorへ設定します。
- Storage Zone:動画ファイルを保管する場所です。
- Pull Zone:保管した動画を公開URLから配信する窓口です。
- Editor:公開URLの動画を作品へ配置し、再生を確認する画面です。
AdToonの作品に動画を入れるとき、MP4ファイルをどこに置けばよいか迷いませんか。この記事では、Bunny.netに動画と表紙画像を置き、公開URLをAdToonに設定するまでを、実際の画面を見ながら説明します。
CDN(コンテンツ配信ネットワーク)は、画像や動画を閲覧者へ届けるための配信網です。ファイルを1か所に置いて終わりにするのではなく、各地の配信拠点を利用して届けます。遠方からのアクセスや多くの人が見る場面でも、表示を安定させやすくする仕組みです。
最初に知っておくこと:保管場所と配信窓口
Bunny.netでは、Storage Zone(ストレージゾーン)が動画を保管する「倉庫」、Pull Zone(プルゾーン)が公開URLを持つ「配信窓口」です。倉庫を作る → 配信窓口をつなぐ → ファイルを置く → 公開URLをAdToonに入れる、と考えると分かりやすいでしょう。ストレージゾーンだけでは、AdToonに入力する公開URLは完成しません。
全体の流れ:動画・表紙画像を用意 → ストレージゾーンを作成 → プルゾーンを接続 → アップロード → 公開URLを確認 → AdToon Editorで配置 → プレビューで再生確認。AdToonは動画ファイルそのものを保存せず、閲覧者のブラウザが設定した公開URLから読み込みます。Bunny.netのパスワードや管理用のキーをAdToonに渡す必要はありません。
準備するもの
- Bunny.netのアカウント
- 公開する権利を確認した動画。迷ったらH.264形式のMP4を用意します
- 動画の再生前に表示するポスター画像(JPEGまたはPNG)。任意ですが、読み込み中の見た目が整います
- AdToonのEditorで編集できる作品
以下では例として、動画をintro-v1.mp4、ポスター画像をintro-poster-v1.jpgとします。これは説明用の名前です。実際のファイル名に置き換えてください。
1. ストレージゾーンを作る
- Bunny.netの管理画面で「+ Add」を開き、保管場所を作る項目を選びます。画面内ではストレージゾーンの英語名で表示されています。
- 他の利用者と重ならない名前を付け、保存地域を選びます。日本向けなら、日本または近隣地域を候補にし、画面に出る選択肢と料金を確認してください。
- 複数地域への複製は必要に応じて選びます。保存地域を増やすと、その分の保存料金が発生し得ます。
- 作成後、ファイルマネージャーが開けることを確認します。

ストレージゾーンの名前は管理用です。この段階で管理画面のアドレス欄に見えるURLは、動画の公開URLではありません。公式の保管場所の作成手順も参照できます。
2. プルゾーンをつなぐ
ストレージゾーンの作成中にプルゾーンを同時に作れる画面なら、その案内に進みます。後から作る場合は、「+ Add」から配信窓口を追加します。配信元には、先ほど作ったストレージゾーンを選んでください。

プルゾーンには通常、https://あなたのプルゾーン名.b-cdn.net/のような標準の配信ドメインが付きます。独自ドメインは後から設定できます。まずは標準ドメインで確かめましょう。

3. 動画とポスター画像をアップロードする
- ストレージゾーンのファイルマネージャーを開きます。
- 作品や更新版が分かるフォルダーを作ります。例:
lp-v1/。 - そのフォルダーへ
intro-v1.mp4とintro-poster-v1.jpgをアップロードします。 - 一覧に両方のファイルが表示され、アップロードが完了していることを確かめます。



公開後に動画を差し替える場合は、同じURLのファイルを上書きせず、intro-v2.mp4のような新しい名前またはフォルダーを使います。配信拠点に古いデータが残ったり、公開済み作品の内容が意図せず変わったりする問題を避けやすくなります。
4. 公開URLを確認する
公開URLは「プルゾーンの配信ドメイン + ストレージゾーン内のフォルダーとファイル名」です。たとえばプルゾーン名がsample-videoなら、次の形になります。
動画 https://sample-video.b-cdn.net/lp-v1/intro-v1.mp4
画像 https://sample-video.b-cdn.net/lp-v1/intro-poster-v1.jpg
上のURLは説明用で、実在のファイルではありません。自分のプルゾーン名とファイル名に置き換え、ログインしていないブラウザでも動画と画像を直接開けるか確認します。ストレージゾーンの管理画面URLや、storage.bunnycdn.comで始まる管理用URLはAdToonへ入力しません。
5. AdToon Editorへ動画を配置する
- 作品のEditorで「画像・動画・地図」→「動画」を開きます。
- 「動画ファイルのURL」を選び、配信元を「Bunny CDN」にします。
- 4で確認したMP4の公開URLを入力します。ポスター画像を使う場合は、その公開URLも入力します。
- 必要に応じて自動再生・消音・繰り返し・操作ボタンを設定します。自動再生を使う場合は、ブラウザの制限に備えて消音開始にします。
- 「動画を配置」を1回押します。動画URLの確認に成功すると、そのまま配置されます。位置と大きさを調整し、配置後の設定変更は青い「変更を反映」を押して確定します。「配置した動画を再生して確認」または「ページ再生」で実際に再生します。

動画の前後に見出し、説明、申込ボタンなどの別ブロックを置くと、スマートフォンLPの流れに組み込めます。動画配置の基本操作はAdToonの動画配信ヘルプも参照してください。
編集中の動画を再生する
Canvasは移動・拡大縮小・回転の操作を優先します。編集Canvasの中央にAdToon独自の「再生する」ボタンは表示しません。
- 動画を1本だけ確認する場合は、その動画を選んで「配置した動画を再生して確認」を押します。
- 現在のページ全体を確認する場合は、Canvas上部の「ページ再生」を押します。ページ内の動画と効果を一緒に再生します。
- 「ページ再生」の括弧内は、再生対象の要素数です。同じ要素に動画と効果が付いていても1件と数えます。
- 「再生停止」、ページ移動、確認終了で動画も停止します。確認のために再生しても、保存した自動再生・消音などの設定は変わりません。
YouTube・Vimeo・TikTokは消音で確認します。Instagramはサービス側の再生操作が必要です。公開Viewerでは、動画プレイヤー本来の再生操作が表示される場合があります。
動画をコマの形で切り抜く
動画を大きく置いたまま、コマの外へはみ出した部分を隠せます。動画ファイル自体を加工する操作ではありません。
- 「コマ割り」で、動画を表示するコマを作ります。
- Canvasまたは「レイヤー」で配置済みの動画を選び、「画像・動画・地図」の動画設定を開きます。
- 「コマで切り抜く」をオンにします。
- 「切り抜くコマ」で表示先を選びます。「自動(動画の中心が入るコマ)」は、中心を含むコマを選びます。分割コマがあるときは、中心を含む小さいコマが優先されます。意図と違う場合はコマを指定してください。
- 青い「変更を反映」を1回押します。動画ファイルのURLは、この操作で確認してから反映されます。確認エラーが出た場合はURLや配信元を直してください。
- Canvasで切り抜き位置を確認し、「配置した動画を再生して確認」または「ページ再生」で再生します。
- 保存済み表示を確認してManagerへ渡し、受け取った版の「公開時の表示を見る」で再確認します。
斜めのコマや分割線にも沿って切り抜けます。「罫線を表示」をオフにしても、切り抜きは残ります。動画を移動すると、自動選択の表示先が変わることがあります。表示先を固定したい場合はコマを指定します。
最初は「コマで切り抜く」がオフです。従来の動画も、自分でオンにするまでは切り抜かれません。選んだコマを削除した場合や、別ページへ動画を移動した場合は、同じページのコマを選び直すか、切り抜きをオフにしてください。対象が見つからないと動画が見えなくなり、受け渡し時に確認を求められることがあります。
対象はMP4・WebMの公開URLと、YouTube・Vimeo・TikTok・Instagramの動画です。Google Mapにこの設定は使いません。外部サービスの再生操作や埋め込み条件は各サービス側の制限に従います。
修正を配信にも反映する
「変更を反映」はEditor内の動画設定を更新する操作です。現在公開している配信用データまで、このボタンだけで入れ替わるわけではありません。
変更を反映 → 保存済みを確認 → Managerへ渡す → 受取版の表示を確認 → 更新用の配信用データを準備 → 公開版を更新、の順に進めてください。公開中の作品はManagerの更新手順に従い、現在の公開版と更新版を確認してから切り替えます。
ボタンは動画設定の下部にあります。既存動画では「変更を反映」、新規では「動画を配置」と表示されます。ボタンが見つからない場合は、配置済み動画を選択しているか、設定欄の下までスクロールしたかを確認してください。古い画面が開いたままなら、保存済み表示を確認してからEditorを再読み込みします。
6. 公開前に、実際の閲覧画面で確かめる
Editorで保存した後、Managerの公開前プレビューで、動画の開始・停止、ポスター画像、音声、スマートフォンでのサイズを確認します。ChromeだけでなくSafariなど別のブラウザでも試してください。公開済み作品の動画を変更するときも、新しいURLでEditorとManagerの確認をやり直します。
うまくいかないときの確認表
- 404で開けない:プルゾーンが目的のストレージゾーンにつながっているか、フォルダー名・ファイル名・大文字小文字が一致するか確認します。
- 管理画面では見えるのにAdToonで再生できない:管理画面のURLではなく
b-cdn.netの公開URLかを確認します。ログインしていないブラウザで直接開けることも必要です。 - 動画は開けるが再生できない:MP4の動画・音声形式を確認します。書き出し直す場合はH.264のMP4を試します。
- 古い動画が出る:配信拠点の一時保存を考慮し、新しいファイル名とURLに変えます。
- 料金が心配:保管量と配信量は別に確認します。試用期間が終わる前に、利用状況と現在の料金表を見直してください。
料金と公開範囲の注意
Bunny.netは保管量とCDNからの配信量などで課金されます。地域・複製設定・プランによって条件が変わるため、金額は保管料金の公式ページと配信料金の公式ページで最新情報を確認してください。試用期間の条件もBunny.netの画面で確かめましょう。
この手順で作る公開URLは、URLを知る人がアクセスできるファイルです。未公開素材や秘密情報を置かず、出演者・音楽・画像の配信権利を確認してください。ストレージゾーンのパスワードや管理用のキーは、AdToonのURL欄にも記事や共有資料にも書かないでください。
Bunny.netの説明は2026年10月10日時点の画面・仕様を基に記載し、AdToonの動画配置・切り抜き・反映操作は2026年10月14日に更新しました。Bunny.netのメニュー名や料金は変更される場合があります。
AdToon側の制作・保存・Managerへの受け渡し・公開の順番は、総合操作マニュアル 公開版 第1版(Ver.1.0.0)で確認できます。動画をEditorで確認した後も、Managerへ最新版を渡し、公開する版の表示を確かめてください。Editorで保存しただけでは公開中の作品は変わりません。
公開作品で試す
以下はAdToon™ for WordPressで掲載した作品カードです。選ぶと公開Viewerが開きます。施設・料金・申込案内はデモの設定です。

