YouTubeをファーストビューで自動再生する
ファーストビューにYouTubeが横幅いっぱいで表示されるようにするサンプルです。
内容としては
- CSSでタイトルセクションを非表示にし、コンテンツと上部の隙間をなくします。
- YouTubeをhtml挿入機能を使って貼り付けます。
- CSSでYouTubeの横幅が最大になるように設定します。
の手順になります。
※スマホで自動再生されない端末がある点、デフォルトでミュートになっている点に注意してください。
2. YouTubeをhtml挿入機能を使って貼り付け
- YouTubeを開いて、共有→「埋め込み」を選択して<iframe>から始まる文字列をコピーしてください。
- その後ページにしたいNotionページで、コンテンツの一番上に /code でコード埋め込みを選択し、1のコードを貼り付けてください。詳しい手順はこちら。
- その際に をYouTubeで発行したURLの末尾に付与します。