Skip to content
English - United States
Contact Us
  • There are no suggestions because the search field is empty.

PayPal Pay Later Messaging On Products for V1

PayPal Pay Later Messaging
Adding PayPal Pay Later Messaging to your Volusion store lets your customers know all their payment options.

PayPal Pay Later messaging is added to your store via a script that is loaded to your site's template file. To add the script, follow these steps:

Adding the PayPal Messaging Script

From your store's Admin Dashboard, choose Design > File Editor from the drop-down menu.

The location of the File Editor option in your Volusion admin dashboard. File Editor is an option listed under the Design tab in the main navigation menu at the top of the dashboard..

On the File Editor page, choose the Theme File by clicking its link in the Shortcuts Menu. Your template number will vary, depending on the theme you are using for your store.

The shortcut link to your template found in Design, File Editor

In the template file, scroll down to the bottom of the code and locate the Body Closing Tag. The Body Closing Tag is located at the very bottom of the HTML code.

The location of the closing body tag is usually towards the bottom of the code in the template file.

Copy and Paste the following script directly Below the Body Closing Tag.

<script>
const addPayPalMessagingWithPrice = () => {
const priceSpans = document.querySelectorAll('span[itemprop="price"]');
if (priceSpans.length === 1) {
const priceString = priceSpans[0].getAttribute('content');
const pricingDiv = document.querySelectorAll('div[itemprop="offers"]')?.[0];
const pricingTable = pricingDiv.querySelectorAll('table')?.[0];
if (pricingDiv && priceString && pricingTable) {
const messagingDiv = document.createElement('div');
messagingDiv.setAttribute('style', 'margin-top:12px;');
messagingDiv.setAttribute('data-pp-message', '');
messagingDiv.setAttribute('data-pp-style-layout', 'text');
messagingDiv.setAttribute('data-pp-style-logo-type', 'inline');
messagingDiv.setAttribute('data-pp-placement', 'product');
messagingDiv.setAttribute('data-pp-style-text-color', 'black');
messagingDiv.setAttribute('data-pp-amount', priceString);
if (pricingTable.nextSibling) {
pricingDiv.insertBefore(messagingDiv, pricingTable.nextSibling);
} else {
pricingDiv.appendChild(messagingDiv);
}
}
}
}
addPayPalMessagingWithPrice();
</script>

Once you have added the script, click the Save button to save your changes.

If you have not turned on Enable Immediate Publish variable in Settings > Config Variables, you will need to Publish your changes. To publish you changes, click the blue Publish button located on the right side of the Admin Dashboard drop-down menu.

The publish button is located to the far right of the topmost navigation menu and appears when changes are made to the content or design of the site.

If you do not see the Publish button after saving your script, then your likely have the Enable Immediate Publish variable checked. No further action is needed.

Testing the PayPal Messaging Script

To test the script and make sure that it is showing the correct messaging, once you have added and saved it, navigate to a product with a price that qualifies for the PayPal Pay Later program. This threshold is set by PayPal, but should be for items over $40.00.

The product should show the correct PayPal messaging.

If the price breakdown is not accurate (price/4) or the position is not optimal, please contact us.