PayPal and Authorize.net

Support
,
#1

What is the best way to add PayPal to my static website when Authorize.net is already set up as my payment gateway?

#2

Hey @howtodothis,

Once Authorize.NET is configured, you can scroll down in the payment gateway section of the merchant dashboard, you’ll see PayPal Checkout:

image
image1057×273 18.3 KB

Click on the Configure button to set your PayPal account information, then make sure to turn it on. This will add PayPal as a payment method for your customers during checkout.

#3

Hi Charles,

Thank you for your help but unfortunately this did not work. While a message appeared that said “Your PayPal account has been configured successfully” and the PayPal Checkout button is set to “ON”, PayPal is not showing up in our cart as a payment option. Only Visa and MasterCard is displayed. Is there something I missed?

Connie

#4

Hey @howtodothis,

Can you share your website URL? We’ll take a look at this.

#5

Hi Charles,

Thank you so much. It’s spiritofeighthorsehealth.com. Things are working well so far and we are live with one credit card order that went through properly. To add PayPal, the owner of the PayPal account for this business went through the steps on your instructions page to grant permission. Then at this point on the page: Configuring PayPal Express Checkout, I logged in and tried to connect. It looked like everything was fine but I don’t see the PayPal option in the cart.

Connie

#6

Hey @howtodothis,

I just tested on your website, and PayPal is available, but there are some visual glitches related to your customizations:

image
image921×372 11.1 KB

I also tested the button and I was redirected to PayPal as expected.

#7

Thank you. I see it! It’s slipped down from view as you noted, however. Something is causing it to go below its proper place. As this page is just html/css/javascript, would you know where the problem could be stemming from?

#8

Looks like a conflict with your own CSS rules. I’d recommend using your browser developer tools to inspect the different CSS rules applied to these elements.

#9

I can find no conflict in my code. Is there a way that I can edit the html code provided by Snipcart that is pasted at the bottom of my store page i.e. is there a way to add more room at the bottom of the checkout page by editing Snipcart’s html code that is pasted in? See the screenshot you made. Snipcart is supposed to work on any website. If it doesn’t, in this case if the display is messed up, can you suggest basically how I can increase space so the page displays properly (this being a Snipcart page I don’t have access to).

#10

Hi @howtodothis,

I just looked at your css and you have the following code. The float: right is causing the visual issue.

button {
	background-color: cornflowerblue;
	color: white;
	font-size: .75em;
	font-weight: 600;
	border-radius: 5px;
	cursor: pointer;
	padding: .1em 1em .1em;
	border: none;
	display: block;
	margin-left: auto;
	margin-right: 0;
	float: right;
}