WordPress — ブロックの先頭固定

ナビゲーションバーがページトップに固定されると、ユーザーの利便性が向上します。アクセス数が向上することでしょう。WordPressにはブロックを先頭固定する方法（sticky block）の機能があります。

ブロックの張り付き

先頭に固定できるブロックは次の３つ —『グループ』『横並び』『縦並び』です。

操作方法はどれも同じです。

これだけです。

ブロックを下端に固定したり、サイドに固定したりはできません。

張り付きブロックに背景を付ける

初期設定でブロックの背景は透明になっています。

このようにすると、背景に色が付けられます。パディングで高さを調整します。

レイアウトを中央配置にすることも忘れないようにしましょう。

角を丸めることもできます。

純正WordPressは色の種類が少ないので、Hex番号で色を指定すると良いでしょう。

方法はこちら。

これは文字枠の色指定ですが、方法は同じです。

背景を画像にする

背景に画像に変えると印象がグッと変わります。

まず細長い画像を用意します。

これを張り付けるだけです。

かなり印象を変えることができました。

この画像をぼかすことはできません。画像をぼかしたい場合は、『カバー』のブロックに『横並び』ブロックを張り付けると良いでしょう。

パディングなどで内部のブロックを高くしていると、上図のように画像が全体表示されなくなるので注意しましょう。

カバーの使い方はこちら。

これも文字枠の作り方ですが、方法は同じです。カバー画像が全体表示されるように狭め、不透明度を０％にしないで上げていきます。

また『カバー』は先頭に固定できないので、かならずグループ化するようにしましょう。

張り付きブロックを画面一杯に広げる

Gutenbergエディターで簡単に操作できます。

『カバー』『横並び』の両方のブロックを全幅に変更します。

あと『横並び』ブロックの間隔を広げると見栄えが良くなるでしょう。

これをメニューバーにする手もあると思います。

お疲れさまでした。