change paypal dropdown to images - html

My paypal form is:
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="hosted_button_id" value="BZDFVPOK8XKQ">
<input type="hidden" name="on0" value="Size">
<input type="hidden" name="cmd" value="_s-xclick">
<select name="os0">
<option>Please Select</option>
<option value="small">small</option>
<option value="medium">medium</option>
<option value="large">large</option>
</select>
<input type="image" src="images/buyitnow.png" style="width:100px; height:30px; padd" border="0" name="submit" alt="PayPal — The safer, easier way to pay online.">
</form>
I want to change the drop down menu into 3 images S, M, L so the user can select an image instead of having to select from dropdown. is this possible

It seems you need radio buttons instead of a drop down menu !
Use CSS to display each radio button as an image. You might need some javascript too.
Try this plugin http://www.thheuer.com/2011/10/jquery-plugins-image-radio-buttons/

Related

Paypal add to cart button html for handling_cart options

I am OK at html but new to PayPal.
I want to be able to use a Paypal button directly from my site without having to use a third party shopping cart.
The only problem I have is that I am in the UK and Paypal do not offer postage/shipping options here dependent on where you are shipping to. So for instance PayPal's standard buttons would not allow me to charge different postage whether I was sending the product to the US or just a nearby town.
They allow you to add postage/shipping dependent on the value of the cart only.
So I have been looking at the html variables available for the buttons here https://developer.paypal.com/docs/classic/paypal-payments-standard/integration-guide/Appx_websitestandard_htmlvariables/#id08A6HH0D0TA and at posts on Stackoverflow
I wondered if there was any way of combining the option value.. and ="handling_cart" to do this – please see my working below.
So you would click the add to cart button and from the drop down select the shipping area e.g. UK, Europe, Rest of World. The handling charge on the cart would then reflect the option you chose. Instead of the handling cart value being NNNN it would be the value specified for the option, so for Europe £5.00.
<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="DLNKFJWJGHZFW">
<table>
<tr><td><input type="hidden" name="on0" value="Shipping Options">Shipping Options</td></tr><tr><td><select name="os0">
<option value="UK Second Class + £2.85">UK Second Class + £2.85 £2.85 GBP</option>
<option value="UK First Class + £3.85">UK First Class + £3.85 £3.85 GBP</option>
<option value="Europe + £5.00">Europe + £5.00 £5.00 GBP</option>
<option value="Rest of World + £7.00">Rest of World + £7.00 £7.00 GBP</option>
</select> </td></tr>
<tr><td><input type="hidden" name="on1" value="or call us on +44(0)444444444">or call us on +44(0)444444444</td></tr><tr><td><input type="text" name="os1" maxlength="200"></td></tr>
</table>
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="handling_cart" value="NNNN">
<input type="image" src="https://www.paypalobjects.com/en_GB/i/btn/btn_cart_LG.gif" border="0" name="submit" alt="PayPal – The safer, easier way to pay online.">
<img alt="" border="0" src="https://www.paypalobjects.com/en_GB/i/scr/pixel.gif" width="1" height="1">
</form>
Secondary question: this html gets a straight error from PayPal, probably – among other things - because I am still calling it a hosted button (I think I might need to remove this and somehow link it to the Merchant ID???).
Note I have altered the hosted button id here as I was concerned about security - I might not need to be.
Many Thanks
Allyson
Your hosted button is not formatted correctly to handle the shipping drop down. Also you cannot modify a hosted button it will not work. I have created some sample non-hosted button code as an example of what will work if the shipping calculator is not available in your region.
You will have to update the business value to reflect your merchant id or your email address to test the button code.
<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post" >
<input type="hidden" name="cmd" value="_cart">
<input type="hidden" name="business" value="youremail#email.com">
<input type="hidden" name="lc" value="GB">
<input type="hidden" name="item_name" value="Shipping Options">
<input type="hidden" name="button_subtype" value="products">
<input type="hidden" name="no_note" value="0">
<input type="hidden" name="cn" value="Add special instructions to the seller:">
<input type="hidden" name="no_shipping" value="2">
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="add" value="1">
<input type="hidden" name="bn" value="PP-ShopCartBF:btn_cart_LG.gif:NonHosted">
<table>
<tr><td><input type="hidden" name="on0" value="Shipping Options">Shipping Options</td></tr><tr><td><select name="os0">
<option value="UK Second Class">UK Second Class £2.85 GBP</option>
<option value="UK First Class">UK First Class £3.85 GBP</option>
<option value="Europe">Europe £5.00 GBP</option>
<option value="Rest of World">Rest of World £7.00 GBP</option>
</select> </td></tr>
<tr><td><input type="hidden" name="on1" value="or call us on +44(0)444444444">or call us on +44(0)444444444</td></tr><tr><td><input type="text" name="os1" maxlength="200"></td></tr>
</table>
<input type="hidden" name="currency_code" value="GBP">
<input type="hidden" name="option_select0" value="UK Second Class">
<input type="hidden" name="option_amount0" value="2.85">
<input type="hidden" name="option_select1" value="UK First Class">
<input type="hidden" name="option_amount1" value="3.85">
<input type="hidden" name="option_select2" value="Europe">
<input type="hidden" name="option_amount2" value="5.00">
<input type="hidden" name="option_select3" value="Rest of World">
<input type="hidden" name="option_amount3" value="7.00">
<input type="hidden" name="option_index" value="0">
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_cart_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>

