TCDテーマSTORY：常にトップページのスライダーを16:9で表示させる方法

Q.質問内容

スマホ表示の場合、スライダーで設定した画像が高さ100%で表示されてしまい、切り取られて表示されます。
PC,スマホ問わず、常に一定比率で表示させたいです。

▼変更後イメージ

A.TCDテーマオプションの基本設定＞カスタムCSSに以下を追記してください。

下記のCSSを追記することで全画面表示を解消して、常にトップページのスライダーを16:9で表示させることができます。

.top-slider {
    aspect-ratio: 16 / 9;
    height: auto!important;
}

※16：9の値を変更することで、表示されている画像の比率を変更することができます。

スマホでのみヘッダー円形ボタンを非表示にする場合は、下記CSSも併せて追記してください。

@media only screen and (max-width: 991px) {
    .top-slider-content {
        display: none;
    }
}

2024.02.06

TCDテーマNANO：スマホでトップページのヘッダーコンテンツ画像・動画を切り取られずに表示する方法

Q.スマホ表示の場合、設定した画像または動画が全画面表示になってしまい、切り取られて表示されます。 ▼左：画像（1740×840ピクセル）　右：動画（640×360ピクセル）の例 A.下記のCSSを追加することで全画面表示を解消して全体が表示できます。 スマホとPCでは縦横比が...