SyncKube Pro - Products Sync for Shopify

Version 1.0.0

Introduction

Support: SakuraLeaf Support

Product: SyncKube Pro - Products Sync for Shopify

Note! This documentation applies to both the free and pro plugin versions.

This documentation will help you install, configure, and customize SyncKube Pro. Please read through the documentation carefully to understand how this plugin works and how to get the most out of its features.

SyncKube Pro seamlessly synchronizes your Shopify store products with WordPress, allowing you to showcase your products on your WordPress site while maintaining Shopify's secure checkout and inventory management.

Key Benefits

Requirements

In order to work properly, the plugin requires the following:

  1. WordPress 6.4 or higher
  2. PHP 8.2 or higher
  3. Active Shopify account with custom app configured

Installation

SyncKube Pro requires setup in both WordPress and Shopify. Follow these steps carefully:

Part 1: WordPress Installation

  1. Log in to WordPress Admin: Navigate to Plugins > Add New > Upload Plugin
  2. Upload the ZIP file: Click "Choose File" and select the shopypress-pro.zip file
  3. Install the plugin: Click "Install Now" and wait for the installation to complete
  4. Activate the plugin: Click the "Activate" button

Part 2: Shopify App Configuration

You need to create a custom app in your Shopify admin to allow SyncKube Pro to access your products.

  1. Log in to Shopify Admin: Go to your Shopify store admin panel
  2. Navigate to Apps: Click Settings > Apps and sales channels
  3. Develop apps: Click "Develop apps" button (or "Manage app development" if apps exist)
  4. Enable custom app development: If prompted, enable custom app development for your store
  5. Create an app: Click "Create an app" button
  6. Name your app: Enter "SyncKube Pro" or any name you prefer
  7. App URL: Enter your website URL, or any URL, it does not matter.
  8. Embed app in Shopify admin: Uncheck Embed app in Shopify admin.
  9. Configure API scopes: Click "Configure Admin API scopes" and select (or paste) the following:

  10. Save configuration: Click "Release"
  11. Copy credentials: Once created, from the left menu > click Settings:
    • API key (Client ID): Copy this value
    • API secret key (Client Secret): Click "Reveal" and copy this value
  12. Install the app: from the left menu > click Home
    • From the right menu Distribution > Click select distribution method
    • Choose Custom distribution
    • Enter your Shopify Domain (ex: shop1.myshopify.com)
    • Uncheck Allow multi-store install for one Plus organization
    • Click Generate link
    • Copy the generated link
    • From the left menu click > API access requests > Storefront API > click Enable Storefront API
    • Paste the generated link above into a new browser tab, accept the permissions (scopes) and click install

Part 3: Connect WordPress to Shopify

  1. Navigate to SyncKube Settings: In WordPress admin, go to Settings > SyncKube Settings
  2. Enter Shop Domain: Enter your Shopify store domain (e.g., yourstore.myshopify.com)
  3. Enter Client ID: Paste the API key from Shopify
  4. Enter Client Secret: Paste the API secret key from Shopify
  5. Save settings: Click "Save Settings"

Note! After saving your Shopify credentials, you must select collections and sync products before products will appear on your site. See the Collections Management and Product Synchronization sections for details.

Main Settings

Once you have installed and activated the plugin, navigate to Settings > SyncKube Settings to access the settings page.

The settings page is organized into five main tabs:

  1. Settings: Configure your Shopify connection and URL rewrite settings
  2. Collections: Select which Shopify collections to import and manage their order
  3. Product Sync: Start product synchronization and monitor progress
  4. Filters: Configure which filters appear on the frontend and their display order
  5. Shortcodes: View shortcode documentation and available parameters

Settings Tab

The Settings tab contains the core configuration options:

Shop Domain: Your Shopify store domain (e.g., yourstore.myshopify.com)
Client ID: API key from your Shopify custom app
Client Secret: API secret key from your Shopify custom app
Product Rewrite Slug: URL slug for product pages (default: shopify-product)
Collection Rewrite Slug: URL slug for collection archives (default: collection)

Tip! You can customize the URL structure of your product pages by changing the rewrite slugs. For example, changing "shopify-product" to "shop" will make your product URLs look like yoursite.com/shop/product-name instead of yoursite.com/shopify-product/product-name.

