Paypal drop down menu not centered

  • 1
  • Question
  • Updated 5 years ago
  • Answered
My paypal add to cart button with drop down menu doesn't center. I click the 'center' button in the html code area but it just moves the add to cart button while the drop down menu is still lop sided. Help please?
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
  • confused

Posted 9 years ago

  • 1
Photo of Sanja

Sanja

  • 10698 Posts
  • 495 Reply Likes
Hello Erin

Would you mind posting the URL to your page so that we can see what's going on and offer suggestions.
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
My webpage isn't currently online as my stock hasn't been received yet and I've got all my listings up already. But if you can access my page I can put up an example?
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Hi Erin...

Here you go and try to use the center alignment tool in the HTML widget to try and center the Paypal menu that you got from the Paypal website only to find that the menu button centers perfectly but the dropdown part stays to the left alignment.

Looks out of place yes??? Sure it does...

Align that dropdown in three easy steps:

1) Open the HTML editor for the HTML widget which contains your Paypal dropdown menu and locate the place in the code that you see the first <table> appear and directly after it paste <TABLE ALIGN="center">

So the code begins looking like this:

<!--

<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="0000000000000">
<table>

<tr><td><input type="hidden" name="on0" value="Bulk Licenses 1">Bulk Licenses 1</td></tr><tr><td><select name="os0">
<option value="YOURDROPDOWNHERE</option>
<option value="YOURDROPDOWNHERE</option>
<option value="YOURDROPDOWNHERE</option>
<option value="YOURDROPDOWNHERE</option>
<option value="YOURDROPDOWNHERE</option>
</select> </td></tr>
</table>
<input type="hidden" name="currency_code" value="USD">
<input type="image" src="https://www.paypal.com/en_US/i/btn/bt..." border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pi..." width="1" height="1">
</form>

-->

And ends up looking like this:

<!--

<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="0000000000000">
<table>

<TABLE ALIGN="center">

<tr><td><input type="hidden" name="on0" value="Bulk Licenses 1">Bulk Licenses 1</td></tr><tr><td><select name="os0">
<option value="YOURDROPDOWNHERE</option>
<option value="YOURDROPDOWNHERE</option>
<option value="YOURDROPDOWNHERE</option>
<option value="YOURDROPDOWNHERE</option>
<option value="YOURDROPDOWNHERE</option>
</select> </td></tr>
</table>
<input type="hidden" name="currency_code" value="USD">
<input type="image" src="https://www.paypal.com/en_US/i/btn/bt..." border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pi..." width="1" height="1">
</form>

-->

2) Click the center alignment button in the lower left corner of the HTML widget
3) Click "OK"

That should center both the button as well as the dropdown menu...

Happy site building
Ed

Please share my website with your social networking friends... You can find me with my head in the honey pot here...

Honey Bear Playhomes Tips and Favs in one place... A Honey bear Playhomes Tip ;)
Photo of Vishal Sethi

Vishal Sethi

  • 2 Posts
  • 0 Reply Likes
I got my drop down menu to centre with this code....thanks but now when I click on my paypal button it takes you to this page: https://www.paypal.com/webapps/mpp/merchant instead of a payment summary page like it did before I inputed the code to centre the button and drop down menu...so now the button is not functioning properly...from my research I found making the HTML variables changed "hidden" might solve the problem as it advised you should not write HTML button code for saved buttons and to always use the code Paypal generates...then my research goes on to find they say "however, you can enhance generated code for saved buttons by adding hidden HTML variables that do not affect the transaction amount"...I'm not sure the code I added affected the transaction amount but something went wrong...my site is www.wigchateau.ca
Photo of Vishal Sethi

Vishal Sethi

  • 2 Posts
  • 0 Reply Likes
I think I fixed the problem...I had deleted the drop menu's title...and that may have affected the button's functionality...
Photo of Sanja

Sanja

  • 10698 Posts
  • 495 Reply Likes
Hi Vishal,

We're glad you were able to fix it up!
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Thanks I'll give it a go now. I'm pretty useless with the code and html stuff.
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Bear this in mind Erin... Bear this LOL that gets me every time... LOL

I was pretty much useless with code only a short while ago myself... ;) You can do I am sure of that... It is a simple addition of one little snippet of code... Couldn't be easier. ;)
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Well you Sir have helped me a great deal. I tore down my whole webpage because of that. So thanks :)
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
I'm sorry but it sounds like you are upset??? All I did was to show you how to center the Paypal dropdown... Is everything okay???

I know that adding the little piece of code works because I used it before on one of my sites...
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Had me worried the code didn't function anymore so I double checked on a created Paypal dropdown menu and button via the Paypal website and it does indeed work on my site and center as it once did.... Now I am perplexed as to why you would need to tear down your entire website???

http://www.honeybearplayhomes.com/555...
Photo of Jim Trott

Jim Trott

  • 84 Posts
  • 9 Reply Likes
