> For the complete documentation index, see [llms.txt](https://developer.esw.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developer.esw.com/adobe-commerce-magento/integration/product-restriction-frontend-customization.md).

# Product Restriction Frontend Customization

By default, [Global Product Restriction](/adobe-commerce-magento/additional-features/global-product-restriction.md) is enforced on the backend.

That means restricted products cannot be added to cart for blocked shopper countries, even if no frontend customization is applied.

You can extend the storefront behavior to make restrictions clearer before the shopper clicks **Add to Cart**.

### JavaScript hook

The extension exposes this global function:

```javascript
eswProductCountriesRestriction(callback[, productContainersSelector])
```

Use it to apply custom behavior to restricted products on supported storefront pages.

By default, the hook is available on:

* product listing pages
* product detail pages
* search result pages

### Arguments

#### `callback`

Required.

Runs once for each restricted product container.

The callback receives one parameter:

* `restrictedProductContainer`, provided as a jQuery object

#### `productContainersSelector`

Optional.

Overrides the selector used to find product containers on the current page.

If omitted, the extension uses the default Luma selector.

### How restriction detection works

The frontend hook relies on the restriction marker rendered by the extension:

* hidden field name: `eshopworld_is_product_restricted[]`
* CSS class: `eshopworld-is-product-restricted`

When a product is marked as restricted, your callback can update the matching product container.

### Common customization examples

#### Add a custom class

```javascript
eswProductCountriesRestriction(function (restrictedProductContainer) {
  restrictedProductContainer.addClass('eshopworld-restricted-product');
});
```

#### Hide the Add to Cart button

```javascript
eswProductCountriesRestriction(function (restrictedProductContainer) {
  restrictedProductContainer.find('.action.tocart').hide();
});
```

#### Disable the Add to Cart button

```javascript
eswProductCountriesRestriction(function (restrictedProductContainer) {
  restrictedProductContainer.find('.action.tocart').prop('disabled', true);
});
```

#### Add a restriction message

```javascript
eswProductCountriesRestriction(function (restrictedProductContainer) {
  var name = restrictedProductContainer.find('.product-item-name');

  jQuery('<div />')
    .addClass('restricted-message')
    .html('This product is restricted for the current country.')
    .insertAfter(name);
});
```

### Expected result

After this customization is applied:

* backend restriction logic still blocks invalid add-to-cart actions
* restricted products can be identified earlier in the storefront
* shoppers get clearer feedback before attempting checkout


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://developer.esw.com/adobe-commerce-magento/integration/product-restriction-frontend-customization.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.