Collections Management

Collections allow you to organize your products into categories. SyncKube Pro lets you select which Shopify collections to import into WordPress.

Fetching Collections

To see your available collections:

  1. Navigate to Settings > SyncKube Settings > Collections tab
  2. Click the "Fetch Collections" button
  3. Wait for the collections to load from your Shopify store

Selecting Collections to Import

After fetching collections, you can choose which ones to sync:

  1. Review the list of available collections
  2. Check the boxes next to the collections you want to import
  3. Uncheck any collections you don't want to include
  4. Click "Save Collection Selection"

Only products from the selected collections will be imported during synchronization.

Reordering Collections

You can change the display order of collections:

  1. Click and drag a collection to move it up or down in the list
  2. The order you set here will be reflected in frontend filters
  3. Changes are saved automatically when you drag and drop

Collection Hierarchy

SyncKube Pro supports hierarchical collections. Parent-child relationships are maintained automatically, allowing for organized product categorization.

Note! You must complete product synchronization after selecting collections. Simply selecting collections doesn't import products - you need to run the sync process (see Product Synchronization section).

Product Synchronization

Product synchronization is the process of importing your Shopify products into WordPress. This creates WordPress posts for each product with all their data, images, and variations.

Understanding the Sync Process

SyncKube Pro uses a 4-phase synchronization process designed to handle large stores efficiently:

  1. Phase 1: Shop Initialization - Fetches your shop's currency settings and basic configuration
  2. Phase 2: Collections - Retrieves all product IDs from your selected collections
  3. Phase 3: Products - Processes products in batches (20 products per batch) to prevent memory issues and timeouts
  4. Phase 4: Cleanup - Removes any orphaned products that no longer exist in Shopify and cleans up empty collections

The sync system uses intelligent time management that consumes only 70% of your PHP max_execution_time, ensuring the process can resume automatically if needed.

Starting Initial Sync

To sync your products for the first time:

  1. Ensure you have configured your Shopify credentials (Settings tab)
  2. Ensure you have selected collections to import (Collections tab)
  3. Navigate to Settings > SyncKube Settings > Product Sync tab
  4. Click the "Start Sync" button
  5. Monitor the progress bar and phase indicators
  6. Wait for the completion message

Note! For large catalogs (1000+ products), synchronization may take several minutes. The process runs in batches and will automatically resume if it reaches the PHP execution time limit. You can safely leave the page and return later - the sync will continue in the background via WordPress cron.

Monitoring Sync Progress

During synchronization, you'll see:

Resume Capability

If sync is interrupted (browser closed, timeout, etc.), it will automatically resume:

Reset Sync

If you encounter issues or want to start fresh:

  1. Click the "Reset Sync" button
  2. This clears the sync state and lock file
  3. You can then start a new sync from the beginning

Important! Resetting sync doesn't delete your existing products - it only clears the sync progress state. To re-import products, click "Start Sync" after resetting.

Filter Configuration

The Filters tab allows you to control which filters appear in your frontend product search interface and in what order.

Available Filter Types

SyncKube Pro supports the following filter types:

Managing Filters

Navigate to Settings > SyncKube Settings > Filters tab to configure your filters:

  1. Enable/Disable filters: Use checkboxes to show or hide specific filters on the frontend
  2. Drag-and-drop to reorder: Click and drag filters to change their display order
  3. Set display limits: Configure how many items show initially (collections and vendors)
  4. Enable Quick View: Toggle the Quick View modal feature on or off
  5. Save configuration: Click "Save Filter Configuration" to apply changes

Filter Display Limits

You can set limits for how many filter items display before "Show All" expansion:

Tip! Limit the number of visible filters to avoid overwhelming users. Focus on the most relevant filters for your product catalog. You can always let users expand to see more options.

Quick View Setting

The Quick View feature allows customers to preview product details in a modal popup:

Shortcode Usage & Configuration

SyncKube Pro provides multiple shortcodes to display products and shopping cart functionality on your WordPress pages.

Cart Toggle Shortcode: [synckube_cart_toggle]

Displays a shopping cart icon with quantity badge that opens the cart modal.

