PDA

View Full Version : Need a little help embedding a PayPal button



Klubhead
Jun 17th, 2010, 01:25 AM
Hello everyone, first time poster here.. just need a little help getting a paypal button to work. I decided to put the entire site (only 9mb) in a zip and upload it to rapidshare so whoever checks it out can get a full look at it..

the only thing im stuck on right now is adding a paypal button below each shirt, whenever i copy/past the code under the picture i'm getting a super stretched out "buy now" button and i'm thinking it's being caused by some css coding.

the site is a template from idesigners, being a template i just cant seem to narrow down the problem.. any helps greatly appreciated! thanks :thumbsup:


site download (the only important html page is index, the rest i haven't messed with yet):
http://rapidshare.com/files/399828185/EnvySite.rar.html

paypal buy button i'm trying to embed:

<form 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="LCMWPRTBPRD7U">
<table>
<tr><td><input type="hidden" name="on0" value="Sizes">Sizes</td></tr><tr><td><select name="os0">
<option value="S">S </option>
<option value="M">M </option>
<option value="L">L </option>
<option value="XL">XL </option>
</select> </td></tr>
</table>
<input type="image" src="https://www.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif" 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/pixel.gif" width="1" height="1">
</form>

optimus203
Jun 17th, 2010, 02:51 AM
Have you tried specifying the width and height of paypal image?

<input type="image" src="https://www.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" width="122" height="47" name="submit" alt="PayPal - The safer, easier way to pay online!">

Klubhead
Jun 17th, 2010, 04:56 PM
Have you tried specifying the width and height of paypal image?

<input type="image" src="https://www.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif" border="0" width="122" height="47" name="submit" alt="PayPal - The safer, easier way to pay online!">

Tryed it but it still won't size up corrently :confused:

thanks though

Squishy435
Jun 17th, 2010, 05:54 PM
Could you send us the code for the entire page, please?

Edit: Sorry - I missed the link. I missed that entire sentence!

Major Payne
Jun 17th, 2010, 08:49 PM
Maybe:


<input type="image" src="https://www.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif"" value="Click here" size="122,47" border="0" alt="PayPal - The safer, easier way to pay online!">

REF: input type="image" (http://webdesign.about.com/od/htmltags/p/bltags_inputimg.htm)

Scriptet
Jun 17th, 2010, 09:33 PM
If that is using DW design view then don't trust it to provide an accurate representation on how it might look in any browser since it can't be relied upon. Sometimes the "live-view" provides a more accurate look, but it's better just to preview your page in your browser(s)...

Klubhead
Jun 18th, 2010, 01:53 AM
Maybe:


<input type="image" src="https://www.paypal.com/en_US/i/btn/btn_buynowCC_LG.gif"" value="Click here" size="122,47" border="0" alt="PayPal - The safer, easier way to pay online!">

REF: input type="image" (http://webdesign.about.com/od/htmltags/p/bltags_inputimg.htm)

thanks man, but it's still coming up incorrectly :confused:



If that is using DW design view then don't trust it to provide an accurate representation on how it might look in any browser since it can't be relied upon. Sometimes the "live-view" provides a more accurate look, but it's better just to preview your page in your browser(s)...
what i normally do it hit f12 to bring it up in firefox, it should show correctly in firefox right?

Major Payne
Jun 18th, 2010, 04:07 AM
Just tried the code in IE and Firefox. They look the same to me. Then I tried your code above and they looked identical to what you are using. Must be something in the CSS that may be causing that problem you are having. Wish you had given a link to the actual page online so I could check with web tools in more detail. Can show you screen shots if you want.

Klubhead
Jun 18th, 2010, 04:37 AM
Just tried the code in IE and Firefox. They look the same to me. Then I tried your code above and they looked identical to what you are using. Must be something in the CSS that may be causing that problem you are having. Wish you had given a link to the actual page online so I could check with web tools in more detail. Can show you screen shots if you want.

i didnt upload it to the actual server yet because of the buttons not working, tho all the files for the entire site are inside the zip file i posted

Klubhead
Jun 21st, 2010, 04:00 AM
any other input?

pxlcreations
Jun 21st, 2010, 08:09 PM
It could be in the CSS... I'll look at it in a while.

pxlcreations
Jun 21st, 2010, 08:39 PM
Ok, your problem is in the CSS.

This part:


input{
border:none;
background:none;
width:283px; height:18px;
font-size:1em;
padding-left:5px;
padding-top:2px
}

Needs to become:


input{
border:none;
background:none;
font-size:1em;
padding-left:5px;
padding-top:2px
}

You see, you have it set up as all input tags would be getting "width:283px; height:18px;" and the buy it now button uses those attributes.

Klubhead
Jun 26th, 2010, 01:35 AM
Ok, your problem is in the CSS.

This part:


input{
border:none;
background:none;
width:283px; height:18px;
font-size:1em;
padding-left:5px;
padding-top:2px
}

Needs to become:


input{
border:none;
background:none;
font-size:1em;
padding-left:5px;
padding-top:2px
}

You see, you have it set up as all input tags would be getting "width:283px; height:18px;" and the buy it now button uses those attributes.

awesomeeeee!! worked man, thanks a lot!!! :thumbsup: