One-Click Apply Button Customization

How to customize the "One-Click Apply" button for quick store credit redemption

Hila Butbul avatar
Written by Hila Butbul
Updated over a week ago

In this article, we are going to cover-

Please note- this feature is open for our ‘Pro’ plan users and above.

The “One-Click Apply” button

This button will appear in your cart page or in your checkout page (if you are on Shopify Plus), and will present your signed-in customers with their loyalty balance and will allow them to choose to use their credit on the purchase they are creating.

Please note- sometimes the button doesn't automatically appear and you will need to manually implement it (keep reading to learn how).

Implementing and styling the button through the Rise dashboard

In your Rise dashboard go to loyalty assets tab -> One-click apply button.

Here you can customize the text and style of the button and the text that will appear above and inside the button.

In the Body tab, you can change the text that appears in the button (button text) and that appears above the button (body). To change the styling of the text that appears over the button, select the text and use the styling buttons above the text box.

Here, you can also add variables like store credit balance and customer name by clicking on the variable section, copying the variable, and pasting wherever you’d like it to appear.

In the Template tab, you can change both the text in and above the button, as well as change that button’s background color. You can also change the font type and size here.

Activate the button by turning on the toggle on the upper right side. This will activate the button in the cart page in your store.

Changing the button’s location in the cart page

If you’d like to change the location of the button within your cart page, you can add the button’s placeholder in the desired location in your cart.liquid or cart-template.liquid.

<div class="Rise__quick-apply-placeholder"></div>

How to add the button to the cart page if it doesn’t appear

Before you jump in, first check if you answer “yes” to the following statements:

  1. You are on the Rise.ai Pro, Premium or Enterprise plan (the button will not appear for any other plan).

  2. You have logged in to an account with store credit and did not see the One-click Apply button in the cart page (or checkout page if you have Shopify Plus).

Please note that the button will not appear if the customer has no store credit.

If your answers were “yes”, continue reading :)

Manually inserting the One-Click Apply button in the cart page:

  1. Go to your Shopify admin -> Online store -> Themes -> Actions -> Edit code

  2. Search for the cart.liquid (this will likely appear as cart.liquid or cart-template.liquid)

  3. Add the following placeholder in the body:

<div class="Rise__quick-apply-placeholder"></div>

  1. Save!

  2. Empty cache and hard reload your cart page

  3. The One-Click Apply button should now appear! Remember, it will only appear if you have store credit in your account.

Adding the “One-Click Apply” button to the checkout page (Checkout.liquid)

Please note, Shopify is in the process of deprecating the Checkout.liquid. You can find more information about this process here.

If you have already started using the new Shopify Checkout, please refer to the steps in the next section.

To add the “One-Click Apply” button to your checkout page (for Shopify Plus merchants), add the following code before the </head> tag in the checkout.liquid page-

<script>window.RiseStoreFront={customer_id:"{{ customer.id }}"};</script>

Note- where it states “SHOP_URL” in this code, add your store’s myshopify URL (for example- tiny-thorns.myshopify.com).

After adding that code, the button will automatically appear on your checkout page.

Add the button to your checkout page using Shopify's Checkout Extension

Please make sure to activate the One-Click Apply feature through the Rise dashboard (in the Loyalty Assets tab.

To implement the One Click Apply button through Shopify's Checkout Extension first head to your Shopify admin -> Settings -> Customize checkout (for Shopify Plus merchants)

Here go to 'app embeds' and choose the Rise integration.

Here you can customize the appearance of the buttons using the editor customization tools:

It's important to note that in the Rise dashboard, you can customize the text itself but not the style of the button (all the customization of the style will affect the button in the cart and not in the checkout unless you're using the checkout.liquid from the previous section).
Please note that any changes that are done in the Rise dashboard may take a while to update live.

The button will not appear if there is a Rise gift card in the cart, when the code is already applied, or if the subtotal is 0.

We recommend using the new extension and not the checkout.liquid as Shopify is providing greater support for this feature.

Got any feature requests?

Feel free to add them to this feature request form.

Have more questions?

Feel free to contact us at [email protected] or in the chat box.

Did this answer your question?