[synckube_cart_toggle]

Usage:

Basic Product Grid: [synckube_all_products_grid]

Displays products in a responsive grid layout with basic pagination.

[synckube_all_products_grid products_per_page="12"]

Available Attributes:

products_per_page (number, default: 12) - Number of products to display per page

Features:

Usage Examples:

[synckube_all_products_grid products_per_page="24"]

Shows 24 products per page, perfect for a main shop page.

[synckube_all_products_grid products_per_page="8"]

Shows 8 products per page, ideal for mobile or sidebar display.

Advanced Product Grid with Filters: [synckube_all_products_grid_with_filters]

Displays products with advanced filtering sidebar and AJAX-powered search.

[synckube_all_products_grid_with_filters
  products_per_page="12"
  load_more_products_no="12"
  collection_limit="5"
  vendor_limit="5"
]

Available Attributes:

products_per_page (number, default: 12) - Number of products to display on initial load
load_more_products_no (number, default: 12) - Number of additional products to load when "Load More" button is clicked
collection_limit (number, default: 5) - Maximum number of top-level collections to display initially in the filter sidebar
vendor_limit (number, default: 5) - Maximum number of vendors to display initially before "Show All" expansion

Features:

Usage Examples:

[synckube_all_products_grid_with_filters products_per_page="24"]

Shows 24 products initially with all default filter settings.

[synckube_all_products_grid_with_filters
  products_per_page="9"
  load_more_products_no="9"
  collection_limit="10"
]

Shows 9 products at a time with up to 10 collections visible in filters.

Note! You can use multiple instances of the shortcodes on different pages with different parameters to customize the product display for different contexts (e.g., main shop page vs category pages).

Frontend Product Display

SyncKube Pro provides beautiful, responsive product displays on the frontend of your WordPress site.

Product Grid Layouts

When using product grid shortcodes, products are displayed in a responsive grid featuring:

Advanced Filtering Interface

The advanced product grid includes a powerful filtering system:

Desktop View:

Mobile View:

Single Product Pages

Each product has a dedicated page with comprehensive details:

Layout:

Product Variants:

For products with variants (different colors, sizes, etc.), the page includes:

Product Actions:

Quick View Modal (Optional)

When enabled, products display a "Quick View" button that opens a modal with:

Collection Archives

Products are automatically organized by collection:

Tip! All Shopify functionality (cart, checkout, inventory) remains in Shopify - WordPress just displays the products. This means you get WordPress's design flexibility with Shopify's e-commerce power.

Shopping Cart Integration

SyncKube Pro integrates Shopify's native shopping cart and checkout system using Shopify Web Components.

How It Works

The plugin uses Shopify's official Web Components to provide:

  1. Cart Management: Add, update, and remove items from cart
  2. Real-Time Updates: Cart quantity updates instantly across the site
  3. Secure Checkout: Customers checkout directly through Shopify's secure system
  4. Inventory Sync: Stock levels always reflect Shopify's current inventory

Cart Display

The shopping cart icon can be placed anywhere on your site using the shortcode:

[synckube_cart_toggle]

Cart Icon Features:

Cart Modal

When customers click the cart icon, a modal displays:

Add to Cart Functionality

Products can be added to cart from multiple locations:

Checkout Process

When customers click "Checkout":

  1. They are redirected to your Shopify store's secure checkout
  2. Cart contents are transferred to Shopify automatically
  3. Customers complete payment through Shopify's trusted system
  4. Orders appear in your Shopify admin for fulfillment

Shopify Web Components

The plugin automatically loads Shopify Web Components from:

https://cdn.shopify.com/storefront/web-components.js

These components handle:

Important! All transactions are processed through Shopify's secure checkout. SyncKube Pro never handles payment information - it simply displays products and facilitates adding them to your Shopify cart.

Webhooks Configuration (Pro version)

Webhooks allow Shopify to automatically notify WordPress when products change, keeping your site synchronized in real-time.

What Are Webhooks?

Webhooks are automated notifications sent from Shopify to WordPress when:

Registering Webhooks

Webhooks are being registered when you save the app's credentials for the first time or when those have been changed (you have created a different custom app or the credentials changed).