I think you may be mistaken. I think Erin is saying that they tore the whole webpage down because of the issue, and that you've fixed it.
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Nooo. Because I'm weird and need everything to be perfect and symmetrical I deleted my whole buying page because the box was not centered. That is all :)
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
I tried to post the link I have but the paypal center alignment thing doesn't work for me if I have it right :(
Photo of Marije

Marije, Official Rep

  • 4636 Posts
  • 237 Reply Likes
Hello Erin - if you're trying to post the code, you would need to wrap it in <!-- and --> so it doesn't get interpreted:

<!--
HTML code
-->
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Wow... all it took was one ! to fix it. Amazing :D Thank you
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Well now I have the paypal button working my page wont load. Great!
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Bring me out of my retirement will ya... ;) You're just lucky that I still happen to read a post or two out of habit and as this is one of mine it's probably easier on the reps if I fix it for you.

Erin, I will require a published page to look at to check that the code is correct and to figure out the problem you are having with you button not working.

Before now, I had zeroed out my code on the page I listed above so that the button was inactive but after your last post I added the code as it was produced by Paypal and added the centering snippet I explained above and my button when clicked works perfectly and opens the Paypal cart in a new tab.

If you do a test you will see that it opens properly to the cart and is centered.

http://www.honeybearplayhomes.com/555...

Please publish your site and list your URL so that I can get you figured out so that I can once again disappear into obscurity... ;) If you wish, you can simply password protect your site and list the log-in info here and then after you are squared away you can change the password.
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
http://bitsofbeauty.yolasite.com/

That's my site. If you go to 'jewelry' there is one pic with the drop down menu. I've just left it how it is without adding anything to it cause I don't want to wreck that page as well.
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Can you post the log-in info???
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Really quickly change your login password please for your sitebuilder. All I need is the password protect info...
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Oh crap my bad :| I'm really no good with this stuff huh
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
I did not want your sitebuilder login info as that is not something that you place on the forum. Please if you have not done so already quickly go into your account and change your password to something much harder.
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
All done. Ok, so the site protection thing is;

User: erin
Pass: 1990

but yes my password got changed within about 1min. Sorry :(
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Have you figured it out?
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Erin, In your haste I think that you forgot to add the snippet I provided to your code that you got from the paypal site
<!--

<TABLE ALIGN="center">

-->

I took the liberty of adding it here for you to see so that you can get a better idea of how you should change all your other menu codes.

<!--

<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="CZY57KTLPHNV8">
<table>

<TABLE ALIGN="center">

<tr><td><input type="hidden" name="on0" value="Lengths">Lengths</td></tr><tr><td><select name="os0">
<option value="40cm">40cm </option>
<option value="45cm">45cm </option>
<option value="52cm">52cm </option>
<option value="57cm">57cm </option>
<option value="62cm">62cm </option>
</select> </td></tr>
</table>
<input type="image" src="https://www.paypal.com/en_AU/i/btn/bt..." border="0" name="submit" alt="PayPal - The safer, easier way to pay online.">
<img alt="" border="0" src="https://www.paypal.com/en_AU/i/scr/pi..." width="1" height="1">
</form>

-->

See where I added the

<!--

<TABLE ALIGN="center">

-->

Add this to your future codes as well as ensure that the center justification from step 2 above is selected as the code snippet centers the drop-down and the HTML center justification setting centers the actual button itself. Need both to center both. ;)

Off topic... Is that you on your index page?
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Oh so you put the <!-- before the whole text and --> after the rest of the text?
html just looks like a jumble of mess to me so it's hard to see the difference :(
But not the index girl is a suicide girl. Shes just an icon for the store. Though not long ago I looked similar. Now I'm fresh faced with just 2 nose studs :)
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Oh my gosh I am confused :S I'm so sorry. You're trying so hard and Im like a brick wall. Is there any way you can dumb it down as if you were talking to a 10 year old?
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Sorry no... You copy the code between the <!-- and the --> but leave the <!-- and the --> out of the copy. If you copy the code with the <!-- and the --> then it won't work on your page.

I saw that you finally put your pic up as your avatar then changed it soon after. Couldn't tell if it was the same as your index...
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
I copied and pasted the code and it still isn't centered!

But now my kitty is my profile pic :)
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
I think that you are trying to make me not retire aren't you??? I do rather enjoy helping and sharing all I know but I feel kind of disillusioned as of late on several issues out of my control;)
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Copy the code between the <!-- and the --> but leave the <!-- and the --> out, then paste it directly into an HTML widget on your site.

<!--

<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="CZY57KTLPHNV8">
<table>

<TABLE ALIGN="center">

<tr><td><input type="hidden" name="on0" value="Lengths">Lengths</td></tr><tr><td><select name="os0">
<option value="40cm">40cm </option>
<option value="45cm">45cm </option>
<option value="52cm">52cm </option>
<option value="57cm">57cm </option>
<option value="62cm">62cm </option>
</select> </td></tr>
</table>
<input type="image" src="https://www.paypal.com/en_AU/i/btn/bt..." border="0" name="submit" alt="PayPal - The safer, easier way to pay online.">
<img alt="" border="0" src="https://www.paypal.com/en_AU/i/scr/pi..." width="1" height="1">
</form>

