Menu icon Foundation
Foundation button with paypal code

I am making a photography website and beneath each package list I have a button. I want that button to lead the customer to a paypal cart. I want to use the foundation provided button to accomplish this but I do not know how to attach the paypal code to the button for it to work.

Any help will be greatly appreciated!

<div class="row">
            <div class="large-3 columns text-center">
         <a class="tiny round alert button">Choose</a>
         	</div>
</div><!--end row-->
            

         

Paypalbutton

I am making a photography website and beneath each package list I have a button. I want that button to lead the customer to a paypal cart. I want to use the foundation provided button to accomplish this but I do not know how to attach the paypal code to the button for it to work.

Any help will be greatly appreciated!

<div class="row">
            <div class="large-3 columns text-center">
         <a class="tiny round alert button">Choose</a>
         	</div>
</div><!--end row-->
            

         
Lyn over 5 years ago

Glad to know :)

Rejji Fubara over 5 years ago

Thank you again...it works perfectly..

Lyn over 5 years ago

Hi Rejji,

There you go : http://jsfiddle.net/gDL4H/

<form action="https://www.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="DFD84E35U4YJ8" />
    <ul class="pricing-table">
        <li class="title">Standard</li>
        <li class="price">$99.99</li>
        <li class="description">An awesome description</li>
        <li class="bullet-item">0-Text on photo</li>
        <li class="bullet-item">Shoot time-One hour</li>
        <li class="cta-button"><input type="submit" class="tiny round alert button" name="submit" value="Choose" />
        </li>
    </ul>
</form>

Kind regards,

Lyn.

Rejji Fubara over 5 years ago

Hi Lyn,

I just realized that I might have the wrong type of button so I added the button as a list item with a class of cta-button. How would I integrate the PayPal code since its a list item now.

        <li class="bullet-item">0-Text on photo</li>
    <li class="bullet-item">Shoot time-One hour</li>
        <li class="cta-button"><a class="tiny round alert button" href="#">Choose</a></li>

Lyn over 5 years ago

You're welcome Rejji !

Feel free to ask if you need more help ;)

Regards,

Lyn.

Rejji Fubara over 5 years ago

Thank you guys for all your help...It worked!. except for my buttons flopping all over the place..lol the code is fine and does what I want.

Lyn over 5 years ago

Hey there,

You can do just as Joshua said (and even remove the img tag).
Here is the code with the button you wanted :

<div class="row">
    <div class="large-3 columns text-center">
        <form action="https://www.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="DFD84E35U4YJ8" />
            <input type="submit" class="tiny round alert button" name="submit" value="Choose" />
        </form>
    </div>
</div><!--end row-->

Regards,

Lyn.

Rejji Fubara over 5 years ago

This is the paypal button code

<form action="https://www.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="DFD84E35U4YJ8">
<input type="image" src="https://www.paypalobjects.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.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>

Lyn over 5 years ago

Hey there,

It's been a long time I haven't work with Paypal and don't have much time to take a look at there docs again. And it seems there's a new way of doing it now.

Could it be possible to give us the Paypal code we have to integrate with that button ?

Regards,

Lyn.