Essentials
CMS Configuration
Webflow CMS setup to import Shopify data
We will be using Webflow CMS to import Shopify products, variants, options, and collections.
This appraoch will allow you to have server side rendering and SEO optimization for your products. As Webflow will render the product pages, product cards on server side, it will be faster and more SEO optimized.
Below are all the fields that should be created in the
Products CMS
This CMS collection is automatically created by looop onboarding in Webflow Connect step.This CMS colelction is diffrent from
Products CMS collection that you might have in Webflow ecommerce.products CMS collection.
| Field Name | Field Type | Referenced CMS |
|---|---|---|
| looop-id | PlainText | |
| looop-store | PlainText | |
| looop-hero-picture | Image | |
| looop-hero-pictures | MultiImage | |
| looop-description | RichText | |
| looop-default-variant | Reference | variant |
| looop-variants | MultiReference | variant |
| looop-option1 | MultiReference | options |
| looop-option2 | MultiReference | options |
| looop-option3 | MultiReference | options |
Variants CMS
This CMS collection is automatically created by looop onboarding in Webflow Connect step. Below are all the fields that should be created in thevariants CMS collection.
| Field Name | Field Type | Referenced CMS |
|---|---|---|
| looop-id | PlainText | |
| looop-position | Numnber | |
| looop-store | PlainText | |
| looop-p-id | PlainText | |
| looop-price | Number | |
| looop-price-compare | Number | |
| looop-picture | Image | |
| looop-product | Reference | products |
Change the decilal places to 2 for
price and compareAtPrice fields in the CMS settings.Options CMS
This CMS collection is automatically created by looop onboarding in Webflow Connect step. Below are all the fields that should be created in theoptions CMS collection.
| Field Name | Field Type |
|---|---|
| Name | PlainText |
Collections CMS
This CMS collection is automatically created by looop onboarding in Webflow Connect step. Below are all the fields that should be created in thecollections CMS collection.
| Field Name | Field Type | Referenced CMS |
|---|---|---|
| looop-id | PlainText | |
| looop-store | PlainText | |
| looop-description | RichText | |
| looop-products | MultiReference | products |
Policies CMS
This is an optional CMS collection that you can create to add policies to your website. Below are all the fields that should be created in thepolicies CMS collection.
| Field Name | Field Type |
|---|---|
| body | RichText |