In one of our previous articles we’ve talked about adding a PayPal button to your website. It's about creating a generic PayPal button, but if you want your button to look a bit different to match the design of your website better, you can use PayPal custom buttons.
In this article, we'll show you how to create a PayPal custom button and implement it on your website. We'll also show you how you can receive payments on PayPal without losing money on fees using a multi-currency account with TransferWise.
As a first step, you’d need to set up an account with PayPal and get API credentials. If you already have both - feel free to skip this section.
If you don’t have a PayPal account yet - go to “How to get started?” section of our article on how to add PayPal to your website for the full guide.
When you’re done setting up your accounts, grab your API credentials and save them somewhere - you’ll need them a bit later
There are 2 ways that you can add and customise PayPal checkout button:
- Quick setup using PayPal portal - no coding required, but basic and limited
- Standard integration - more customisable, but requires coding
Both have their pros and cons and we’ll go over them, describing what are the differences and how to customise buttons using both approaches.
PayPal portal provides a graphical user interface to customise how the button would look like. With a couple of clicks you can change PayPal buttons appearance and when you are happy with it - it’ll generate the code for you that you can copy-paste to your website.
The great thing about this approach is that it doesn’t require any coding. You will create your button by using only the interface that PayPal provides.
The drawback is that it supports only basic features. For example - it is suitable only for selling individual products, meaning that cart features are not supported and customisation options are limited as well¹.
To create button using this approach - follow these steps:
- Go to the PayPal Checkout page in their App Center.
- Scroll down until you see section “Quick setup for individual items”
- Press “Start Setup” button
- Play around with parameters on this page and instantly preview your buttons
- Once you’re happy with it - press “Copy Code”
- Paste it into your website
- In that code you’ve pasted, one script tag will contain a reference to PayPal SDK, which will look something like https://www.paypal.com/sdk/js?client-id=sb¤cy=USD Replace the “sb” part API Client Id with your client id that you obtained when setting up your account, so that it would be client-id=YOUR_CLIENT_ID
- Voilà! You can test your buttons now
This approach is good for it’s simplicity. If you don’t have a need to be able to add your products to the cart and are okay with limited customizability options - this approach would fit you well!
Otherwise, you might want to go with Standard Integration
Even though you are limited in options with this approach, once you generate the code and paste it to your page - it’s not much different from Standard integration and you can continue customising it using PayPal SDK and options that it provides.
Standard integration provides more features and also more customisation options. But it does require coding knowledge.
We’ve talked about basic standard integration in our previous article on How to add PayPal button to your website
If you don’t have a website that’s integrated with PayPal Checkout - you could follow the article mentioned above to quickly build an integration with PayPal.
Otherwise, you could use PayPal’s interactive code demo
It’s time to review the customisation options for buttons that PayPal provides us with.
PayPal button SDK accepts a style options with following properties.²
Set style.color to set the color for the button
Color options are:
- “gold” - default
Set style.layout to change the layout, in case multiple buttons are available
Layout options are:
- “vertical” - default
Set style.size to change the size of the button
By default the buttons adapt to its container, but it’s possible to customize it:
- To change button width - alter the width of the container
- To change the height - set style.height property to value from 25 to 55
Set style.shape to change the shape of the button
Shape options are:
- “rect” - default. Will result in a rectangular button
- “pill” - will result in a button with rounded corners
Set style.label to change the label of the button
Label options are:
- “paypal” - default
|If you’re an international trader, it's essential that you allow payments in your customers’ local currency. This section will show you a cost effective way of receiving international payments on PayPal so if you want to save some money on your sales, pay close attention to this section.|
PayPal doesn’t allow international payments by default so you’d have to enable this from your business account.⁴ But before you do so, add foreign currency accounts for the currencies that you want to receive on PayPal. Here’s how:
- Click on “Money” from the main menu then click “Manage Currencies”
- Select the currency that you want to hold then click “Add Currency”
This feature will allow you to hold funds in different currencies rather than having it converted automatically to your local currency. While that sounds convenient, it can get expensive especially with the conversion fee PayPal charges which usually ranges from 2.5% to 4%.⁵
Now, in order for you to withdraw the funds without having to convert it first, you’ll need a multi-currency account. You can get one from TransferWise to make sure that your funds are always converted at the real market rate without mark-up and with fees that are up to 19x cheaper than PayPal. Conversions with TransferWise are optimised so that the fees can be reduced up to 0.75% on average. This means 1.75% - 3.25% savings for you.
Once your multi-currency account is ready, you can enable international payments with PayPal. Here’s how:
- Log in to your PayPal account
- Go to your business profile and select “Profile and Settings”
- Select “My selling tools”
- Find the “Block Payments” line and click on “Update”
- Find the “Block Payments from users who:” line and make sure that the option that disables payment in different currencies is untick to allow PayPal account holders from other countries to pay you online.
As you can see - PayPal buttons support some customizability.
With their Quick Setup - you have a nice GUI tool at your disposal, but are a bit limited in options.
While Standard Integration might be a bit harder, it will provide more customisation options. And you could use their Interactive Code Environment for testing it out.
This publication is provided for general information purposes only and is not intended to cover every aspect of the topics with which it deals. It is not intended to amount to advice on which you should rely. You must obtain professional or specialist advice before taking, or refraining from, any action on the basis of the content in this publication. The information in this publication does not constitute legal, tax or other professional advice from TransferWise Limited or its affiliates. Prior results do not guarantee a similar outcome. We make no representations, warranties or guarantees, whether express or implied, that the content in the publication is accurate, complete or up to date.
Our guide to same day business bank accounts, for when you need a new account in a hurry. We’ll cover the main providers, plus key things to think about.
The lowdown on Ulster Bank business accounts, to help you find the right bank for you. Read on for all the info on account types, banking services and fees.
All you need to know about the Cashplus business bank account, including features, services and of course, fees.
Your essential guide to Yorkshire business bank accounts, including account types, debit/credit cards and monthly fees.
TSB has one main business bank account – the TSB Business Plus Bank Account. This is particularly suitable for new or smaller businesses, but it has all the fea
follow these simple steps to receive payments from PayPal to TransferWise