ASP.Net - PayPal Buy now button doesn't work

I have a problem with PayPal integration and I couldn't find an answer...
This is my first time working with PayPal so I am doing it simple.
This is the code of the ordinary "Buy now" button
<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post" target="_top">
<input type="hidden" name="cmd" value="_s-xclick">
<input type="hidden" name="hosted_button_id" value="TJR2EPBLMHYAL">
<table>
<tr><td><input type="hidden" name="on0" value="Сума">Сума</td></tr><tr><td><select name="os0">
<option value="Уплати">Уплати $10.00 USD</option>
<option value="Уплати">Уплати $20.00 USD</option>
<option value="Уплати">Уплати $50.00 USD</option>
<option value="Уплати">Уплати $100.00 USD</option>
<option value="Уплати">Уплати $200.00 USD</option>
</select> </td></tr>
</table>
<input type="hidden" name="currency_code" value="USD">
<input type="image" src="https://www.sandbox.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.sandbox.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>
And I'm geting Error on Sandbox.paypal page
"PayPal cannot process this transaction because of a problem with the seller's website. Please contact the seller directly to resolve this problem."
I'm testing on Localhost.
The button is generated on sandbox seller's account.

Use Dropdowns with PayPal Subscriptions for 'A3' Parameter

I'm trying to do something like the following in order for the user to select their recurring subscription plan.
I keep getting the following error in PayPal when trying to submit this form:
'Invalid Regular period. You must specify valid values for the A3, P3, and T3 parameters for a subscription.'
I've specified the A3, P3, and T3 params in the form, so I'm not sure what's going on. Can someone help? Thanks in advance!
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_xclick-subscriptions">
<table>
<tr><td>Frequency</td></tr><tr><td>
<select name="a3">
<option value="438.00">Every 2 weeks: $438.00 USD - monthly</option>
<option value="219.00">Every 4 weeks: $219.00 USD - monthly</option>
<option value="146.00">Every 6 weeks: $146.00 USD - monthly</option>
<option value="109.50">Every 8 weeks: $109.50 USD - monthly</option>
</select> </td></tr>
<tr><td>Coffee Selection</td></tr><tr><td>
<select name="item_name">
<option value="Ethiopian Ground Subscription">Ethiopian Ground</option>
<option value="Colombian Ground Subscription">Colombian Ground</option>
<option value="Colombian Whole Bean Subscription">Colombian Whole Bean</option>
<option value="Guatemalan Ground Subscription">Guatemalan Ground</option>
<option value="Guatemalan Whole Bean Subscription">Guatemalan Whole Bean</option>
<option value="Decaf Ground Subscription">Decaf Ground</option>
<option value="Decaf Whole Bean Subscription">Decaf Whole Bean</option>
</select> </td></tr>
</table>
<input type="hidden" name="business" value="info#lifesongfororphans.org">
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="t3" value="M"> <!-- billing cycle unit=month -->
<input type="hidden" name="p3" value="1"> <!-- billing cycle length -->
<input type="hidden" name="src" value="1"> <!-- recurring=yes -->
<input type="hidden" name="sra" value="1"> <!-- reattempt=yes -->
<input type="hidden" name="return" value="http://www.gobena.org">
<input type="hidden" name="cancel_return" value="http://www.gobena.org">
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_subscribe_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>
Write them in capital letters in your code and see if it works.
<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_xclick-subscriptions">
<table>
<tr><td>Frequency</td></tr><tr><td>
<select name="A3">
<option value="438.00">Every 2 weeks: $438.00 USD - monthly</option>
<option value="219.00">Every 4 weeks: $219.00 USD - monthly</option>
<option value="146.00">Every 6 weeks: $146.00 USD - monthly</option>
<option value="109.50">Every 8 weeks: $109.50 USD - monthly</option>
</select> </td></tr>
<tr><td>Coffee Selection</td></tr><tr><td>
<select name="item_name">
<option value="Ethiopian Ground Subscription">Ethiopian Ground</option>
<option value="Colombian Ground Subscription">Colombian Ground</option>
<option value="Colombian Whole Bean Subscription">Colombian Whole Bean</option>
<option value="Guatemalan Ground Subscription">Guatemalan Ground</option>
<option value="Guatemalan Whole Bean Subscription">Guatemalan Whole Bean</option>
<option value="Decaf Ground Subscription">Decaf Ground</option>
<option value="Decaf Whole Bean Subscription">Decaf Whole Bean</option>
</select> </td></tr>
</table>
<input type="hidden" name="business" value="info#lifesongfororphans.org">
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="T3" value="M"> <!-- billing cycle unit=month -->
<input type="hidden" name="P3" value="1"> <!-- billing cycle length -->
<input type="hidden" name="src" value="1"> <!-- recurring=yes -->
<input type="hidden" name="sra" value="1"> <!-- reattempt=yes -->
<input type="hidden" name="return" value="http://www.gobena.org">
<input type="hidden" name="cancel_return" value="http://www.gobena.org">
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_subscribe_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>
This code ended up working fine. I was running into a caching issue, which is why I kept receiving the error. :)

