写真のすぐ下に次の見出しが来ると、話題の切れ目が分かりにくいことがあります。そんなときは、「スペーサー」で高さを決めて空間を作れます。ここでは、横方向ではなく記事中の上下の余白を扱います。
1. 余白を入れたい場所に「スペーサー」を置く
- 前の写真と次の見出しの間など、広げたい位置で「＋」を押します。
- 「スペーサー」を検索して選びます。ブロックを追加できる行で「/spacer」と入力しても候補を呼び出せます。
- スペーサーを選び、右側の「ブロック」設定の高さを変更します。編集画面で下端にハンドルが見える場合は、そこをドラッグしても高さを調整できます。
画像では、選択中のスペーサーが灰色の帯で表示されています。右側のBlock → Settings → Height（高さ）に「28」を入力し、隣の単位をpxにすると、高さ28pxの余白になります。下端の丸いハンドルでも調整できます。
まずは24〜32pxくらいから試してみましょう。すでにテーマが前後の間隔を取っている場合は、少し加えるだけで十分です。
2. 何も書かない段落との違い
| したいこと | 向いている操作 |
|---|---|
| 文章の話題を分ける | Enterで新しい段落を始める |
| 画像と見出しの間など、一箇所だけ広げる | スペーサーで高さを調整する |
| 案内ボックスの枠と文章の距離を変える | グループの内側の余白を調整する |
空の段落を何個も入れると、あとからどこで余白を作ったか見分けにくくなります。スペーサーなら、リストビューで名前を見つけて、高さだけ変更できます。
表示例：上の文章
次の文章（この間に高さ28pxのスペーサー）
3. スマホで余白が広すぎるときは高さを下げる
公開前にデスクトップとモバイルのプレビューを切り替えます。スマホで次の見出しまで長くスクロールしないと届かないなら、いったん高さを下げて見比べましょう。ピクセルで指定した高さは、画面が狭くなっても自動では小さくなりません。
削除するときは、リストビューから「スペーサー」だけを選び、「︙」から削除します。前後の本文や画像を一緒に選んでいないかを確かめてから実行すると安心です。
関連記事
サイトの準備に使えるサービス
これから公開先を用意する方は、ドメインとサーバーの条件を見比べてみてください。
ドメインを用意する
サーバーを用意する
コメント