The PayPal 'Buy Now Pay Later' (BNPL) feature is now available in the UK. It is possible to add messaging to your website to promote it, with many different options available. For more information see https://developer.paypal.com/docs/bu...mize-messages/
This article gives details of how to enable it in the standard Sellerdeck Desktop layouts, along with a sample message placement. Thought must be given to the messaging that you want to use, and also to the placement in your layouts. Typically messages appear after a short delay so they should be below the fold to avoid triggering a poor 'Cumulative Layout Shift' score in the 'Google PageSpeed' metric, which may penalise your rankings.
Note that this only works when using PayPal Checkout, from version 18.0.5 and version 16.0.8 onwards.
Please Note: To use 'Buy Now Pay Later' you will first need to apply for it, see: https://www.paypal.com/uk/webapps/mp...virtual-credit
Enabling Messaging
Please go to 'Design | Library | Layouts' and scroll down to the group 'JavaScript Header Functions' and expand it, then open the layout 'Standard Javascript Header Functions'.
In the layout that opens, right click and select 'Find' and enter: -
PAYPALSDKLIBRARY
into the 'Search for Text' field and click the 'Find Next in Code' button.
This should then take you to the following code: -
Which appears below the line 'Google Analytics Tracking Code Split SSL'
Highlight this code from the beginning of the 'block if' to the end of '/block' and replace it with the following code: -
and click 'OK' to close the layout, and then close the library.
Example Message Placement
Messages are inserted into your page using a div as per the instructions at https://developer.paypal.com/docs/bu...mize-messages/
As an example, a standard message could be placed into the header. To do this, go to the 'Design' tab within the software, and select 'Content Page' in the 'Select Page Type' drop down box.
Go to the menu 'Window' and ensure that 'Design Tree' and 'Layout Code' are selected, and then go to the bottom right of the panel and click the tab 'Design Tree' and highlight the very top layout in the tree which will be your 'Outer Layout'. In the example used here, the 'Outer Layout' is 'Responsive Outer Layout'.
Move to your left and select the tab 'Layout Code - <OUTER LAYOUT NAME>', in the example used here, it would say 'Layout Code - Responsive Outer Layout'.
Then, wherever you would like the PayPal message to display enter the following layer: -
and click 'Apply' and upload the site.
In the example used here, it was entered just below the 'HeaderArea' layer:
Which produced a display as shown below:
NOTE: There are alternative coding options available given on the PayPal site here: https://developer.paypal.com/docs/bu.../gb/integrate/
This article gives details of how to enable it in the standard Sellerdeck Desktop layouts, along with a sample message placement. Thought must be given to the messaging that you want to use, and also to the placement in your layouts. Typically messages appear after a short delay so they should be below the fold to avoid triggering a poor 'Cumulative Layout Shift' score in the 'Google PageSpeed' metric, which may penalise your rankings.
Note that this only works when using PayPal Checkout, from version 18.0.5 and version 16.0.8 onwards.
Please Note: To use 'Buy Now Pay Later' you will first need to apply for it, see: https://www.paypal.com/uk/webapps/mp...virtual-credit
Enabling Messaging
Please go to 'Design | Library | Layouts' and scroll down to the group 'JavaScript Header Functions' and expand it, then open the layout 'Standard Javascript Header Functions'.
In the layout that opens, right click and select 'Find' and enter: -
PAYPALSDKLIBRARY
into the 'Search for Text' field and click the 'Find Next in Code' button.
This should then take you to the following code: -
Which appears below the line 'Google Analytics Tracking Code Split SSL'
Highlight this code from the beginning of the 'block if' to the end of '/block' and replace it with the following code: -
Code:
<actinic:block if="%3cactinic%3avariable%20name%3d%22IsPayPalCheckoutEnabled%22%20%2f%3e" > <Actinic:PAYPALSDKLIBRARY PAGETYPE="<actinic:variable name="PageType" />"> <script src="https://www.paypal.com/sdk/js?components=messages,buttons&client-id=<actinic:variable name="PayPalCheckoutClientKey" />&integration-date=2020-02-20<actinic:block if="%3cactinic%3avariable%20name%3d%22PageType%22%20%2f%3e%20%3d%3d%20%27Shopping%20Cart%27%20OR%0d%3cactinic%3avariable%20name%3d%22PageType%22%20%2f%3e%20%3d%3d%20%27Checkout%20Page%200%27" >&commit=false</actinic:block>" data-client-token="your-client-token" data-partner-attribution-id="SELLERDECK_Ecom_PPCP"></script> </Actinic:PAYPALSDKLIBRARY> </actinic:block>
Example Message Placement
Messages are inserted into your page using a div as per the instructions at https://developer.paypal.com/docs/bu...mize-messages/
As an example, a standard message could be placed into the header. To do this, go to the 'Design' tab within the software, and select 'Content Page' in the 'Select Page Type' drop down box.
Go to the menu 'Window' and ensure that 'Design Tree' and 'Layout Code' are selected, and then go to the bottom right of the panel and click the tab 'Design Tree' and highlight the very top layout in the tree which will be your 'Outer Layout'. In the example used here, the 'Outer Layout' is 'Responsive Outer Layout'.
Move to your left and select the tab 'Layout Code - <OUTER LAYOUT NAME>', in the example used here, it would say 'Layout Code - Responsive Outer Layout'.
Then, wherever you would like the PayPal message to display enter the following layer: -
Code:
<div data-pp-message></div>
In the example used here, it was entered just below the 'HeaderArea' layer:
Which produced a display as shown below:
NOTE: There are alternative coding options available given on the PayPal site here: https://developer.paypal.com/docs/bu.../gb/integrate/