WordPressテーマSANGOの質問

[youtube]タグで囲まれた動画の最大幅を小さくしたい

アバター
なかえ

[youtube]
動画URL
[/youtube]
で囲ったタグについて、CSSにカスタマイズを行いたいです。具体的には
・marginを取り、横幅いっぱいになっている動画に余白を作る

※スマホで見る場合には、余白はいらないため、その点も考慮したCSSをご提示いただけますと幸いです。

ツイートや動画を埋め込む
記事にツイートやInstagram、YouTube動画を埋め込む
コメントへの回答
サルワカくん
サルワカくん
2020/07/04

「marginを取り、横幅いっぱいになっている動画に余白を作る」
marginも余白だと思うのですが、どういうことでしょうか? PCで見たときに動画の最大幅を指定したいということですかね。

その場合、以下のようなCSSをダッシュボードの[外観]⇒[カスタマイズ]⇒[追加CSS] もしくは子テーマのstyle.cssに貼り付ければ良いと思います。

/* 520px以上のスクリーンでは、動画を高さ500px・幅300pxに固定する */
@media only screen and (min-width: 600px) {
  .youtube {
    max-width: 500px;
    padding-top: 300px;
    margin: 1.5em auto; /* 動画を中央寄せ */
  }
}

よろしくお願いします。

アバター
なかえ
2020/07/06

「[youtube]タグで囲まれた動画のカスタマイズ」について、ご返信いただきありがとうございます。

ご提示いただいた方法にて、無事に解決いたしました。
お忙しい中ご対応いただき、誠にありがとうございました。