FROM CACHE - jp_header

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

Tubasa
Shopify Partner
34 0 6

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

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

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

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

 

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

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

カートページに遷移

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

 

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

宜しくお願い致します。

1件の返信1
Qcoltd
Shopify Partner
365 140 136

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

 

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

 

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

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

https://help.shopify.com/ja/manual/online-sales-channels/buy-button

 

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

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

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

 

 

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

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

 

この場合は、

https://community.shopify.com/c/shopify-design/cart-use-permalinks-to-pre-load-the-cart/td-p/613702#...

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

 

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

例えば、

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

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

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

 

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

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

 

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

https://apps.shopify.com/dropinblog-seo-friendly-blog?locale=ja

 

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

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

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

 

ご参考まで。

(キュー田辺)

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