Our first Webflow/Shopify store

Hello community!

Today we launched our first Webflow/Shopify store for a client! http://knaus-1016.webflow.com is the webflow URL, and if you want to see how it was built, check out the public share link.

This is a website for a cozy little shop selling designer clothes for women, that has become quite famous locally due to their owners being so great at marketing themselves on social media. It would be nice with some feedback from you guys, especially on obvious mistakes we might have made, the layout on the front page and also about the color choices.

We previously used Wordpress with WooCommerce for this client, but quickly realized it gave us way too much work, and the client was not happy with how they could manage the store. Thanks to the new Dynamic wonderful Embeds, moving to Webflow/Shopify was a dream. The website is influenced by the Wordpress Atelier theme, our own company’s website, and also a few others. We used as much flexbox as we could, and from the little time we had testing it, it seems to be working nicely in most browsers. The file sizes is still a bit large for the images, and since we just launched it (10 minutes ago), the domain name might still be messed up for some. Oh, and the slider has 2 identical slides for now.

Thank you and have a nice day!

8 Likes

Colors are nice. Though on mobile I feel as if it’s a bit cluttered because of all the pictures and the small spacing between them. But that is just personal preference. Good job! Glad you liked Webflow! :wink::+1:

I think it looks pretty great! Nice!

Hi guys, really nice job!

I’ve one technical question for you: how did you go about creating a dropdown list to select size and to integrate it with Shopify?

I checked one of you products (can’t remember the name but it’s poncho, or something like that). On your live website you can see both the embedded Shopify button and above it the size selector. However, if you check the same page on you public share link, you can still see the embed HTML to link the Shopify button but no sign whatsoever of the Size Selector…

Would really appreciate if you can explain this.

Thank you!

Hi and thank you for the feedback!

I agree with you @VladimirVitaliyevich on the spacing in the mobile site, it feels a bit cluttered. That I will definitely look into, thank you! Gonna increase them by quite a bit actually.

@Omar_Melizza, all we did to achieve that was add the “Product Variants” on each product in Shopify, and then select “Include variants” when you generate code for the buy button. This way, the client can actually control variants (and stock/price on each variant) without ever touching Webflow.

That’s great, double thanks for sharing and sharing the public link! You’re a real teamplayer :slight_smile:

Also, nice site!

Flott levert! :smile:
Some polishing left on the mobile site as others have mentioned. One thing i noticed was the delay of fade on the dropdown is a bit slow so if hover over next menu item the previous dropdown menu gets in the way.
But all in all a great job!

Great job, I was wondering if using the embed Shopify will drasticaly slow the site, but it seems not.
Thank you for sharing this ! And well done !!

Very cool! I’ve never seen a webshop built in Webflow like this before. Great job :slight_smile:

It seems that the http://knaus-1016.webflow.io/merker page shows a 404 page error. Just saw that a few mins ago.

Wow thanks for all the great feedback! Glad you noticed that broken link @Blaise_Posmyouck, this is one of those obvious errors I should have caught while testing :wink: Also thank you @perkristian. I’m wondering how I can make my dropdowns work better. As I keep running into limitations with Webflows Navbar- and Dropdown-elements, I tried to make my own. It still needs some changes, as I can see from your screenshot. Making the fading faster will help I hope!

So far, the biggest issue we have with Webflow-Shopify buy buttons over Wordpress-WooCommerce, is the ability to have more product options available. Would be nice with some checkboxes and text fields for some of our clients. Any suggestions on how to achieve that?

1 Like

Hi @bonsaikitten

Really nice site! Photography and fonts/colors all fit nicely with the atmosphere of the products, great job!

What I noticed was that often divs or items don’t align vertically all the time, I would try to visually align those. Look at my example screenshot so you know what I’m talking about:

Veldig pen og godt utført ! :slight_smile:

I really like the checkout integration with dynamic lists. @bart @cyberdave @PixelGeek Do you think zapier may be able to automatically create a collection between shopify and webflow? Either by creating a collection from a shopify product or create a product based on a webflow collection? It think it would be amazing to have it do it automatically.

3 Likes

@DFink We are not using that, but tried something similar. You can, on the paid Zapier, receive an e-mail or have a spreadsheet updated with the Product ID, Product Handle and Product Name when you add a new product in Shopify. It makes the process a lot easier for the client.

@TomLamers you have a good point, especially the title with the black boxes there. That I need to fix!

This is fantastic! I’ve been playing with the idea of building a store in Webflow since seeing the tutorial video about using Shopify… this has sealed the deal!

Nice,

I love Webflow and Shopify.

Take a look at the size by this dress: http://knaus-1016.webflow.io/produkt/blue-leef-dress

it’s 336 instead 36

Rene

Having been a Zapier user for a few years now, the only difference between paid/non-paid is the amount of ‘transactions’ that your zaps do. Functions are not restricted. :slight_smile:

Thank @onecompany for noticing that!

Yes, @DragonDon, I thought so too, but it seems that the Shopify app is considered a premium app on Zapier. And those premium apps costs I think.

Oh yes, you are right. Forgot about the premium ones.