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.
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.
Below are all the fields that should be created in the 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 the variants 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 the options 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 the collections 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 the policies CMS collection.
| Field Name | Field Type |
|---|---|
| body | RichText |