スマホサイズの固定バーでアイコンメニューを横並びに表示させたい

[mongorian346]

テーマDawnを利用しています。

下記のようにスマホサイズの時に、画面下に固定でアイコンを並べたバーを表示させたいのですが、可能ですか？

できれば商品詳細ページの時は非表示にしたいです。なぜなら「カートへ入れる」や「今すぐ購入」が表示させるようにしたいです。

 

 

[株式会社フルバランス · Accepted solution]

Mongorian346さま

はじめまして、フルバランスの渡邉です。

ご質問を確認いたしました。

cssの調整で可能かと存じます。

ヘッダー要素(.header)をposition:fixed;で画面下に固定し、ハンバーガーメニュークリック時に出てくるドロワー（.menu-drawer)の位置も調整するイメージです。

また、css自体をtheme.liquidなどに<style>タグで囲んで書いて、{% unless template == 'product' %}{% endunless %}といった分岐で囲めば、商品ページは除外されるかと思います。

ご参考になりましたら幸いです。

私たちの励みにもなりますので、
お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。

フルバランス　渡邉