SANGOテーマでヘッダーを追尾するにはどうしたらいいの？
CSSとか必要？
この記事ではSANGOの標準機能であるヘッダーブロックを使って、ヘッダーを追尾して表示する方法を解説します。
今回のカスタマイズ標準機能として搭載されているためCSSなどのコードは一切いりません。簡単にできるのでパパっと終わらせてしまいましょう！
こんな感じで追尾します
[広告]CSSの勉強におすすめ
対応する環境
対応しています
標準機能でサポートされています
対応していません
3.0にアップデートしましょう
SANGO 3.0から追加された新機能を利用するため、SANGO 2.0の方は3.0以上にアップデートすることでこの機能を使えるようになります。
詳しい手順はこちらの記事をご覧ください。
大まかな手順
大まかに手順を確認しましょう。詳しい手順・注意はこのあと解説していきます。
ヘッダーブロックを入れるためのページ(パーツ)のコンテンツブロックを作成します。
左サイドバーのコンテンツブロックから新規作成を押して新しいパーツを作ります。
ブロックを追加から「ヘッダーブロック」を選び設置します。
右メニューの設定に「ヘッダーを固定する」があるので有効化しましょう。
ほかの項目も必要に応じてカスタムします。
設定が終わったら名前を付け、公開を押して保存します。
先ほど作成したヘッダーを適用させましょう。
左メニューの外観＞カスタマイズを押し、✨デザイン・レイアウト＞コンテンツブロックと進んでいきます。ヘッダーのコンテンツブロックの項目があるので、先ほど作成したコンテンツブロックを選択して保存しましょう。
これで置き換えは完了です。
まずはヘッダーブロックを入れるためのページ(パーツ)のコンテンツブロックを作成します。
左サイドバーのコンテンツブロックから新規作成を押して新しいパーツを作ります。
通常の投稿のようにヘッダーを作っていきます。
ブロックを追加から「ヘッダーブロック」を選び設置します。
ヘッダーブロックを出すことができました。
背景色や見た目などの設定は右サイドバーから設定していきます。
右サイドバーの設定に「ヘッダーを固定する」があるので有効化しましょう。
ほかの項目も必要に応じてカスタムします。
例えば表示スタイルや背景、文字色などを柔軟に変えることができます。
カスタムが完了したらコンテンツブロックにわかりやすい名前を付け、公開ボタンを忘れずに押しましょう。
これで新しい追尾ヘッダーを作ることができました。ここからは作ったヘッダーをサイトに適用しましょう。
最後に先ほど作成したヘッダーを適用させましょう。
左メニューの外観＞カスタマイズを押し、✨デザイン・レイアウト＞コンテンツブロックと進んでいきます。ヘッダーのコンテンツブロックの項目があるので、先ほど作成したコンテンツブロックを選択して保存しましょう。
これで置き換えは完了です。サイトを確認すると先ほど作成した追尾するヘッダーに置き換わっています！
[広告]CSSの勉強におすすめ
トラブルシューティング
✨デザイン・レイアウト＞コンテンツブロックがない
この機能はSANGO3.0以上でのみ使える機能です。SANGO 2.0の方は3.0以上にアップデートすることでこの機能を使えるようになります。
詳しい手順はこちらの記事をご覧ください。
ヘッダーのコンテンツブロックに表示されない
- SANGO3.0以上か確認する
- 「コンテンツブロック」で作成しているか確認
- コンテンツブロックに名前を付け、公開を押したか確認
FAQ集
- SANGOテーマでヘッダーを追尾するには？
- ヘッダーブロックを使いましょう。ワンクリックで追尾機能を有効化することができます。
- ヘッダーを追尾するのにCSSを書く必要はありますか？
- いいえ。SANGOではヘッダーを追尾して表示する機能が標準搭載されているため、難しいカスタマイズは一切不要です。
ご質問・相談など
その他
SANGO FUNはWordPressテーマSANGOの魅力、使い方やカスタマイズを解説するサイトです。
この記事がお役に立ちましたら、ぜひほかのSANGOユーザーさんにも広めて頂けるととてもうれしいです。
Twitterでの拡散やフォローをお待ちしています！
めっちゃおすすめ
