ページにカートに追加ボタンを設置したい。

Tubasa · ‎08-31-2022

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

同サイトに別ページを制作し、その中に購入可能な商品をカートに入れるボタンを設置したいです。

通常の商品ページと同じように、バリエーションを選択し、カートに追加ボタンを押下することで、カートページに遷移させたいと考えています。

その際には選択したバリエーションがカートに入っている状態にしたいです。

可能あれば商品はタブで切り替えできて2商品のうち一つを選択。

バリエーション選択し、カートに入れるボタンを押下

カートページに遷移

上記を実現したいと考えています。

ご存じの方いらっしゃいましたらご教授をお願い致します。

宜しくお願い致します。

Qcoltd · ‎09-02-2022

> 同サイトに別ページを制作し、その中に...

「同サイト」というのは、「同Shopifyストア」を指していらっしゃるでしょうか？

もし、「同Shopifyストア」を意味していない場合は、

下記の「購入ボタン」を利用することで、ご要望をある程度、満たせるかと思います。

商品をタブ切り替えする、

というところだけご自身で、

作り込みが必要になるかもしれません。

「同Shopifyストア」を意味している場合は、

上記ヘルプによると、「購入ボタン」の使用は非推奨のようです。

この場合は、

こちらに記載の方法が推奨されていますね。

しっかり読んでおりませんが、

例えば、

Add To Cartボタンのリンク先を自前で準備し、

ボタンクリック時にカート画面に遷移する、

ようなことができそうです。

商品のバリエーション変更のUIや、商品自体のタブ切り替えのUIは自作する必要がありますが、

作り込めば、希望されるものに近いものができそうです。

なお、下記のような、Shopifyストアのブログに商品を埋め込めるアプリもあるようです。

この場合、商品のタグ切り替えは難しそうですが、

アプリストアのイメージギャラリーを見る限り、

バリエーション選択までは実装できそうです。

ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/　テックブログ: https://techlab.q-co.jp/

コミュニティ・ブログ記事