DOCS

Getting Started
Setup
Best Practices
Your First AI Campaign
Creating Campaigns
AI discounts
Discount UX
Launching & Editing Campaigns
Performance Monitoring

Promi Home

Search

Setup

Setting up Promi and scheduling your first campaign should only take 10 minutes for most merchants, no coding required. Follow the below guide for detailed instructions. If your site involves extensive custom code, you can request free white-glove setup here.
Enable the Promi embedded code + configure collections page components
Navigate to your theme editor and click the 'app embeds' icon on the menu on the left. You will need to toggle on the Promi embedded code. From here you should confirm that you see sales badges, price strikethroughs, and price subtitles on your collections pages when the preview functionality is toggled on. Adjust the settings to style the components as you prefer.
If you do not see the strikethroughs, sales badges, and discount descriptions on your product and collections pages, you'll need to add a 'selector' so Promi knows where to put these components. We recommend contacting Promi support to help with adding this selector.
Testing
You should see the Promi UX components in your theme editor during installation. If you do not, we recommend contacting us for further help. You are also able to preview these UX components during the campaign creation process to ensure they are working properly. When you click 'create campaign' from the Promi homepage, on the "UX" tab, you will see a 'preview' option at the bottom.
If you are having any issues, we offer free setup. You can get in contact with us here.
That's it! You've fully set up Promi and are ready to launch personalized, AI-powered discount campaigns.
Next Steps
We recommend launching our recommended campaign template as a next step.


Headless Integrations
Promi can be used for headless e-commerce as well. We recommend getting in contact with our team here, but see below for an overview of this type of integration.
To collect data and update prices, Promi relies on a javascript file added in the <head> of your site:
<script src="https://storage.googleapis.com/promi-public/production/price.js" defer></script>
Promi then requires you to 'tag' the components that it will interact with on your site. You can do this by adding the following classes to the appropriate elements:
  • Collections page prices:
    • Class: 'pm-price'
    • Attribute: data-product-id="{{ product.id }}"
    • Attribute: data-variant-id="{{ variant.id }}"
  • PDP prices:
    • Class: 'pm-price-single'
    • Attribute: data-product-id="{{ product.id }}"
    • Attribute: data-variant-id="{{ variant.id }}"
Your cart will need to run Shopify functions to accurately display the discounts.


Cart Attributes
For shops that create their own cart, Promi requires that Promi-specific targeting information be attached as cart attributes. Cart attributes live on the cart object and are carried through to checkout. You can learn more about cart attributes here: https://shopify.dev/docs/api/storefront/latest/objects/Cart#field-Cart.fields.attributes
You can retrieve the current Promi cart attributes on the storefront via the global variable window.Promi.cartAttributes. This object is of type Record<string, string> and represents all Promi attributes that must be attached to the cart.

Backend cart creation
If you create carts programmatically on the backend (for example, via the Storefront API):
  • Retrieve window.Promi.cartAttributes on the storefront.
  • Pass the full object to your backend.
  • Include all key-value pairs in the cart creation request under the cart’s attributes field.
Each key in cartAttributes should map to a corresponding cart attribute.

Cart permalinks 
Cart Permalinks are links that bring a visitor directly to Shopify with specific items already in the cart. Under the hood, a cart permalink creates a new cart, which means cart attributes must be attached at link creation time.
For shops using cart permalinks, the following JavaScript example shows how to append Promi cart attributes to an existing cart permalink stored in the variable permalink:
// Split path and existing query string
const [path, query = ''] = permalink.split('?');
const params = new URLSearchParams(query);

// Append Promi cart attributes
const attrs = window.Promi?.cartAttributes || {};
for (const [key, value] of Object.entries(attrs)) {
  if (value == null) continue;
  params.set(attributes[${key}], String(value));
}

const qs = params.toString();

// Final permalink with Promi attributes attached
const permalinkWithPromiAttrs = qs ? ${path}?${qs} : path;

Important notes
  • Promi cart attributes may change over time. Always retrieve them immediately before cart creation.
  • To validate your integration, enable a Promi discount that applies to all customers and confirm that the discount appears at checkout. If the cart attributes are passed correctly, the discount should apply automatically.

‹ Getting Started

Best Practices ›