Title: ITMAROON EC RELATE BLOCKS
Author: Isamu Takeda
Published: <strong>19 Aprile 2026</strong>
Last modified: 15 Settembre 2026

---

Ricerca i plugin

![](https://ps.w.org/itmaroon-ec-relate-blocks/assets/banner-772×250.png?rev=3509859)

![](https://ps.w.org/itmaroon-ec-relate-blocks/assets/icon-256x256.png?rev=3509859)

# ITMAROON EC RELATE BLOCKS

 Di [Isamu Takeda](https://profiles.wordpress.org/itmaroon/)

[Scarica](https://downloads.wordpress.org/plugin/itmaroon-ec-relate-blocks.3.0.2.zip)

 * [Dettagli](https://it.wordpress.org/plugins/itmaroon-ec-relate-blocks/#description)
 * [Recensioni](https://it.wordpress.org/plugins/itmaroon-ec-relate-blocks/#reviews)
 *  [Installazione](https://it.wordpress.org/plugins/itmaroon-ec-relate-blocks/#installation)
 * [Sviluppo](https://it.wordpress.org/plugins/itmaroon-ec-relate-blocks/#developers)

 [Supporto](https://wordpress.org/support/plugin/itmaroon-ec-relate-blocks/)

## Descrizione

ITMAROON EC RELATE BLOCKS provides two Gutenberg blocks to integrate a headless 
Shopify commerce flow into a WordPress site:

 * `itmar/product-block`
    - Links a WordPress post type to Shopify products.
    - Published posts without a Shopify product ID are queued for creation as new
      Shopify products.
    - Posts with an existing Shopify product ID are verified against Shopify without
      overwriting the shared product from an individual WordPress site.
    - Designed for WordPress as the content layer (product pages) while Shopify 
      remains the commerce layer (inventory + checkout).
 * `itmar/cart-block`
    - Provides a cart UI powered by Shopify Storefront API Cart.
    - Sends shoppers to Shopify Checkout to complete payment.

Important concept (recommended operation):
 * Shopify is the source of truth for
inventory and checkout. * WordPress is the source of truth for marketing/product
content. * This plugin focuses on a smooth purchase flow from WordPress pages to
Shopify Checkout.

### Security / Data Handling (Important)

 * Admin API Token and Storefront API Token are saved server-side in WordPress options
   via REST and are NOT embedded into post content or rendered into front-end HTML.
 * The editor UI no longer persists secret tokens as block attributes. Tokens should
   never be stored in post_content.

### Block Overview

= itmar/product-block =
 Use this block in the Site Editor (template) to enable 
Shopify connection and product linkage for a selected post type.

Main settings (Block Inspector  “EC setting”):
 * Select Product Post Type * Store
Site URL (Shopify domain) * Shop ID (for Customer Account API) * Channel Name (publication/
sales channel display name) * Headless Client ID (Customer Account API client_id)*
Admin API Token (saved server-side; not stored in post content) * Storefront API
Token (saved server-side; not stored in post content) * Optional display controls(
fields selector, display count, cart icon media ID, etc.)

#### itmar/cart-block

Use this block to show the cart UI. It uses Shopify Storefront API Cart endpoints
to:
 * Create/update cart lines * Show totals * Provide a Checkout URL for completing
purchase in Shopify Checkout

### Shopify Setup (Required)

You need a Shopify store and API credentials.

1) Admin API Access Token (for product/customer management)
 * Create a Shopify 
app (Custom app) and generate an Admin API access token. * Grant only the minimum
required permissions.

2) Storefront API Access Token (for product/cart/checkout flow)
 * Create a Storefront
access token in Shopify.

3) Customer Accounts (Headless) (optional but recommended if you enable customer
login)
 * Enable the new Customer Accounts / Customer Account API in Shopify. * 
Install Shopify “Headless” (sales channel) and obtain the “Client ID” used for OAuth(
Customer Account API). * You will also need the “Shop ID”. – Tip: You can derive
Shop ID from the issuer value in: https://{your-shop-domain}/.well-known/openid-
configuration

### Quick Start (Recommended Workflow)

1) Configure connection settings
 * Open the Site Editor. * Add `itmar/product-block`
to a global template (e.g., Header, or a dedicated template used site-wide). * In
the block Inspector  “EC setting”, enter: – Shopify domain (Store Site URL) – Channel
Name (e.g., “Online Store”) – Headless Client ID / Shop ID (if using customer login)–
Admin API Token and Storefront API Token (saved to WordPress options)

2) Choose the linked post type
 * In `itmar/product-block`, select your product 
post type (e.g., “product”).

3) Add the cart
 * Add `itmar/cart-block` to a template/page where you want the 
cart UI to appear.

4) Publish product posts
 * Create or edit posts in the selected post type. * Publish/
update them to trigger Shopify-side creation/update (based on your configuration).

### Related Links

 * ec-relate-blocks: GitHub
    https://github.com/itmaroon/itmaroon-ec-relate-blocks
 * block-class-package: GitHub
    https://github.com/itmaroon/block-class-package
 * block-class-package: Packagist
    https://packagist.org/packages/itmar/block-class-
   package
 * itmar-block-packages: npm
    https://www.npmjs.com/package/itmar-block-packages
 * itmar-block-packages: GitHub
    https://github.com/itmaroon/itmar-block-packages

### Developer Notes

 1. PHP class management is done using Composer.
 2. Shared functions/components are published as an npm package and reused across plugins.

### External Services

This plugin connects to external services to provide e-commerce functionality.

#### Shopify

Service provider:
 * Shopify

Domains contacted:
 * The Shopify shop domain configured by the site administrator(
e.g. *.myshopify.com or a custom Shopify domain) for Admin API / GraphQL Admin API
requests. * shopify.com for authentication / OAuth token exchange (when customer
login is enabled). * Shopify-operated domains used for checkout and storefront features(
depending on configuration).

APIs used (depending on your configuration/features enabled):
 * Shopify Admin API(
product/customer management) * Shopify GraphQL Admin API (graphql.json) * Shopify
Storefront API (product/cart/checkout flow) * Shopify Customer Account API / OAuth
endpoints (optional customer login)

Data that may be sent to Shopify:
 * Store domain, channel name, and API credentials/
access tokens (server-side) * Product data required for creating/updating products(
title, description, image, sales price, list price, quantity in stock) – The title
is the title of the post data sent. – The description is an excerpt of the post 
data sent. – The image is the featured image, if one is set. Furthermore, if the
ACF custom field has a gallery field named “gallery”, images in that field will 
also be added. – The sales price is the price set in the “prces” group set in the
ACF custom field if “sales_price” is set as a member. – The list price is the price
set in the above group if “list_price” is set. – The stock quantity is set as the
default quantity if “quantity” is set in the ACF custom field. However, this does
not reflect your sales history in Shopify, so do not use it outside of the initial
setup. * Cart line items (variant IDs and quantities) * Customer authentication 
and identity linkage (OAuth code exchange, customer access tokens when enabled) *
When uploading product images via Admin API: image data (or image URLs) and related
metadata for Shopify product images. * For authentication / OAuth token exchange(
when enabled): OAuth codes and token exchange parameters.

When data is sent:
 * When saving settings (admin only) * When rendering product/
cart features or performing cart actions * When creating/updating Shopify products
based on WordPress post changes * When performing customer authentication (if enabled)*
When exchanging OAuth tokens (e.g. https://shopify.com/authentication/{shop_id}/
oauth/token) if enabled.

Important:
 * Shopify is responsible for payment processing and checkout. * As with
any HTTP request, the WordPress server’s IP address and user agent may be included
in requests to Shopify.

Terms / Privacy:
 * Shopify Terms of Service: https://www.shopify.com/legal/terms*
Shopify Privacy Policy: https://www.shopify.com/legal/privacy * Shopify API License
and Terms of Use: https://www.shopify.com/legal/api-terms

#### GitHub (raw.githubusercontent.com) – Shopify Product Taxonomy

This plugin downloads a taxonomy text file hosted on GitHub (raw.githubusercontent.
com) to provide a category list used by the plugin.

Domain contacted:
 * raw.githubusercontent.com

Data that may be sent and when:
 * When the taxonomy list is fetched/updated, the
WordPress server requests a file such as: https://raw.githubusercontent.com/Shopify/
product-taxonomy/main/dist/ja/categories.txt * No user/customer data is intentionally
sent for this action, but the WordPress server’s IP address and user agent may be
included in the request.

Terms / Privacy:
 * GitHub Terms of Service: https://docs.github.com/site-policy/
github-terms/github-terms-of-service * GitHub Privacy Statement: https://docs.github.
com/site-policy/privacy-policies/github-privacy-statement

## Screenshot

[⌊Product block settings (EC setting)⌉⌊Product block settings (EC setting)⌉[

Product block settings (EC setting)

[⌊Product listing / product card output (example)⌉⌊Product listing / product card
output (example)⌉[

Product listing / product card output (example)

[⌊Cart block UI⌉⌊Cart block UI⌉[

Cart block UI

[⌊Checkout button redirecting to Shopify Checkout⌉⌊Checkout button redirecting to
Shopify Checkout⌉[

Checkout button redirecting to Shopify Checkout

[⌊(Optional) Customer login flow (Headless)⌉⌊(Optional) Customer login flow (Headless
)⌉[

(Optional) Customer login flow (Headless)

## Blocchi

Questo plugin fornisce 2 blocchi.

 *   PRODUCT BLOCK
 *   CART BLOCK

## Installazione

 1. From the WordPress admin panel, go to “Plugins”  “Add New”.
 2. Search for “EC RELATE BLOCKS”.
 3. Install and activate the plugin.

OR…

 1. Download the plugin .zip.
 2. In WordPress admin, go to “Plugins”  “Add New”.
 3. Click “Upload Plugin”, select the .zip file, then “Install Now”.
 4. Activate the plugin.

## FAQ

### Does this plugin process credit card data on my WordPress site?

No. Checkout is handled by Shopify Checkout. This plugin does not process or store
card data.

### Where are API tokens stored? Are they exposed to visitors?

Tokens are stored server-side in WordPress options. They are not embedded into post
content and are not printed into front-end HTML.

### Do I need Shopify Webhooks?

Not in the current version.
 This plugin is designed so that Shopify remains the
source of truth for inventory/checkout, and the site can fetch the latest values
from Shopify when needed. Webhooks may be added later as an optional feature (e.
g., cache invalidation or advanced sync).

### Can Shopify changes (inventory/price) instantly update WordPress pages?

By default, Shopify remains the source of truth. If you need near real-time reflection
on WordPress pages, you typically use short-lived caching or add Webhooks (advanced
setup).

### What do I need from Shopify to enable customer login (Headless)?

You need the Customer Account API (new Customer Accounts) enabled and a Headless
Client ID. The login flow uses OAuth 2.0 Authorization Code with PKCE.

## Recensioni

Non ci sono recensioni per questo plugin.

## Contributi e sviluppo

“ITMAROON EC RELATE BLOCKS” è un software open source. Le persone che hanno contribuito
allo sviluppo di questo plugin sono indicate di seguito.

Collaboratori

 *   [ Isamu Takeda ](https://profiles.wordpress.org/itmaroon/)

[Traduci “ITMAROON EC RELATE BLOCKS” nella tua lingua.](https://translate.wordpress.org/projects/wp-plugins/itmaroon-ec-relate-blocks)

### Ti interessa lo sviluppo?

[Esplora il codice](https://plugins.trac.wordpress.org/browser/itmaroon-ec-relate-blocks/)
segui il [repository SVN](https://plugins.svn.wordpress.org/itmaroon-ec-relate-blocks/),
segui il [log delle modifiche](https://plugins.trac.wordpress.org/log/itmaroon-ec-relate-blocks/)
tramite [RSS](https://plugins.trac.wordpress.org/log/itmaroon-ec-relate-blocks/?limit=100&mode=stop_on_copy&format=rss).

## Changelog

#### 3.0.2

 * Cart and Products view scripts import from `itmar-block-packages/front`, so the
   block editor bundle is no longer served to visitors.

#### 3.0.1

 * Updated Shopify Storefront API and Customer Account API requests to version 2026-
   07.
 * Added Customer Account API endpoint discovery while keeping the tested API version
   explicitly pinned.
 * Added Shopify API response-version monitoring and status reporting to detect 
   version fallback or mismatches.
 * Updated Storefront cart cost queries for the current GraphQL schema while preserving
   the existing response format.
 * Improved the EC integration status screen with clearer explanations of connected
   post types, queues, manual synchronization, API support periods, and log retention.
 * Updated Japanese translations for authentication, synchronization, queue management,
   and API status messages.

#### 3.0.0

 * Updated Shopify Admin API requests to the supported 2026-04 version and centralized
   Admin API URL generation.
 * Added a persistent WordPress database queue with WP-Cron processing, retries,
   recovery, deduplication, and bulk-import load control.
 * Added scheduled Shopify catalog synchronization to import products and reconcile
   remote status, availability, prices, inventory, variants, and deleted products.
 * Added queued Shopify product creation for published WordPress products that do
   not have a Shopify product ID, including price, inventory, images, and sales-
   channel publication.
 * Stored Shopify product and variant IDs as registered post meta so migration and
   import tools can preserve existing product connections.
 * Protected the shared Shopify catalog from WordPress trash and permanent-delete
   operations, supporting multiple WordPress sales sites connected to one Shopify
   store.
 * Added Tools > EC Relate Sync for queue monitoring, product synchronization status,
   manual catalog synchronization, deleted-product restoration, and failed-job retries.

#### 2.0.8

 * Corrected the distributed Shopify GraphQL client filename casing so Composer 
   PSR-4 autoloading works on Linux servers.

#### 2.0.7

 * Changed the Shopify authentication callback screen to use an editable WordPress
   page under normal conditions.
 * Added default sign-in progress content for an empty callback page while preserving
   any existing page content.
 * Kept the lightweight callback template as a fallback only when WordPress cannot
   resolve the page.

#### 2.0.6

 * Added a dedicated loading screen for the Shopify authentication callback and 
   prevented the theme’s 404 page from appearing during sign-in.
 * Made callback request detection independent of the generated WordPress page so
   plugin updates do not rely on the activation hook.

#### 2.0.5

 * Fixed the Shopify GraphQL client filename casing so Composer PSR-4 autoloading
   works on case-sensitive Linux servers.

#### 2.0.4

 * Fixed Shopify Customer Account authentication to use a server-enforced callback
   URL and a separate post-login return URL.
 * Added a dedicated callback script so authentication and logout callbacks work
   without a product block on the callback page.
 * Fixed Shopify REST requests for WordPress installations running in a subdirectory.

#### 2.0.3

 * Moved Shopify customer OAuth tokens from browser storage to encrypted server-
   side sessions.
 * Improved cart recovery, authentication error handling, checkout navigation, and
   empty-cart totals.
 * Corrected Shopify credential storage and masked-field behavior in the block inspector.
 * Updated the bundled `itmar-block-packages` dependency to version 3.2.2.

#### 2.0.2

 * Composer component fixed.

#### 2.0.1

 * Converted JavaScript to TypeScript.

#### 1.0.0

 * Initial release.
 * Product block (post type linking + Shopify integration).
 * Cart block (Storefront Cart + Checkout redirect).
 * Customer Accounts (Headless) integration support.

## Meta

 *  Versione **3.0.2**
 *  Ultimo aggiornamento **2 settimane fa**
 *  Installazioni attive **Meno di 10**
 *  Versione WordPress ** 6.4 o superiore **
 *  Testato fino alla versione **7.1.2**
 *  Versione PHP ** 8.2 o superiore **
 *  Lingua
 * [English (US)](https://wordpress.org/plugins/itmaroon-ec-relate-blocks/)
 * Tag
 * [cart](https://it.wordpress.org/plugins/tags/cart/)[checkout](https://it.wordpress.org/plugins/tags/checkout/)
   [ecommerce](https://it.wordpress.org/plugins/tags/ecommerce/)[inventory](https://it.wordpress.org/plugins/tags/inventory/)
   [shopify](https://it.wordpress.org/plugins/tags/shopify/)
 *  [Visualizzazione avanzata](https://it.wordpress.org/plugins/itmaroon-ec-relate-blocks/advanced/)

## Valutazioni

Non sono state ancora inviate recensioni.

[La tua recensione](https://wordpress.org/support/plugin/itmaroon-ec-relate-blocks/reviews/#new-post)

[Vedi tutte le recensioni](https://wordpress.org/support/plugin/itmaroon-ec-relate-blocks/reviews/)

## Collaboratori

 *   [ Isamu Takeda ](https://profiles.wordpress.org/itmaroon/)

## Supporto

Hai qualcosa da dire? Ti serve aiuto?

 [Chiedi nel forum di supporto](https://wordpress.org/support/plugin/itmaroon-ec-relate-blocks/)