- このトピックには4件の返信、2人の参加者があり、最後に
により6年、 2ヶ月前に更新されました。
-
投稿
-
希望；画像をフロントページでPCは横２，スマホのときはレスポンシブで縦２表示にしたい。
現状；PRウィジェットだと高さが６０しかない画像なので、表示が拡大され、両サイドが切れてしまう。やってみたこと
Snow Monkey Awesome Custom Blocksのカラムで、画像を並べてみる
旧エディターでコンポーネントから2カラムを選び、HTMLタグをコピー
カスタムHTMLウィジェットやテキストウィジェットに貼り付け結果
フロントページでレスポンシブ表示されるのか確認を試みたのですが、レスポンシブになりませんでした。要望
今後、Gutenbergのカラムがレスポンシブに対応するかとは思いますが、それまでのつなぎにSnow Monkey Awesome Custom Blocksにレスポンシブでカラムを増減できる機能を追加していただけないでしょうか。
もしくはセクションでカラムを増やせるようにしていただけるとうれしいです。ご検討よろしくお願いします。
いいねをした人: 居ませんあー確かにそうですね、標準のカラムブロックはレスポンシブ対応無かったですね。独自のカラムブロックも追加しようと試してみたのですが、使い心地的に満足いくものをつくるのが非常に難しく断念している状況です。
一応、HTML ブロックに下記のような HTML を入力すればとりあえずはレスポンシブ対応の2カラムが実現できると思いますので試してみてください。
<div class="c-row c-row--margin"> <div class="c-row__col c-row__col--1-1 c-row__col--lg-1-2"> あいうえお </div> <div class="c-row__col c-row__col--1-1 c-row__col--lg-1-2"> かきくけこ </div> </div>c-row--marginはカラム間に標準的な余白を入れる設定です。消せばぴったりくっつきます。PC サイズ以上で2カラム、それ以下は1カラムの例ですが、
c-row__col--lg-1-2のところをc-row__col--md-1-2にするとタブレットサイズ以上で2カラムになります。いいねをした人: 居ません
- トピック「Snow Monkey Awesome Custom Blocksにレスポンシブでカラムを増減できる機能がほしい」には新しい返信をつけることはできません。