PayPal Element
Sell Goods or Accept Donations

Overview

The PayPal Button is a simple way to sell goods, services or accept donations. The Mame integration offers support for all three types of PayPal Buttons (Shopping cart, Buy now and Donations). The tracking pixel that PayPal usually adds to the form, has been removed for privacy reasons.

As an alternative to the PayPal button you may want to use a paypal.me link.

Usage Examples

  • Sell Services or Products.
  • Simple Shopping Cart.
  • Accept Donations from Visitors.
  • ..

PayPal Button Properties

  1. Button Type: Depending on your use case you need a different button type. Mame supports "Add to Cart", "Buy Now" and "Donate" PayPal buttons.
  2. Recipient Email: The recipient email for the transaction. Should be a PayPal account email.
  3. Item Name: This is shown as payment reference to the user and should describe the good the user buys or the donation target.
  4. Fixed amount: For goods and services you should add a fixed amount to the PayPal Button (Without currency). For donations you may want to keep it empty (0), so the user can decide how much they want to donate
  5. Country Code: Sets the Button and PayPal language, for example de_DE sets the language to German. Default is en_US.
  6. Currency: In which currency do you want to receive the payment? For example EUR changes it to Euro. Default is USD (US Dollar).
Everything else, like styling, may be configured with common general properties. 

See it in action

Generated HTML (Outline)


<div class="mame-element mame-paypal-button" style="..">
   <form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post" style="..">
     <input type="hidden" name="business" value="..">
     <input type="hidden" name="cmd" value="..">
     <input type="hidden" name="add" value="1">
     <input type="hidden" name="item_name" value="..">
      <input type="hidden" name="currency_code" value="..">
      <input type="image" name="submit" src="https://www.paypalobjects.com/en_US/i/btn/btn_buynow_LG.gif" alt="Pay with PayPal" style="...">
   </form>
</div>

Style / CSS Selectors


.mame-paypal-button {
  /* The whole PayPal button element */
}

.mame-paypal-button input[type="image"] {
  /* The PayPal button itself */
} 

JavaScript

PayPal Buttons are implemented in plain HTML 5 and CSS 3. They don't need any JavaScript to work properly.

References / Useful information

Was this article helpful?