Liquid、JavaScriptなどに関する質問
1コレクションに商品が300近くあります。
アプリを使わずにそのコレクションページに検索窓をを実装したいのです。
もちろんヘッダーなどにあるサイト内検索窓とは別です。
お客様がキーワードを入れるとそのコレクションから絞れるという感じです。
これはコレクションLiquidにコーディングで作ることは可能ですか?
可能であればサンプルコードを教えてください。
すいません、実際のコードまでは用意していませんが、
テーマで新規に検索ページを作るか、既存ページに検索窓を追加して、クエリーのGETパラメータからキーワードを取得し、Liquidでは、毎回全件コレクションを取得してループ内で1件ずつチェックするか、filterを使ってfor 分で絞る方法で可能かと思います。
https://shopify.github.io/liquid-code-examples/example/collection-list
https://shopify.dev/docs/themes/liquid/reference/filters/array-filters#where
ただし、Liquidはサーバーサイドでストアフロントの表示前にコンパイルされるものなので、クエリパラメータを受け取るには以下のようなHackyな方法になります。
https://freakdesign.com.au/blogs/news/get-the-url-querystring-values-with-liquid-in-shopify
個人的には、パートナーアカウントからCustom appを作って、APIを使って検索をして、テーマからはapp proxyを使ってデータをやり取りするか、
(アプリを使われたくないようですが、アプリは同様のアプローチをしています)
マーチャントアカウントで完結させる場合は、private appを作って、そのアプリをホストするサーバーでAPIを読んで、テーマから外部参照できるように、ショップのドメイン配下におくか、CORS対応をして別ドメインから呼びさせるようにする方が確実かと思います。
(結局これらの開発をしなくて済むようにアプリがあるのですが。。)
Shopifyのチェックアウトは世界一コンバージョン率が高いチェックアウトです。2023年4月に実施された世界3大手マネジメントコンサルティング会社の共同調査によると、Sho...
By Minami_ Apr 11, 2024Shopifyのルーツ Shopifyは、スノーボードをオンラインで販売したいという夢を叶えるために2004年に誕生しました。当時は大企業だけがインターネットで販売す...
By JapanGuru Apr 7, 2024リエンゲージメントの自動化で売り上げ向上へ!素敵なオンラインストアを作成し、見込み顧客の携帯へ広告を直接に送信する、またはSNSなどで宣伝すると、お客様がストアに行き着...
By Mirai Mar 24, 2024