Webhook Endpoint

SyncKube Pro automatically creates a webhook endpoint at:

/wp-json/shopypress/v1/shopify/webhook

This endpoint receives notifications from Shopify and processes product updates in the background.

Supported Webhook Events

The plugin registers webhooks for these Shopify events:

How Webhooks Work

  1. Change in Shopify: You create, update, or delete a product in your Shopify admin
  2. Shopify Sends Notification: Shopify sends a webhook to your WordPress site
  3. WordPress Receives: SyncKube Pro receives the webhook at the REST API endpoint
  4. Product Updates: The plugin updates the corresponding product in WordPress
  5. Site Reflects Change: Your WordPress site now shows the updated product

Webhook Security

Webhooks are secured using:

Note! Webhooks require your WordPress site to be accessible from the internet. Local development sites or sites behind firewalls may not receive webhooks. In such cases, use manual sync instead.

Troubleshooting Webhooks

If webhooks aren't working:

Performance & Optimization

SyncKube Pro is designed for exceptional performance, even with large product catalogs.

Batch Processing

The plugin uses intelligent batch processing to handle large product catalogs:

Time-Based Execution Management

SyncKube Pro monitors execution time to prevent timeouts:

  1. 70% Rule: Uses only 70% of PHP max_execution_time
  2. Time Tracking: Monitors elapsed time during sync
  3. Early Exit: Stops before timeout and saves state
  4. Auto-Resume: WordPress cron resumes the sync automatically

Cron-Based Background Sync

Large syncs run in the background:

REST API Filtering

The advanced product grid uses REST API for filtering:

Handling Large Catalogs

For stores with thousands of products:

Note! SyncKube Pro has been tested with stores containing thousands of products. The batch processing and resume capability ensure reliable sync even for large catalogs.

Auto-Sync

SyncKube Pro includes automatic synchronization capabilities to keep your WordPress site updated with Shopify products.

AutoSync is being triggered when a product change event happens in Shopify (products/create, products/update, products/delete)

Note! Autosync will be triggered after 60 seconds since the last Shopify webhook was triggered. This will ensure nothing will fail in case hundreds or thousands of products have been updated in Shopify (Example: bulk price edit, offer a BlackFriday discount)

How Auto-Sync Works

The cron job performs the following tasks:

  1. Check for Incomplete Sync: Looks for sync processes that didn't complete
  2. Resume Sync: If an incomplete sync is found, resume it automatically
  3. Lock File Check: Ensures no concurrent syncs are running
  4. Process Next Batch: Syncs the next batch of products
  5. Save State: Persists progress for next cron run

Developer Resources

SyncKube Pro provides REST API endpoints and AJAX actions for developers to extend and customize functionality.

REST API Endpoints

Product Filter Endpoint

URL: POST /wp-json/shopypress/v1/products/filter
Purpose: Filter and retrieve products based on multiple criteria

Request Parameters:

Response: JSON array of product objects with images, prices, variants, and metadata

Shopify Webhook Endpoint

URL: POST /wp-json/shopypress/v1/shopify/webhook
Purpose: Receive product update webhooks from Shopify

AJAX Actions

The following WordPress AJAX actions are available:

Custom Post Type

Post Type: shopypress-product
Default Rewrite: shopify-product (customizable)
Supports: title, editor, thumbnail, custom-fields, excerpt

Taxonomy

Taxonomy: product-collection
Default Rewrite: collection (customizable)
Hierarchical: Yes

Product Meta Fields

Products store the following meta data:

External Services

SyncKube Pro connects to the following external services:

Shopify Admin API

Shopify Storefront API

Shopify Web Components CDN

Third-Party Libraries

SyncKube Pro includes the following open-source libraries:

Plugin Architecture

SyncKube Pro follows modern WordPress development practices:

Note! Always test customizations on a staging site before deploying to production. Follow WordPress coding standards for compatibility and security.

Changelog

Version 1.0.0 - Initial Release (Sat 20 Dec - 2025)

Third-Party Libraries

SyncKube Pro includes the following open-source libraries, used in compliance with their respective licenses:

Note! Future updates will be documented here. Check this section regularly for new features, improvements, and bug fixes.