SWELLってどんなの?SWELLを知る

【SWELLワードプレステーマ】サブメニューをアコーディオン表示させる設定方法(長いメニューをたたんでコンパクトに!) 〜初心者向け〜

Himです♪
@himlog_com
こんな疑問やお悩みにお応えします!
  • サブカテゴリーが多くなってしまい、全部表示してしまうと縦長に伸びて見づらいので親カテゴリーのみ表示させたい。
  • グローバルナビ・スマホメニュー・ウィジェット内のサブメニューをたたんでアコーディンオン式に表示したい。
メニューをたたんでスッキリさせる

本記事ではWordPressテーマSWELLサブメニューをアコーディオン表示させる設定方法をご紹介します。
手順通り進めていってみてくださいね。

  • ブロックエディタ完全対応
  • 他テーマからの移行も簡単
  • 初心者でも安心のフォーラムあり
当ブログはSWELLのブロックエディタで作成しています。

ブログ初心者さんがSWELLを購入したものの、何からカスタマイズしていったらいいのか分からないという方のために、とりあえず先に見栄えを良くして「ブログを書く」というモチベーションを保つためにSWELL設定の主要ポイントをお伝えしています!

Him

超初心者さんに向けて書いているので、分からない専門用語は一切省きます。安心して読み進めてみてくださいね。

記事の内容

サブメニューのアコーディオン化とは?

クリックひとつでメニューをコンパクトに畳んだり広げたりできるようにすることです。

  1. グローバルナビの副項目メニュー
  2. スマホ開閉メニュー内にあるメインナビのサブメニュー
  3. ウィジェットに設置できるカテゴリーリストなどのサブメニュー

アコーディオン開閉式に変更することができます。

パソコンで見たときのサイドバーカテゴリー表示の比較

アコーディオン化していない場合

アコーディオン化した場合

パソコンで見る分にはサブカテゴリーが開いている方が、どんなことが書かれているのが開かずに確認できるので便利だと思います。

私もしばらくこのスタイルでやってたのですが、さらにサブカテゴリーが増えたときに、スマホで開閉メニューを見ると縦長に間延びしてしまって見にくいなと思いました。

もう少し詳しい方だと個別に設定するカスタマイズ方法もわかるかもしれませんが、通常の誰でもいじれるカスタマイザー設定では個別に設定はできないようです。

サブメニューをアコーディオン表示させる設定方法

STEP
外観
STEP
カスタマイズ
STEP
サイト全体設定
STEP
基本デザイン
STEP
サブメニューの表示形式でチェックを入れる

サブメニューをアコーディオン化するにチェックをいれると、グローバルナビ・スマホメニュー・ウィジェット内のサブメニューが一斉にアコーディオン化されコンパクトに折り畳まった表示になります。

STEP
公開ボタン

変更したあとは必ず公開ボタンを押して反映させてください。

アップデートされてからできるようになった新しいことだと、見落としてしまっていたりします。
このサブメニューのアコーディオン化も途中からできるようになったものです。
また、変更内容がアップデート情報のところにしか書かれていない場合は見落としがちになるのでご注意ください。

Him

使用状況に応じて使い分けてみてくださいね♪

以上、WordPressテーマSWELLサブメニューをアコーディオン表示させる設定方法でした!

その他のSWELL設定関連記事

  • ブロックエディタ完全対応
  • 他テーマからの移行も簡単
  • 初心者でも安心のフォーラムあり
当ブログはSWELLのブロックエディタで作成しています。

この記事が気に入ったら
フォローしてね!

よかったらシェアしてね!
記事の内容
閉じる