Shopify Fields
Use your Shopify data within Strapi
Strapi's Shopify Fields Plugin
Use your Shopify products in Strapi!
🖌️ Available custom fields
The Shopify Fields plugin currently implements the following custom fields:
- Single Product
- Multiple Products
✨ Supported Strapi Versions
The Shopify Fields plugin is only compatible with Strapi v4.
⚙️ Installation
# if you use NPM
npm install strapi-plugin-shopify-fields
# if you use Yarn
yarn add strapi-plugin-shopify-fields
🔧 Configuration
Creating a private app on Shopify
To use the Shopify Fields plugin, you must create a private app on Shopify and obtain an access token. To do so, you should:
- Open your Shopify store's admin dashboard
- Click on Apps
- Click on Apps and sales channel settings
- Click on Develop apps for your store
- Click on Create an app
- Insert a name for the app in the App name field, eg. Strapi
- Click on Create app
- Click on Configure Admin API scopes
- Check
read_products
under the Products category - Click on Save
- Go to the API credentials tab
- Click on Install app
- Copy your access token and store it in your
.env
file
Configuring the plugin
Open or create the file config/plugins.js
and enable the plugin by adding the following snippet:
1module.exports = {
2 // ...
3 'shopify-fields': {
4 enabled: true,
5 config: {
6 apiVersion: '2022-07', // Or one of Shopify's supported API versions
7 accessToken: process.env.SHOPIFY_ACCESS_TOKEN, // The environment variable containing your private app's access token
8 shopName: process.env.SHOP_NAME, // The environment variable containing your myshopify.com domain
9 },
10 },
11};
Configuring the security middleware
Open the file config/middlewares.js
and check the configuration of the strapi::security
middleware.
If your file looks like this:
1module.exports = [
2 'strapi::errors',
3 'strapi::security',
4 'strapi::cors',
5 'strapi::poweredBy',
Replace 'strapi::security'
with:
1{
2 name: 'strapi::security',
3 config: {
4 contentSecurityPolicy: {
5 directives: {
6 'img-src': ["'self'", 'data:', 'blob:', 'https://dl.airtable.com', 'https://cdn.shopify.com'],
7 },
8 },
9 },
10}
If, instead, your file already presents strapi::security
as an object, simply add https://cdn.shopify.com
to the img-src
array.
🚀 Roadmap
- Automatic sync between your Shopify catalog and Strapi fields
- Improved UI
- Support for collections and metafields
Install now
npm install strapi-plugin-shopify-fields
Create your own plugin
Check out the available plugin resources that will help you to develop your plugin or provider and get it listed on the marketplace.