動画の追加 - Framer ヘルプ

Last updated on 10/16/2025@mrbirddev
動画の追加 - Framer ヘルプ

動画の追加

動画を追加することで、ウェブサイトを強化できます。ローカルファイルをアップロードするか、YouTubeやVimeoなどのプラットフォームからコンテンツを埋め込むことができます。

サイトに動画を追加するには、挿入ボタンをクリックしてメディアセクションに移動します。次に、動画コンポーネントをキャンバスにドラッグ&ドロップします。ネイティブ動画コンポーネント、YouTube、Vimeoの3つのオプションから選択できます。

ポスター画像を設定して、動画のサムネイルとして使用します。この画像はGoogleや他の検索エンジンによって検索結果やスニペットでプレビューとして表示されます。ポスターは少なくとも60 x 30ピクセルであるべきです。Framerは動画の読み込みを最適化しますが、動画コンテンツ自体は最適化しません。

「挿入」メニューの「メディア」パネルのスクリーンショット。さまざまな画像と動画コンポーネントが表示されています。

YouTubeまたはVimeoからの埋め込み

YouTubeまたはVimeoから動画を埋め込むには、対応するコンポーネントに動画のURLを入力するだけです。動画はキャンバスに直接埋め込まれます。

ローカル動画やホストされたMP4の場合は、ビデオコンポーネントを使用します。以下のプロパティをカスタマイズできます:

  • 自動再生
  • ポスター画像
  • ボーダー半径
  • ループ
  • サイズ調整

Framer内のYouTubeコンポーネントのさまざまなオプションを示す右メニューのスクリーンショット。

自動再生動画

ChromeやSafariなどの最新ブラウザでは、自動再生動画はデフォルトでミュートされている必要があります。動画に音声がある場合は、ユーザーの操作(ボタンをクリックするなど)後に再生を開始するのが最適です。また、動画が表示されたときに再生する方法に関するガイドもご覧ください。

ビデオのアクセシビリティ

音声トラックのないビデオには、ビデオの内容を要約するテキスト説明をビデオの下に含めてください。こちらの例を参照

Framerヘルプに戻る

Last updated on 10/16/2025@mrbirddev
Recent Articles
Loading...