お寺や神社、小料理屋など、日本の美意識を表現できるWordPressテーマ「ZEN」
ワードプレステーマ別

TCDテーマFORCE:ヘッダー動画の表示比率をPCとスマホで揃える方法

WordPressテーマ「NULL」

TCD LABOはWordPressテーマ「NULL」を使用して作られています。

ダウンロード

Q.トップページのヘッダーに動画を設置しましたが、スマホでは左右が見切れてしまいます。

テーマの仕様より、PCでは横幅100%、スマホでは高さ100%で表示される設計です。PC・スマホで同じ比率で表示する場合は、CSSで調整してください。

▼変更前イメージ

A.TCDテーマオプション>基本設定>カスタムCSSに以下を記述することで、16:9の比率で表示が可能です。

#index_slider,#index_video,#index_video_wrap {
    aspect-ratio: 16 / 9;
    height: auto!important;
}

▼変更後イメージ

この記事は役に立ちましたか?

もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!

同じテーマのカスタマイズ記事