How to integrate a custom product configurator

nilosderzweite
Shopify Partner
2 0 1

I made a product configurator in svelte and would like to integrate that into the Shopify Store of my customer. Right now I am able to create the product, fetch the matching variant and put it into a shoppingcart via the javascript buy sdk. But it would be much better if we could integrate our App into the Shopify Shop and just use the Shopping Cart of the sorrounding shop.

 

Is a "Shopify App" the way to go now? I created the example App but it looks like, those apps are ment for the Admin-Side of the Shop. Is there Any way to implement my App and use it like a Component of the already existing shop?

 

Thanks so much. I will keep researching but would be happy if anyone could help.

Replies 2 (2)

PaulNewton
Shopify Partner
6339 580 1350

If it's already working is there a reason the configurator can't just be in an inline iframe on the product description page(PDP) , or in a modal.

That way is just adding some embed code to the themes templates or as a custom-liquid block/section in OS2.0 themes, or a custom-html section/block in themes that have that feature.

 

For app integration to the frontend look at either the scripttag api, using app-block extensions, or a proxy-app.

The scriptag api is good for lite javascript based integrations where modifying the themes actual liquid code is undesirable.

app-block extensions to make it simplar to add/remove the app UI as a theme setting merchants can control and position on  page.  

If the configurator is performance heavy a proxy app can be the way to go.

 

https://shopify.dev/apps/online-store 

 

 

 

 

 

 

Save time & money ,Ask Questions The Smart Way


Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org


nilosderzweite
Shopify Partner
2 0 1

Hello Paul,

 

thanks for the reply. The notfication went to spam, so i'm a little late. But i think i found a good solution: I added a script-tag and an iframe to a Page containing a listener on a message event, fired by my iframe, containg the variantId I want to add to the cart and i do that via cart api.

 

Best Regards