Adjusting The Code
4 min
overview when setting up on site exchanges, you can customise the appearance and behaviour of the exchange pop up by editing the provided script this gives you control over which button the pop up attaches to, the colours and images used, and the text displayed to customers while you can also style the pop up using css, this script makes it easy to adjust the essentials the script has been left below for reference breaking down the script here are the key parts of the script and what they control attach this is the css selector for the checkout button where the pop up will be attached to find the correct selector, you can inspect your website’s code and look for the button element used for checkout example below shows a retailer's checkout button is a button with the name set to checkout in this instance, it would be attach 'button\[name="checkout"]' the attach set up is the most important part of the code if this does not work, the customer will be unable to get back to refundid after adding to their cart if you have trouble setting this up, please reach out to merchant support popupbackgroundcolor this sets the background colour of the pop up you can choose any hex colour code that fits your store’s design popuptextcolor this sets the colour of the text displayed in the pop up again, you can use any hex colour code popupimageurl this is the url for any image you want to display in the pop up if you leave this blank, no image will be shown popupmaintext this is the main text displayed in the pop up you can customise this message to let customers know about their credit balance or any other important information popupsubtext this is the secondary text displayed beneath the main text you can use this to provide additional instructions or details popupbuttontext this sets the text on the button within the pop up for example, you might set it to “start shopping” or another call to action editing the script to customise the script, simply edit the values for each of these options for example, you might change the background colour to match your store’s theme or update the text to better fit your brand voice once you’ve made your changes, save the script and the new settings will take effect on your on site exchanges pop up styling the on site css you can customise the look of the on site exchange pop up by editing the css classes below these classes control the layout, image, text styling, and button styling for the pop up customisable css classes refundid popup content refundid popup image refundid popup text content refundid popup total credit refundid popup credit amount refundid popup main text refundid popup sub text refundid start shopping btn