Set Paypal As A Secondary Checkout For Your Store



Steps for Creating a Custom Checkout Page Style for PayPal. Note: The steps may vary slightly from your PayPal dashboard (based on your country and language). Login to your PayPal account. Under My Account, click Profile. In the My Selling Tools section (left side), click on Update next to Custom payment pages. Click the Add button.

  1. Set Paypal As A Secondary Checkout For Your Store Online
  2. Set Paypal As A Secondary Checkout For Your Store Bought
  3. Set Paypal As A Secondary Checkout For Your Store Card

PayPal has just introduced one of the first major changes to its checkout process in years. Shiny new branding and checkout page styling options are being rolled out for merchants to take advantage of.

The new checkout pages have been rated faster in usability testing by PayPal which helps tremendously to reduce shopping cart abandonment.

  • The Pay with PayPal with green check mark is static, you can't select it. That Pay Online section shows what methods are available but if you can't change or select default, guess we're stuck with choosing a back up method at checkout. On Payment Review page during checkout, click 'More funding sources' to select a back up.
  • Marking this checkbox will make it so that your shopper can complete the checkout process on PayPal's side but without having to create or log into a PayPal account. Add a PayPal Credit Payment Button Select this option to offer PayPal Credit to your shoppers as they purchase from your store. Click here for details.
  • If you are enrolled in Etsy Payments and PayPal operates in your country, shoppers who buy from your shop have the option to pay with PayPal. If a buyer pays with PayPal, the funds are sent to your Payment account and the payment will be deposited into your bank account. If you have an issue with PayPal, check out the PayPal Help Center.

Also introduced with the update are custom payment page styles which allow PayPal members to include two branded logo images and surrounding border colors displayed as a gradient.

New page styles can be applied to all of PayPal’s eCommerce options:

Set Paypal As A Secondary Checkout For Your Store
  • Buy Now button
  • Checkout button
  • Donation button
  • PayPal Shopping Carts
  • PayPal Website Payments

Follow these simple steps to create a custom style for your PayPal checkout.

Step 1. Navigate to Profile Summary

Step 2. Navigate to Custom Payment Pages

Step 3. Add New Page Style

Step 4. Enter Your Logo Image URLs

Your logo should be resized to 190×60 pixels. It’s a pretty small space, so be sure to eliminate any whitespace in your logo by cropping it first.

The large 750×90 pixel banner image and additional border color options are also available, but are optional.

Step 5. Enter Color Code

You may find the Colorzilla addon for Firefox or EyeDropper extension for Chrome helpful for this step.

Do not include the # sign when pasting your hex color code here.

Step 6. Set Default OR Add Page Style Variable to Code

Once saved, you have the option to make your new custom page style the default for your account.

If you accept payments for more than one business or service, I recommend you add the “page_style” variable to define the name of a style for each of your checkout buttons or shopping cart code.

page_style=”AQDN”

Your PayPal checkout should now feature your logo and accompanying colors. Here’s to a better branded, more seamless checkout experience for your customers!

Are you happy with these improvements? Are you planning on using all of the new page style options or just some? Please leave a comment below with your thoughts or consider sharing this how-to guide with a fellow PayPal merchant.

Store

About Mark Fulton

Mark is the Founder of DotSauce Magazine and a full time web developer, domain investor, SEO and online marketing professional residing in North Carolina, USA. Visit MarkFulton.com for information on freelance website development, SEO and consultation services.

Related Posts


In this article I am going to walk through the process of creating a custom checkout flow for your PayPal customers. I’ll explain how to use it with your PayPal buttons and then at the end I will show you how to add your new custom style for use in WP eStore.

The following screenshot is an example of a custom PayPal checkout page style:

To prepare, you can get a logo and header image ready. PayPal doesn’t host these images for you. You must host them yourself on a secure server (https). If https isn’t used, the checkout will warn the customer that there are insecure elements on the page which will do nothing for their confidence when inputting secure information. So, be sure they are served securely through https.


For the logo, the max size is 190×60 (in pixels) and it is 750×90 for the header image. You will also be asked to specify a few different hex values for colors to match your site. You can use the values from the provided color selector but if you know the exact colors for your site, that will allow for a more uniform look and feel. The Eye Dropper extension for Chrome can help make sure you get exact matching colors. You can just use the eye dropper to select a specific pixel of any web page to learn the hex color value.

Video Tutorial (creating a page style)

Steps for Creating a Custom Checkout Page Style for PayPal

Set Paypal As A Secondary Checkout For Your Store Online

Note: The steps may vary slightly from your PayPal dashboard (based on your country and language).

  1. Login to your PayPal account.
  2. Under My Account, click Profile.
  3. In the My Selling Tools section (left side), click on Update next to Custom payment pages.
  4. Click the Add button.
  5. Choose a unique name for the payment pages style.
  6. Specify the URL for the logo image. Make sure it is on a secure server. It’s optional but shouldn’t be.
  7. Specify the secure URL for the header image.
  8. Input all of the colors that you want to change.
  9. You can then Preview how it looks, then Save when complete.

How to Specify a Custom Page Style When Creating a PayPal Button

Now that you have a new style created, you can make it the primary style and it will be used by default anytime someone goes through the PayPal checkout. To use it as the primary style, follow these quick steps:

1) After saving your custom payment page style you will be brought back to the list of styles. If not, follow the first 3 steps above to get back there.

2) Select the newly created payment pages style and click Make Primary.

Now that payment page style will be used by default.

You can also add a variable to a PayPal button code to use it on a button by button basis. To do that for a new PayPal button follow the steps below:

1) In the Merchant Services section where you create a new button, go through the standard steps to get the button setup first.

2) Then be sure to enter into the optional Customize advanced features section.

3) Scroll to the bottom, turn on the Add advanced variables option.

Set Paypal As A Secondary Checkout For Your Store Bought

4) In the box, type in “page_style={custom_style_name}” without quotes. Replace {custom_style_name} with the name of the style you just created.

5) Create your button!

How to Use Your New PayPal Checkout Style for the Payment Flow from Your WP eStore Setup

Here are the quick steps for setting up the custom page style in WP eStore.

1) Click WP eStore >> Settings.

2) Click Payment Gateway Settings across the top.

3) Scroll down and look for Custom Checkout Page Style Name and enter the style name you just created in there.

4) Click the Update button at the bottom of the page.

How to Use Custom PayPal Checkout Page Style for WP Simple Shopping Cart

Set Paypal As A Secondary Checkout For Your Store Card

Here are the quick steps for setting up the custom page style in Simple WP Shopping Cart.

1) Click Settings >> WP Shopping Cart.

2) Scroll down and look for Custom Checkout Page Style Name Smartscore x pro 10.3.2 for mac download. and enter the style name you just created.

3) Click the Update button at the bottom of the page to save the changes.

Related Posts