how to include directions in iframe

I have the following form:
<form method="get" action="http://maps.google.com/maps" target="_blank">
<select name="daddr">
<option selected value="Bovetstrasse 1, 3012 Bern, Switzerland">Missione (a Berna)</option>
<option value="">Zollikofen</option>
<option value="">Bümpliz</option>
<option value="">Ostermundigen</option>
<option value="">Münsingen</option>
<option value="">Konolfingen</option>
<option value="">Worb</option>
</select>
<input type="text" name="saddr" maxlength="255" value="">
<input type="hidden" name="hl" value="it">
<input type="hidden" name="z" value="15">
<input type="hidden" name="t" value="m">
<input type="hidden" name="layer" value="t">
<input type="hidden" name="doflg" value="ptk">
<!--input type="hidden" name="output" value="embed"-->
<button type="submit">Guidami</button>
<p class="Didascalia">Powered by Google</p>
</form>
It opens a new window with the map and the directions on the left side as usual.
What I would like to do is to open this content in an iframe that I have in the same page but
if I symply change the target to the iframe name, I get an error (This content cannot be displayed in a frame. To help protect the security of information you enter into this website, the publisher of this content does not allow it to be displayed in a frame.)
if I also un-comment the output=embed parameter, then only the map is shown with the route but no listing of directions
Does any-one know how to do this?

Pass options via PayPal

I'm creating a simple checkout for a client where the visitor can check out via PayPal. Currently, my HTML form looks like this:
<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post">
<fieldset>
<input type="hidden" name="cmd" value="_xclick" />
<input type="hidden" name="business" value="sandbox#mcbwebdesign.co.uk" />
<input type="hidden" name="item_number" value="29" />
<input type="hidden" name="amount" value="17.99" />
<input type="hidden" name="currency_code" value="GBP" />
<input type="hidden" name="lc" value="GB" />
<input type="hidden" name="item_name" value="Cohda Design Limited: Design Filter Tee" />
<dl id="product_options">
<dt><label for="option_selection1">T-shirt size:</label></dt>
<dd>
<input type="hidden" name="option_name1" value="T-shirt size" />
<select name="option_selection1" id="option_selection1">
<option value="Small">Small</option>
<option value="Medium">Medium</option>
<option value="Large">Large</option>
<option value="Extra Large">Extra Large</option>
</select>
</dd>
<dt><label for="option_selection2">T-shirt colour:</label></dt>
<dd>
<input type="hidden" name="option_name2" value="T-shirt colour" />
<select name="option_selection2" id="option_selection2">
<option value="Machine Gun Grey">Machine Gun Grey</option>
<option value="Blood Red">Blood Red</option>
</select>
</dd>
</dl>
<label for="quantity">Quantity:</label>
<input type="text" name="quantity" value="1" id="quantity" class="numeric" size="2" maxlength="2" />
<input type="submit" value="Buy now with PayPal or credit/debit card" class="button" />
</fieldset>
</form>
As you can see, a simply form that passes a product's details to PayPal for checkout. However, I'm having a problem with custom options, namely option_name1, option_selection1 etc.
How can I pass custom information such as selected size and colour et al to PayPal for the client—and administrator—to view? As currently, testing the above with the PayPal sandbox feature I can't see any where anything pertaining to custom options.
option_selectX is the name of the parameter in the IPN message. What you'll want to add to the button is this:
<input type="hidden" name="on0" value="Size">Size
<select name="os0">
<option value="Option 1">Option 1 $10.00</option>
<option value="Option 2">Option 2 $12.00</option>
<option value="Option 3">Option 3 $13.00</option>
</select>
<input type="hidden" name="option_select0" value="Option 1">
<input type="hidden" name="option_amount0" value="10.00">
<input type="hidden" name="option_select1" value="Option 2">
<input type="hidden" name="option_amount1" value="12.00">
<input type="hidden" name="option_select2" value="Option 3">
<input type="hidden" name="option_amount2" value="13.00">
Just add 'on1' and 'os1' for colours, etc.
You can create a static button to have a look at the generated code through https://www.paypal.com/buttonfactory
I had trouble passing custom variables as well, and found out that it was the naming convention that I was getting wrong (probably due to outdated docs).
I had been trying to use option_name1 and option_selection, and that wasn't working. After I was this post, I tried option_select0 and option_amount0.
But it wasn't until I finally found this page https://www.paypal.com/us/cgi-bin/webscr?cmd=_pdn_xclick_options_help_outside that I realized it should really be on0 and os0 as the option name and option value variable names.
I hope this saves someone some time!
If I recall correctly, the custom options you're referring to are simply passed back by PayPal to the callback. The premise being you then tie that particular payment to a particular order which would then have all the options you require specified.
I'm not sure if you can get PayPal to do anything with them their end.
Additionally, I don't know how much it has changed, but in my experience the PayPal sandbox can differ significantly from real PayPal, worth noting.