メニューのcurrent表示

日本語 ディスカッション 技術的なQ＆A
1

お世話になっております。

グランドメニュー部分のカスタマイズで
クライアントの要望により、「{% if link.current %}current{% endif %}」と指定をいれて
そのURLにある時に.current文字装飾を入れています。

メニュー項目にはコレクションが並んでいます。
col1 | col2 | col3 |

といった感じだとして、
myshopify.com/collections/col1

を表示している間は当然currentなのですが

myshopify.com/collections/col1/product/bag01

と、コレクションから商品階層に進んだときにもcurrent表示を保持(または新たに適用)したいです。

何かいい書き方があれば教えていただけないでしょうか?

2

currentの場合は現在表示しているページと一致している場合のみtrueになってしまう為、

{% if link.current %}

ではなく、

{% if link.active %}

で判定してみるとどうでしょうか？

activeの場合は、リンクが指すリソースがURL構造の一部の場合にtrueとなります。

2 Likes
3

collection.title で どうでしょうか？

2 Likes
4

ご回答ありがとうございます

{% if link.active %}

activeで動作しました！ 助かりました。

1 Like
5

ご回答ありがとうございます！

コレクション名をひっぱってclassに入れて何かできないかと、代替も検討することができました