內容簡介
Products Showcase – Shopify Integration 外掛可讓您在 WordPress 上以美觀且響應式的方式展示 Shopify 產品，支援使用原生 Gutenberg 區塊和 OAuth 認證，簡化設置流程。
【主要功能】
• 原生 Gutenberg 區塊，無需 jQuery
• 美觀的觸控友好產品輪播
• 支援顯示單一產品或整個系列
• 可視化產品顏色選項
• 水平輪播或響應式網格佈局
• 實時產品搜尋功能
外掛標籤
開發者團隊
② 後台搜尋「Products Showcase – Shopify Integration」→ 直接安裝（推薦）
原文外掛簡介
Display your Shopify products on WordPress with beautiful, responsive carousels and grids. Built as a native Gutenberg block with OAuth authentication for easy setup.
Features
Native Gutenberg Block – Built with React, no jQuery or third-party services on the frontend
Beautiful Carousels – Touch-friendly product carousels powered by Embla Carousel
Smart Product Display – Show individual products or entire collections
Color Swatches – Visual product color options with hover effects
Carousel or Grid Layout – Horizontal carousel or a responsive grid with 2-6 columns
Fully Responsive – Optimized for all screen sizes and devices
Performance Optimized – Smart caching and lazy loading
Live Search – Real-time product/collection search in block editor
Sale Badges – Automatic sale badge and struck-through compare-at prices
OAuth Authentication – Secure one-click connection to Shopify
Use Cases
Showcase featured products on your blog
Display seasonal collections on landing pages
Add product carousels to content-heavy sites
Bridge content and commerce seamlessly
Requirements
WordPress 6.3+, PHP 7.4+
A Shopify store with Admin API access
Links
Plugin Website – Overview, demos & updates
GitHub Repository – Source code & developer docs
Documentation – Full installation guide
External Services
This plugin connects to the Shopify Admin API to fetch your product data.
Service Provider: Shopify Inc.
Data Transmitted: Store URL, OAuth credentials (one-time), and product queries
When: During setup, when searching products in editor, and when displaying products (cached for 1 hour)
Privacy: All Admin API calls are made server-side and the plugin itself sends no visitor data to Shopify. Product data is cached locally. Note that visitors’ browsers load product images directly from Shopify’s CDN (cdn.shopify.com), and product links open on your Shopify store, so Shopify may receive standard request data (such as IP address) from visitors in the same way as any embedded image or outbound link.
Shopify Legal:
* Terms of Service
* Privacy Policy
* API Terms
Configuration
Easy OAuth Setup
Navigate to Shopify Products in WordPress admin
Enter your Shopify Store URL (e.g., your-store.myshopify.com)
Paste your Client ID from Shopify
Paste your Client Secret from Shopify
Click “Connect to Shopify”
You’ll be redirected to Shopify to authorize the connection
After authorizing, you’re automatically redirected back – done!
The plugin automatically obtains the access token via secure OAuth and detects the latest Shopify API version.
Usage
Edit any page or post in WordPress
Click “+” to add a block and search for “Shopify Products”
Choose Products Mode (select individual products) or Collection Mode (display a collection)
Use the live search to find and add products
Customize title, description, and product limit as needed
The block displays as a touch-friendly carousel on mobile and with arrow navigation on desktop, or as a responsive grid (choose Layout → Grid in the block’s Display Options and set the desktop column count). Single products get a special two-column featured layout.
Not using the block editor? Use the [products_showcase] shortcode in the Classic editor, text widgets, or page builders:
[products_showcase collection="123456789"]
[products_showcase products="111,222,333" title="Featured"]
[products_showcase collection="123456789" layout="grid" columns="4"]
Supported attributes: collection, products, limit, layout, columns, title, description, button_text, button_url, button_new_tab, new_tab, hover_image, card_width, disable_padding, and color options. See the GitHub README for the full list.
Customization
For custom CSS classes, template overrides, hooks & filters, and developer documentation, see our GitHub README.
Troubleshooting
Products Not Showing
Check API credentials in Settings → Shopify Products
Verify connection shows green checkmark
Clear cache using the button in settings
Ensure products are set to Active in Shopify (Draft products are hidden)
Can’t Configure Shopify App
In Dev Dashboard, click “New version” to edit settings
Add scopes in the “Access” section
Click “Release” to activate your configuration
For detailed troubleshooting, see our GitHub documentation.
Credits
Built with Embla Carousel for smooth, touch-friendly carousels
Powered by @wordpress/scripts
Support
Plugin Website
Plugin Support Forum
GitHub Issues
Privacy Policy
This plugin connects to Shopify’s API to fetch product data. Product information is cached locally. The plugin does NOT collect or transmit any visitor data. See Shopify’s privacy policy for their data handling practices.
