フォントサイズが大きすぎる！
はじめ見たときビックリしました。
タイトル（h1タグ）並みだったので！笑
これはマズいと思い、カスタマイズすることに。
しかし、なかなか上手くいかない…
フォントにCSSが効かない。
「!important」を付けると優先されるはずが、それでもダメでしたね…笑
では、
- なぜ上手くいかないのか？
- どうすれば変更することができるのか？
ご紹介いたします！
2022年時点で予期していた円安対策にも！
フォントにCSSが効かない理由
まず、「ツイート埋め込み」のフォントにCSSが効かない理由は…
１つの画像や動画のように、読み込まれているからです。
たとえばYouTube動画を見ていて、
文字ちっさ！
と思っても、作ったのは そのYouTuberです。
こちらが変更することなんて、決してできません。
そりゃ～、変えられないわけだ！笑
【結論】全体的にサイズダウンさせる
では、どうすればいいのか？
画面サイズを変えればいい話ですよね。
- 画像や動画の文字が小さいのであれば、画面を拡大。
- 大きいのであれば、スマホなどで見る。
こうすることで調節できます。
そしてブログには、こんな便利な機能が！
- 画面サイズに応じて、自動で表示サイズを変更してくれるんですよね。
CSSで「％」を用いれば！
ということで結論。
「ツイート埋め込み」のフォントサイズは変更できないので、全体的に小さくする！
です。
意外と盲点で、まったく思いつきませんでした…笑
レイアウト方法（コピペOK！）
では、その全体サイズの変更方法ですが…
以下のCSSをぜひ、そのままコピペしちゃってください！
.wp-block-embed__wrapper {
margin: 30px auto 35px auto; /* 位置調整 上 右 下 左 */
width: 93%; /* 全体サイズの調整 */
}
この中にある「width」がサイズ調整をしてくれるものになります。
数値は、どれも変更していただいて構いませんよ！
WordPressテーマ「STORK19」に対応。その他のテーマでは効かない恐れがあります。今後 追加いたします！
この情報を載せているのは唯一かも？
以上、この記事の内容を３行でまとめると、
- 「ツイート埋め込み」のフォントには、CSSが効かない。
- 全体サイズを変更すればいい。
- コピペOKのレイアウト方法をご紹介！
でしたが、いかがだったでしょうか？
実際に、以下のようになります。
ちゃんとイイ感じの大きさになっていますよね？笑
かなり検索しましたが、解決方法を載せている記事とは出会えませんでした。
なので、なんとか思いついて良かった…
この記事の情報が、あなたの お役に立ちましたら嬉しいです！
最後まで お読みいただき、ありがとうございました！
つぎに繋がる記事はコチラ！
フリーランスの強い味方！
「ツイート埋め込み」機能って便利だけど…