UI Configuration Options

Each of the following configuration options can be made by adding props to the m-add-to-cart div, within the theme's snippets/manifold-campaign-widget.liquid file.

The Shopify Gate can show an OpenSea link to get NFTs if you are on a product page and you don't have any qualifying NFTs. To display and configure the link location, simply add the prop:

data-opensea-collection-slug="<YOUR_OPENSEA_SLUG>"

The OpenSea slug is the string which leads to your collection. For example, the slug "replicator-by-mad-dog-jones" will result in a link to https://opensea.io/collection/replicator-by-mad-dog-jones

Campaign Confetti

Whenever a product is added, we show a confetti animation. By default, they are the 👕 and 🧢 emojis. You can change this to your own emoji by adding the prop:

data-add-to-cart-emojis="<CONFETTI_EMOJI>"

You can disable the confetti by adding the prop

data-no-emojis="true"

Refreshing non-Dawn Theme Cart Counters

If you've implemented your own cart icon and want the counter to refresh whenever a product is added, it must be a liquid Section. To get this Section counter to refresh, add the prop:

data-cart-icon-section="<YOUR_SECTION(S)_COMMA_SEPARATED>"

This will cause the section to update whenever the cart is updated. For reference, the default Dawn theme section is called "cart-icon-bubble" and can be found under "Sections: cart-icon-bubble.liquid". Please check this out to see how they show cart counters.

Make sure your div id is the same as your section name!

Redirect To Cart Page When Items Are Added

You can force a redirect to the cart page when an item is added. To do this, add the prop:

data-redirect-to-cart="true"

Force Reload When Items Are Added

You can also force a page reload when items are added. To do this, add the prop:

data-reload-page-on-add-to-cart="true"

Using Custom Product Properties

You may want some custom properties for your products (e.g. an Engraving message). If you have added a custom input property field, you MUST configure the Merch Bridge to know about these properties. To do this, add the prop:

data-product-properties="your-property-field-id"

Make sure the property field id you are using matches the id of the input field of the property.

You can add multiple properties by putting a comma separated list of property field id's.

Changing Text of Buttons

The text of the various buttons can be changed as well. The props to configure are:

data-add-to-cart-text: Default "Add to Cart"

data-apply-discount-text: Default "Apply Discount"

data-nft-available-title: Default "Discount Available"

data-nft-available-message: Default "LFG! Apply Discount for more info"

data-nft-eligible-title: Default "NFT Discount Eligible"

data-nft-eligible-message: Default "Use "Connect Wallet" button to apply discounts"

data-no-eligible-tokens-message: Default "You don't have eligible tokens."

data-no-eligible-tokens-title: Default "Token Exclusive"

data-checkout-text (applied to m-checkout): Default "Checkout with NFTs"

data-clear-cart-text (applied to m-checkout): Default "Clear Cart"

data-already-existing-checkout-message (applied to m-checkout): Default "Already existing checkout, click here to complete."

Last updated