Scribd
Upload
81 views2 pages

Dawn-Theme 2

The document provides 3 steps to integrate PayPal Smart Buttons into a Shopify cart page: 1) Add PayPal SDK script to main-cart-footer.liquid, 2) Add PayPal button rendering script to cart-template.liquid, 3) Add the PayPal button container div below the checkout button. It also includes notes on contacting the author for theme-specific help or if using an outdated code sample from a video.

Uploaded by

natan tata
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
81 views2 pages

Dawn-Theme 2

The document provides 3 steps to integrate PayPal Smart Buttons into a Shopify cart page: 1) Add PayPal SDK script to main-cart-footer.liquid, 2) Add PayPal button rendering script to cart-template.liquid, 3) Add the PayPal button container div below the checkout button. It also includes notes on contacting the author for theme-specific help or if using an outdated code sample from a video.

Uploaded by

natan tata
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

Follow below steps to integrate paypal smart buttons in your shopify cart page:

1. Add below script to the top of main-cart-footer.liquid file.

========================= copy code below this ==========================

<script src="https://www.paypal.com/sdk/js?client-id=sb&currency=USD"></script>

========================= copy code above this ==========================

2. Add below script to the end of HTML code of cart-template.liquid file.

========================= copy code below this ==========================

<script>
var cart_data = {{ cart.items | json }};

var custom_item = "";


cart_data.forEach(function(entry) {
custom_item = custom_item + "Item:" + entry.product_title.slice(0, 24);
custom_item = custom_item + "|Quantity:" + entry.quantity;
custom_item = custom_item + "|Variant:" + entry.variant_title + "|";
});
// Render the PayPal button into #paypal-button-container
paypal.Buttons({

// Set up the transaction


createOrder: function(data, actions) {
return actions.order.create({
purchase_units: [{
amount: {
value: {{ cart.total_price | divided_by: 100.00 }}
},
description: custom_item
}]
});
},

// Finalize the transaction


onApprove: function(data, actions) {
return actions.order.capture().then(function(details) {
// Show a success message to the buyer
alert('Transaction completed by ' + details.payer.name.given_name + '!');
});
}

}).render('#paypal-button-container');
</script>

========================= copy code above this ==========================

3. Add below code under the checkout button code (Follow below videos)

========================= copy code below this ==========================


<div id="paypal-button-container"></div>

========================= copy code above this ==========================

<style>
#paypal-button-container {
margin-top: 10px;
}
button[name=checkout] {
display: none;
}
button[name=update] {
display: none;
}
.additional_checkout_buttons {
display: none;
}
/* Media query for desktop viewport */
@media screen and (max-width: 749px) {
#paypal-button-container {
width: 100%;
}
}
</style>

Note 1: If you have any other theme then please contact me I will help you.
Note 2: Please don't use code from the video because that is old

References:

Find client ID:

https://www.youtube.com/watch?v=z4i1yP7WNvk&t=9s

Paypal: https://developer.paypal.com/demo/checkout

Support:

For any technical assistance contact me on:

WhatsApp: +91-9145985880
Email: [email protected]

You might also like