![見出し画像](https://assets.st-note.com/production/uploads/images/73593990/rectangle_large_type_2_73edbd8d9a7527b31f27cd3d030f1343.jpg?width=1200)
SWELLボックスメニューをスマホで表示させる方法
こんにちは。
クリンクスデザインです。
今回はWorrPressテーマのSWELLでの作成させて頂いたのですが、そちらでスマホ用「ボックスメニュー」の独自カスタマイズを作成しました。
そちらの作成メモをお伝え致します。
SWELL公式サイト
ボックスメニューって何?
サイドバーなどで用いられる、アイコンや画像などをカラム表示してクリックボタンの機能です。
イメージしやすいように画像でお見せ致します。
ボックスメニューで現在独自カスタマイズを利用できる記事が落ちてるのが「Cocoon」「SWELL」が多く落ちてるように思います。
・Cocoon
・SWELL
【ボックスメニューを実際に実装したサイト】
https://www.radianne.com/japan/
ボックスメニューではCocoonでは、PCとSP両方カスタマイズCSSはあるけど、SWELLではPCはあるけどSPの詳しい記事がなかったので詳しく解説していきます。
なるべく、複数のサイトで使い回しできるように簡単な構成で実装しました。
テーマファイルは直接編集しません。
実装パターン
①2カラムのアイコン
②3カラムのアイコン
【WordPress】
バージョン:5.9
この記事公開時の最新バージョンです。
【SWELL】
バージョン: 2.5.8.5
【サーバー】
Xサーバー、キャッシュクリア状態。
ここから先は
5,620字
/
8画像
¥ 10,000
この記事が気に入ったらサポートをしてみませんか?