メインビジュアル(セクション(背景画像 / 動画) 背景画像 / 動画つき)の天地を少し大きくしたい

0
いいねをした人: 居ません
9件の投稿を表示中 - 1 - 9件目 (全9件中)
  • 投稿者
    投稿
  • #85025
    アバター画像星乃 みなみ
    閲覧者
    36

    【お使いの Snow Monkey のバージョン】15.3.1
    【お使いの Snow Monkey Blocks のバージョン】12.0.1
    【お使いの Snow Monkey Editor のバージョン】6.0.0
    【お使いのブラウザ】Chrome
    【当該サイトのURL】http://x04.kglb.net/

    ### 実現したいこと

    トップのメインビジュアルの天地をもう少し高くしたいです

    ### 発生している問題

    CSSで制御できるかとソースをみたら HTMLに高さが記述されていて、おそらくデバイス毎のサイズも同時に記述されていた

    ブロック編集で「高さ」の設定があり、フィットだと狭すぎて(現在フィット)、広めは高すぎる フィット+1/3ぐらいの高さが理想(30〜60px追加ぐらい)

    ### 試したこと

    ソースコードを除くことぐらいしかできませんでした。
    これはセクション(背景画像 / 動画)背景画像 / 動画つき のブロックのカスタマイズになりますか?
    フックとはまた違うような?

    0
    いいねをした人: 居ません
    #85036
    アバター画像星乃 みなみ
    閲覧者
    36

    この記事は読んで試してみました

    結局、フィット=横幅いっぱい天地トリミングなので、モバイル対応を考えるとこれしか仕方ないのでしょうか

    0
    いいねをした人: 居ません
    #85056
    アバター画像星乃 みなみ
    閲覧者
    36

    ぎゃくにその下の特集カルーセルの画像は、天地をつめて16:9にしたいのですが、可能ですか?

    0
    いいねをした人: 居ません
    #85108
    アバター画像キタジマ タカシ
    参加者
    2421

    「広め」に設定すると min-height: 75vh になります。なので「フィット」にした状態で padding-toppadding-bottom を上書きするのが良いのではないでしょうか。

    CSSで制御できるかとソースをみたら HTMLに高さが記述されていて、おそらくデバイス毎のサイズも同時に記述されていた

    これはどこの話ですかね?

    0
    いいねをした人: 居ません
    #85112
    アバター画像星乃 みなみ
    閲覧者
    36
    .smb-section {
    	padding-top:0px;
    	padding-bottom:0px;
    }

    みたいな感じで書けてみましたが、余計天地が詰まってしまいました
    これ、フィットにしてれば幅フィット天地成行でこれが最大なのですかね

    いっそ、広めにしてマージンとったほうがいいですかね

    これはどこの話ですかね?

    ソース長いので全部かけませんが、srcsetで記述されているimgがlg md sm と3ブロック並んで記述されています。

    特集のカルーセルも同じやりかたでいけますでしょうか?

    0
    いいねをした人: 居ません
    #85113
    アバター画像星乃 みなみ
    閲覧者
    36

    あ、paddingを大胆に200pxとかにしたらいけました
    これ、スマホに影響ないようメディアクエリー内ですね

    0
    いいねをした人: 居ません
    #85117
    アバター画像星乃 みなみ
    閲覧者
    36

    特集(カルーセル)はラップしてるクラスにpaddingないから、また違った対応が必要ですかね…
    デザイナー的には16:9にして欲しい感じなんですが(デフォルトでは4:3)

    0
    いいねをした人: 居ません
    #85122
    アバター画像キタジマ タカシ
    参加者
    2421
    .c-entry-summary__figure:before {
        content: "";
        display: block;
        padding-top: 75%;
    }

    という CSS で 4:3 になっているので

    .c-entry-summary__figure:before {
        padding-top: 56.25%;
    }

    で 16:9 になります。クラスはよしなに変えてください。

    0
    いいねをした人: 居ません
    #85126
    アバター画像星乃 みなみ
    閲覧者
    36

    ありがとうございます!
    また疑似要素だったんですね。気がつきませんでした

    CSSでできることは、自分でできるようになりたいです
    努力します!

    いったん閉じますね

    もう1つこないだ質問の件にちかいものがおもいうかんだのでのちほど投稿します。

    1
    いいねをした人:
9件の投稿を表示中 - 1 - 9件目 (全9件中)
  • トピック「メインビジュアル(セクション(背景画像 / 動画) 背景画像 / 動画つき)の天地を少し大きくしたい」には新しい返信をつけることはできません。

ドキュメント

Snow Monkey の設定方法やマニュアルを掲載しています。

ドキュメント

フォーラム

Snow Monkey の使い方やカスタマイズについてのご質問・ご要望等はサポートフォーラムで行っています。サポートフォーラムは誰でも閲覧できますが、書き込みできるのは Snow Monkey 購入者のみとなります。

サポートフォーラム

よくあるご質問

Snow Monkey のサービスについて不明な点がある場合は、まずはよくあるご質問をご確認ください。

よくあるご質問

お問い合わせ

よくあるご質問を見ても解決しなかった場合、試用版の申請については問い合わせフォームからお願いいたします。

お問い合わせ

Snow Monkey は Gutenberg ブロックエディターに対応した 100%GPL の WordPress テーマです。拡張性を意識した開発をおこなっており、カスタマイザーとブロックでスピーディーにサイトを立ち上げるだけでなく、CSS やフックを駆使した高度なカスタマイズにも柔軟に対応できます。