> For the complete documentation index, see [llms.txt](https://magecomp.gitbook.io/shopify/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://magecomp.gitbook.io/shopify/apps/kor-order-limit-quantity/customization.md).

# Customization

If you want to change the interface of your store's alert notifications, you can customize those popups from this field.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FkakqBGuHzMZvhq26bnJh%2FScreenshot%20(32).png?alt=media&amp;token=1030347d-7ef0-4c94-ad29-1876c032bbb1" alt=""><figcaption></figcaption></figure>

* **Select a model -** Select the model of your popup message that you want for your popup message.
* **Model Color -** Select the color that you want as the background of the popup message.
* **Border Color -** Set the border color according to your preference.
* **Font Color -** Choose the color of the font
* **Font Size -** Select the font size that you want for the error message.
* **Border Radius -** Set the border radius that you want for your alert message.
* **Z-index -** Set your desired Z index for a better user interface.

**This is the error message preview:**

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FFiRuPd9FxFLnvAKMILP4%2FScreenshot%20(33).png?alt=media&amp;token=a9fb81a4-0515-4c6f-86ab-12db8380140d" alt=""><figcaption></figcaption></figure>

You can also choose another popup message model apart from the default popup model.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FBwpsuXWfGBcVtggJ5zmV%2FScreenshot%20(34).png?alt=media&amp;token=fc0e189a-e224-4da9-beeb-71bfdd27082e" alt=""><figcaption></figcaption></figure>

## How to Configure In-Line Messages in KOR Order Limits

The **In-Line Message** feature in the KOR Order Limits app allows merchants to display order limit messages directly on their Shopify product pages and cart pages. These messages help customers understand product quantity restrictions and make informed purchasing decisions.

### Step 1: Select the In-Line Message Type

1. Find the **Select Type** dropdown menu.
2. Click the dropdown to view the available message types.
3. Select **In-line message**.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2F7CZ7J7zsGRkhwQzpQb5y%2Fimage.png?alt=media&amp;token=12d1ee38-5790-47f9-b16c-509a52f9ccde" alt=""><figcaption></figcaption></figure>

The app provides two message display options:

* **Alert:** Displays the order limit message using the existing alert style.
* **In-line message:** Displays the order limit message directly within the relevant storefront area.

Select **In-line message** to use the new display style.

### Step 2: Customize the Message Appearance

After selecting **In-line message**, configure the available styling options displayed on the Customize page.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FTCBs9OhW2apNad2Bc245%2Fimage.png?alt=media&amp;token=28f32901-7ef2-444d-9871-702f83f64cd0" alt=""><figcaption></figcaption></figure>

#### 2.1 Message Color

Use the color selector to choose the message background or color setting available in the customization panel. Select a color that matches your storefront design while keeping the message easy to notice.

#### 2.2 Font Size

Enter the desired font size in pixels in the font-size field.

For example, the screenshot shows a font size of `12 px`. You can adjust this value to make the message text more readable on your storefront.

#### 2.3 Border Radius

Set the border radius to control the roundness of the message box corners.

* A value of `0` creates square corners.
* A higher value creates more rounded corners.

Choose a value that matches your storefront's overall design.

### Step 3: Review the Preview

The **Preview** panel displays an example of how the product page and order limit message may appear.

Review the following details:

* Message placement and visibility.
* Text readability.
* Color and styling.
* How the message fits with the product information and quantity selector.

Use the preview to review your customization before checking the live storefront.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2F4jAiiOYkxoiWqruO2Ad1%2Fimage.png?alt=media&amp;token=d7087784-da41-4502-ac33-fab3ae17c86c" alt=""><figcaption></figcaption></figure>

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2FzFbMfKmmLtjmerMSzoIP%2Fimage.png?alt=media&amp;token=dec25733-c39b-43f2-a4c6-6663638b4832" alt=""><figcaption></figcaption></figure>

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2F0PEIxPTrUq4OyvUXJ2Ip%2Fimage.png?alt=media&amp;token=5e9b8c87-5dc9-4ded-b24e-d17be9c80ab3" alt=""><figcaption></figcaption></figure>

### Step 4: Save or Apply Your Customization

After completing the configuration, use the available save or apply option if displayed in your app version.

Then, open your Shopify storefront and visit a product with an active order limit rule to verify that the message appears as expected.

<figure><img src="https://922942541-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FIGRcMuVZCEGNibOl1OmW%2Fuploads%2F3oGY3nQpZaZxnRZg3SBj%2Fimage.png?alt=media&amp;token=b422c295-627d-4c9e-a563-b6744f01053a" alt=""><figcaption></figcaption></figure>

### Step 5: Understand How In-Line Messages Work

Once configured, the In-Line Message feature helps communicate order restrictions directly to customers.

#### Example 1: Product Quantity Limit

Suppose a product has a minimum purchase quantity of 2 and a maximum purchase quantity of 5.

The product page can display a message such as:

*“You can purchase a minimum of 2 and a maximum of 5 quantities of this product.”*

This informs customers of the allowed quantity before they add the product to their cart.

#### Example 2: Product Variant Limit

Suppose a specific product variant has a maximum purchase limit of 3 units.

When the customer exceeds the configured limit, the cart can display a message such as:

*“You can buy max 3 quantities of Shirt Product Variant Limit (Min - 1 & Max - 3) - Black.”*

This helps customers identify which product or variant has exceeded its permitted quantity.

### Important Notes

* An applicable order limit rule must be configured for the message to be displayed.
* The In-Line Message option controls the message display style; it does not replace the order limit rules themselves.
* The actual message depends on the configured product, variant, or other applicable quantity restriction.
* Check the storefront after customization to confirm that the message displays correctly.
* Available styling controls may vary depending on the selected message type and app configuration.
