余白やカラム設定が便利に。動画で見るブロックエディタ〈設定画面編〉

ホームページ作成サービスBiNDupでサイト編集の要となるのがブロックエディタ。その一部が変わります。
前回の編集画面編に続き、今回はブロック設定画面の変更箇所を動画とともにピックアップしてご紹介します。

当記事で紹介している機能は2021年12月に搭載予定です。
動画で今すぐチェックしたい方はこちらからどうぞ。

ブロック設定

ブロックエディタの設定画面が変わります。
今までの機能を引き継ぎつつ、間隔や余白の指定、カラムごとのカスタマイズなど、ブロック単位でのレイアウト調整がより手軽にできるようになります。

ブロックエディタの設定画面

複数ブロックにまたがる背景

ブロック単位の背景を設定する時に、複数のブロックにまたがった背景の指定ができるようになります。背景画像を印象的に使いながら、コンテンツのまとまりを表現しやすくなります。

複数ブロック背景

カラム単位で背景や余白を設定

カラム単位でのカスマイズは、これまではデザイン設定機能のDressなどで設定する必要がありましたが、ブロック設定から簡単に指定できるようになります。

目立たせたいカラムに背景を設定したり、カラム単位での余白を指定したり、より表現の幅が広がります。

カラムのカスタマイズ例

余白やカラム間隔の指定方法が増えます

カラムの間隔は、今までは0%〜3%の中からしか選択できませんでしたが、数値での指定もできるようになります。相対値(%)だけでなく、絶対値(px)でも指定できます。

また、ブロック全体の余白指定でも相対値(%)が使用できるようになります。

余白や間隔の設定

左右違いブロックが使いやすく

左右のカラム比率を変更

左右違いブロックは、2つのカラムの幅が異なるのが特徴的なブロックレイアウトです。比率が固定されていて、調整したい時はDressやCSS詳細設定による高度な設定が必要でした。

改修後のブロックエディタでは左右のカラムの比率をスライダーで簡単に変更できるようになり、より自由度の高いレイアウトを実現できるようになります。

左右違いブロックの設定

スマホサイトでの表示順を指定

左右違いブロックをスマホサイトで1カラム表示する時に、どちらを上にするかを指定できるようになります。
PCサイトで交互に表示したレイアウトを、スマホサイトでは順番に表示するレイアウトを実現できます。

左右違いブロックのレイアウト

プレーンブロックのカラムの高さを改善

プレーンブロックのカラムの高さは内容に合わせた高さでしたが、カラム数が多い時に不揃いになることもありました。目次ブロックのように一番高いカラムの高さに揃うように改善されます。

プレーンブロックのレイアウト

スマホサイトだけの背景色指定が可能に

PCサイトとスマホサイトで異なる背景色を指定できるようになります。背景画像だけでなく、背景色も調整したいという時に便利です。

動画で詳しくチェック

以上、今回紹介した機能は12月のリリースに向けて鋭意開発中です。
動画ではこれらの機能がどのように使いやすくなるか、よりわかりやすく解説しているのでぜひチェックしてみてください。

BiNDupの新機能をもっと見る
記事内の画像は開発中のものです。実際の仕様とは異なる場合があります。

BiNDup GuideBook

Web作成サービス「BiNDup」の最新ガイドブック。サイトを外注せず自作する方のために制作から集客までできることをまとめました。

新規登録をして資料をダウンロード
  • POINT

  • ブロック単位でのレイアウト調整がより手軽にできるようになります
  • カラム単位でのカスタマイズができるようになります
  • 左右違いブロックのレイアウトが調整しやすくなります

RECOMMEND ARTICLE