-->

That should work perfectly
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Don't forget to update/republish so I can see if it worked too...
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Retirement is for quitters anyway. But I copied it without the and nothing. It's still left of center. I have no idea why it isn't working :(
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Please publish so that I can see whats going on...
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Published.
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Hello?? :(
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Boy you need instant gratification don't you??? LOL It takes time to figure things out sometimes and seeing as how you got 4 hours out of me today feel happy. ;) Kidding of course LOL

I figured out your centering problems... The style Tastelessly has a "left float" on its content and I have tried countless ways to make the centering paypal button work on the page but its left float outranks the center justification every time.

In the beginning 3 years ago, I too used Tastelessly but after some time I changed to one of the four Burlap styles on the top of the Free styles list. I tried that now with a test site and your code in an HTML widget and what do you know the button and drop down centered itself automatically.

I would recommend that you try one of the Burlap styles so that you need not worry about this again. The style's appearance is so similar to but a little cleaner in my opinion to the Tastelessly style anyway.

Additionally, the style change will benefit your site greatly as the page buttons will be more visible to your visitors.

Give that a try...
Photo of Sanja

Sanja

  • 10698 Posts
  • 495 Reply Likes
ED - you truly are a Champ! Thanks so much for all your help on this thread!
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Glad that it was a style issue and not my code edit as that would definitely not been good to have tens of thousands of sites around the world unhappy that their codes/buttons were not functioning the whole week since I posted the How to center the dropdown menu of a Paypal dropdown menu... A Honey Bear Playhomes tip... thread...

I retested to make sure that it all worked and am satisfied in the end that if the steps are followed as I outlined there should be no problem. I will edit the thread to reflect the fact that it does not work on all style choices though.
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
YAY!!!! I am very impatient as you have noticed. But thank you for figuring it out :D Much appreciated. And don't retire as I need you to be here for my next question, whenever that may be :) Thanks Honey Bear.
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
I have one more question :( Sorryyyy I feel terrible. But how do I change the background colour that's on all the pages? It's a light pink purple colour.
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
To conclude this thread (I hope) when looking at your site I noticed how your items were not even and it kinda threw me off a little. I would recommend using multiple two-column widgets on your jewelry page to not only align the objects but to make each line of images and their corresponding drop-downs even. It is a simple process of doing the following...





Just a thought... ;) Good luck with your site...
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
You can change the background on the Burlap theme by:

1) Clicking "Style" in the toolbar
2) Choose "Edit background"
3) Then click "Choose background"
4) Select your old background from before with the colorful lines.
5) Click "Apply to all pages"
You will need to redo your banner as well... ;)
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Do you mean the column divider widget? I bet you wish you were getting paid for this ;D
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Yes to both LOL...
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
Holy crap you are a genius. I have been trying to figure out how to make everything aligned for AGES!! Wow... wow.. ..
Photo of Ed-a-Torials @ Honey Bear Playhomes

Ed-a-Torials @ Honey Bear Playhomes, Champion

  • 2582 Posts
  • 279 Reply Likes
Glad to help... Back to retirement... Good luck and happy sitebuilding...
Photo of EJ

EJ

  • 43 Posts
  • 0 Reply Likes
ED ED ED ED ED I DID IT :D And it worked :) Super glad.
Photo of didier

didier

  • 2 Posts
  • 0 Reply Likes
Hello...
I am having trouble centering a paypal dropdown list on my webpage as well.
it is Wordpress site and i need the button on the middle of the page...

My page is www.bodyandbalance.com.au and you'll see i just can't center the damn dropdown list..
this is the code of my paypal button... any help would be great...
thanks, Didier

Book the Joy of Life Retreat NOW

Deposit for Twin Room $148.00 AUDDeposit For Deluxe Room $175.00 AUDEarly Bird Twin Room $1,485.00 AUDEarly Bird Deluxe Room $1,755.00 AUD





Photo of didier

didier

  • 2 Posts
  • 0 Reply Likes
I am having trouble centering a paypal dropdown list on my webpage as well...

My page is www.bodyandbalance.com.au and you'll see i just can't center the damn dropdown list..
My Site is a Wordpress site and i need to have a button in the middle of the page.....
this is the code of my paypal button... any help would be great...
thanks, Didier

Book the Joy of Life Retreat NOW

Deposit for Twin Room $148.00 AUDDeposit For Deluxe Room $175.00 AUDEarly Bird Twin Room $1,485.00 AUDEarly Bird Deluxe Room $1,755.00 AUD





Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
As this is a Yola sitebuilder forum it can't offer solutions for other platforms.

Suggest you contact WP on this issue.