I previously asked about the possibility to run Webflow and Shopify together to create an optimized ecommerce experience for both the customer and the admin. I love Webflow customization possibilities but the lack of e-commerce features are a real concern for me. The most important missing feature is the ability to get offline orders or the ability to make manual orders.
The idea is to supercharge the Webflow sales process with the power of Shopify (without all the drawbacks of it).
I found out that Zapier offers a whole range of interactions between Webflow and Shopify.
Among them, there are interactions that allow to create an order on Shopify when an order is created on Webflow.
That interaction would help me to transfer the orders on Shopify and manage them there. If i works as intended, that would be the way in to Shopify from Webflow. Great !
The issue is there is apparently no way to make the way back. There is a âupdated orderâ interaction but I assume itâs only dealing with what is inside an order, not his status. So I assume Shopify doesnât allow the get order status send to Webflow to trigger automated customer mails. Shame.
koo! For now Iâm sticking to shopify button integration, for a small amount of items itâs doable, and through shopify thereâs a lot more payment gateway integration for EU
Also trying zoho flow which is in webflow beta integration but it also lackâs advanced access to the cms fields, but sounds promising for zoho users.
Hi Good news!!! Iâve been in touch with Blendr (blendr.io) and I asked them to build a WF connector. They built one in just a day! You can try it with a free account now. It has basic functionality only but within a few days more it should have orders functionality. I also asked them to add orders functionality to their Shopify connector. Iâll keep you posted.
Update: This turned out to be a dead end. See my posts belowâŠ
Hi Nigel, Iâm very interested in this, trying to solve the problem discussed in this thread. Is Blendr a company that builds customized integrations to solve problems where none exist? Youâre paying them to build an integration for you? How is this going?
Hi Gaynes and everyone. Blendr is very responsive. They are doing everything they can to help, including 24 hour turnaround for my requests. However we are going with a different solution. We discovered Udeslyâs WF â Shopify adapter (Webflow to Shopify | Udesly.com) and frankly itâs amazing. It allows you to code in Webflow and host in Shopify. To see it in action, hereâs our original site in Webflow: www.xialla.com. And hereâs our converted site in progress on Shopify www.clubxialla.com. (temp URL that will change to xialla.com when weâre ready to go live on Shopify). Not everything is finished but you can get a sense of the accuracy of the conversion. Note that weâve updated some fonts and look and feel as we work. The actual site that weâre using to convert from is at xialla-5.webflow.io. Note that the links there donât all work when live because theyâre the Shopify-specific links.
One thing I was worried about was whether the adapter was sort of a one-shot deal. I can say that it is definitely not. You can set everything up in WF, then run the adapter which takes a total of 2 minutes, and your Shopify site is ready. Then if you edit in WF you can update your site again in just a couple of minutes. Since it involves a theme update on each change, you do need to modify the checkout changes in Shopify each time (logo, colors) but this takes just a second.
Iâm checking with Udesly to see if thereâs a way to update only changed theme files between updates. If thatâs possible then it would be even more amazing and it would reduce the update time to about a minute.
Ping me if you need any help with this. So far I highly recommend it and canât say enough about the magic that Udesly has worked with this adapter. It really does open the door to development in WF while not losing the awesome infrastructure and developer community of Shopify.
To answer more directly about Blendr⊠keep in mind with APIs that itâs much faster and easier for a company to âgetâ an API endpoint (i.e. WF order) than it is to âputâ the same or similar endpoint (i.e. Shopify order). In the get, the returned object is whatever JSON the API sends back. But in the put, the API has to explicitly map to the fields by building the correct JSON to send. So what I noticed about the Blendr widgets is that itâs easy to get a complete WF order, customer etc, but when I went to put (push) the order through to Shopify, the widget (the call them blends) was missing a lot of the Shopify order fields, and the structure was not intuitive. It didnât seem to map easily to the Shopify API docs. Blendr did say they would work on completing it right away, but Iâm not sure of the status.
Udesly looks good but I envisioned two major drawbacks when looking for the best solution to connect Webflow to Shopify.
First, I was not sure that the process of changing something on the site would be easy. For instance, if I need to change a section in my site in Webflow, I understood I would need to run the entire Udesly process to get my site updated on Shopify. With potentially some issues each time or rework on the existing site.
Second, Webflow is great for customize everything on a site including the checkout experience. Shopify allows to customize the checkout but through code. Using Webflow is obviously motivated to get rid of the code side. So I thought I would either need to code for a custom made checkout or loose that customization on the Shopify side. Not great.
My initial plan was to take the best of Webflow and Shopify. Webflow is great to create sites but canât compete on the sale managements sales. Shopify on the other hand is limited for the site design (without any code capabilities) while being crazy good at managing sales. The idea is to make both of them working together.
Zapier allows that connexions, theoretically. There are Zaps pushing data back and forth between Webflow and Zapier. It seems really likely that pushing order from Webflow to Shopify can be made easily. It remains to be seen if these orders can be updated along the fulfillment process from Shopify to Webflow to keep it organized and up to date.
Can you tell me if things like Dynamic Style Settings carry over to Shopify? Iâm currently tossing up whether to build in Webflow and connect with foxy.io or to Shopify via Udesly. One of the key things Iâd like to be able to do is style a product pageâs background colour and font colour based on colours set within Webflowâs CMS or Product data
The point you make about having to rework the Shopify site after updates and the running of the entire process with each update as a good one. That was my first concern. I was worried that I would end up having to make changes in Shopify and then lose the ability to update continuously from WebFlow. So far that doesnât seem to be the case. The update from WebFlow to Shopify literally takes two minutes. Sure itâs not as fast as hitting the publish button and WebFlow, but even if youâre doing half a dozen updates a day itâs still really nothing to slow you down. And once the site gets stable and youâre doing maybe one or two updates a day, then itâs completely manageable. As well, I havenât yet set up source code management for Shopify, but when thatâs set up the update process should be even smoother because instead of uploading the entire theme (that Udesly creates) to Shopify each time, we should be able to just unzip it into the source code working folder (automatically) and then post the updates to the theme.
Customizing the Shopify checkout has positives and negatives: The positive is yes you can have your own look and feel. The negative is that the Shopify checkout is very trusted and well known. When people hit it, they feel itâs trustworthy. This is one of the main âbrilliant thingsâ that Shopify did, in my opinion. By providing a standardized checkout look and feel they give every little startup a sense of strong trust in the checkout. We are still in the startup phase, so we are using the Shopify checkout to get exactly that sense of trust. When companies get big enough that they are trusted, it makes more sense to customize the Shopify checkout. You can get that ability to customize the checkout (and other features) by upgrading to the Plus plan at $2K/mo CAD.
Regarding Zapier, we had exactly the same idea; create orders in Webflow and send them through to Shopify. There are a few problems with that. The first problem is similar to Blendr; the Zaps are not complete and thereâs no indication if they ever will be complete. The main problem is with the order details, but there are other issues with the Zaps. The other issue is with the payment processing. Should you process payments through WF or Shopify? If you process payments through WF then your Shopify will be accumulating orders without being connected to the payment processor. You lose a lot of the benefit of having the orders in Shopify, like being able to cancel an order or do partial refunds in Shopify and have the transaction flow through to the payment processor. You also lose the benefit of cost saving you can get by using Shopify payments for processing. On the other hand, you could process payments through Shopify. But then you lose the ability to enable the customer to log into your WF site and see transaction history (payments, refunds etc.) because youâll be doing the refunds through the Shopify admin.
Another option to keep in mind is what weâre currently doing until we have the Shopify site ready to go live. Weâre using the Shopify Add to Cart button embedded in the WF store. You can see this here: https://www.xialla.com/product/xialla. It works smoothly, but there are a couple of things we donât like about it. The main problem is that on the desktop it opens a popup checkout window. The other problem is the cart style isnât in keeping with the rest of the site. For these two reasons, I suspect we lose 20% additional customers in the checkout process.
I hope this helps you. Iâll post here again when I set up the source code management for Shopify.
This is a very interesting topic. Following along closely.
Would another potential solution be to have a webflow site for everything except the ecommerce bit, then have a subdomain that points directly to the shopify âshopâ page.?
Dynamic style settings donât carry over to Shopify. None of the CMS carries over. But in Shopify dynamic styles are easy with their Liquid language. You would go to the Shopify site, write and test your Liquid code, then when itâs working embed it in the WF site so that itâs maintained through the conversion process. Shopify doesnât have a CMS system, but Shopify has advanced tooling for managing JSON. So you can store your data on Google Sheets for instance, and get it as JSON any number of ways, like this: How to use Google Sheets as a JSON Endpoint, then access it anywhere in the Shopify site. Alternatively, you can keep the data in the WF CMS so that you have the great design experience, and you can get it as JSON directly from WF via the WF API. How to use Google Sheets as a JSON Endpoint. In Shopify the WF collection bindings wouldnât automatically work, so youâd connect them by adding attributes like this everywhere you have a WF binding: liquid:object={expression} (see the Udesly docs here: https://docs.udesly.com/shopify-liquid-elements). The {expression} would call a function in your code to get the required object from the JSON.
I make 80% of my sales online and could use Webflow e-commerce features alone. Despite the lack of user accounts ans some other stuffs, I would be happy with whatâs offered so far.
But for the last 20%, I would have a problem. Those sales are initiated offline but finalized online, on my site. That occurs on fair and on third party concept stores across the world. My clients place their orders at that moment only to pay it afterward when at home.
Webflow doesnât offer the ability to deal with POS or even create orders manually for a third party. Shopify does. Here is the main reason I need Shopify.
The tricky part is to make Webflow and Shopify work together seamlessly. Zapier offers connexions but I am aware there are some troubles with data shared. I didnât tried by myself for now though.
To avoid complexity and troubles, I thought I would only use Shopify to manage my sales. The idea is to get order through Webflow, getting paid through their platform and then switching to Shopify to handle the fulfillment process, the emailing process, the shipping, etc. If I can send back data to Webflow during this process, fine. If not, the idea is to leave Webflow âblindâ until the end of the process sending back a âorder doneâ information. The only drawback of that scenario is when I need to refund an order because the managing platform is not the one that deal with payments.
I have studied all the possibilities from using the embed Shopify âBuy Buttonâ to Udesly, and that Zapier solution. Since I need a fully customized website, I chose the Zapier solution until further notice.
It would be interested to see the cost side of these solution too. Both requires to spend money on the Webflow, a third party tool and Shopify with different amount for each solution. Not sure which one is the best costs-wise.
Yes. We did that for our first sales. It works well but then you need to be able to customize the shop pages to your liking which requires knowledge of Shopify. As well, once youâre in the shop, the user expects to still see the look and feel of your site, with menus, footers, etc. So you have to recreate the menus in Shopify, or at least some of them, set up the links etc. The other problem is the cross-domain tracking. Your ad campaigns send buyers to your WF site but they check out on the Shopify site. The cross-domain conversion tracking gets tricky and conversion tracking is important for many things, like Google to be able to optimize your ad campaigns.
My only advice would be to ensure you can make Zapier work before you invest too much time. Try a WF to Shopify Zap and I think youâll find that itâs a long way from working. I checked with Zapier support to make sure I wasnât missing anything and hereâs what they replied:
ZAPIER SUPPORT REPLY RE WEBFLOW ZAP
"Hi Nigel,
Thanks for writing in! Unfortunately, the issue here is that Webflow is sending us those New Order fields in a hard-to-use format. Itâs not actually Line Items, so we donât have a good way of parsing it, even using the Formatter. The biggest issue is that itâs going to have a variable number of lines when you have more than one item purchases, so even splitting it on Line Breaks means youâre going to have different numbers of items, and then mapping them becomes a crapshoot.
Weâre always looking for ways to make our integrations more powerful and it sounds like better line items from Webflow could be really useful for others as well, so much so that itâs already one of the top feature requests for this app. Iâve added your email address as another vote for this addition. I donât have an ETA of when or if this will happen, but we will definitely email you if it does become a reality.
Sorry I couldnât give you better news here! Happy to answer any questions you might have about this or anything else. Thanks!"
Yes youâre right partly. But even if WF had a good Zap, the Shopify Zap is also missing many required features.
Yes we tried it. No I didnât ask WF about it because WF (wisely) doesnât ever provide info about software release dates so thereâs no point, and also because we saw that the Shopify Zap is not complete either.
Yes, thankfully Udesly has what seems like a great solution.
