hi there.
I’ve designed a page in Webflow that I would like to export and use on my clients Shopify webshop. I’ve managed to export and implement the HTML through the RTE and link it to a custom stylesheet with the CSS from Webflow as well. But it’s acting weird - like it crashes or doesn’t load properly.
I know it’s probably just mee overseeing something but can’t figure out what.
example: https://originalcoffee.dk/pages/kaffebarer-test
Any help or tips would be appreciated
Can we see the Webflow project as well? For comparison.
I looked around a little bit and it seems like your CSS style-sheets have some overlapping class names.
the class .card for example is included in both theme.scss.css and custom-styles.css
theme.scss.css has the following attributes set for .card:
width: 100%
opacity: 0
transition: all 500ms ease-out
transform: translateY(50px)
-webkit-transform: translateY(50px)
-ms-transform: translateY(50px)
The opacity is causing your cards to not appear and the width + tranform attibutes are causing the alignment to be all janky.
I quickly disabled the opacity from the theme.scss.css stylesheet using the Chrome developer console and this is what I got:
Also I noticed you didn’t mirror the structure that you have in your Webflow layout:
In the webflow project each card is inside a column div as seen below
But in the shopify project only the second card is inside a column div:
Anywho hope this helps.
oooh yes! that was it! thanks!!
I changed the class name and made a new export and it works like a charm now. Stupid mistake.
very much appreciated @Modii!
Hi I was just searching to know about some best Shopify theme for my online store actually currently I implemented a minimalistic theme but I am not getting conversion from that so kindly give me guide me regarding a best converting theme. Here i found a guide on theme…can anyone guide me on it Best Shopify Themes - How to Pick the Best Theme
