如何在网站创建‘Pay with PayPal’按钮并修改按钮显示文字

你现有按钮能正常使用，但需要把显示文字从“Add to Cart”改成“Pay with PayPal”，可以分两种场景处理：

一、修改传统表单式按钮 #

你当前的代码里用了PayPal的“Buy Now”样式图片按钮。要换成“Pay with PayPal”的按钮，只需要替换按钮图片的地址，同时去掉代码里单独添加的重复文字（<font>Pay with PayPal</font>）。

修改后的表单代码示例：

<p><font size="4" color="#000000">3 day pass to Mr. Scanner databases  $15.00</font></p>

<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
  <input type="hidden" name="cmd" value="_s-xclick">
  <input type="hidden" name="encrypted" value="-----BEGIN PKCS7----- ... -----END PKCS7-----">

  <input type="hidden" name="item_name" value="3-day pass to Mr. Scanner databases">
  <input type="hidden" name="amount" value="15.00">
  <input type="hidden" name="business" value="user@example.com">
  <input type="hidden" name="currency_code" value="USD">
  <input type="hidden" name="button_subtype" value="services">
  <input type="hidden" name="no_note" value="0">
  <input type="hidden" name="no_shipping" value="0">
  <input type="hidden" name="rm" value="1">
  <input type="hidden" name="return" value="https://www.example.com/return.html">
  <input type="hidden" name="cancel_return" value="https://www.example.com/cancel.html">
  <!-- 替换为PayPal官方“Pay with PayPal”样式的按钮图片地址 -->
  <input type="image" src="【替换为PayPal官方按钮图片URL】" border="0" name="submit" alt="Pay with PayPal">
  <img alt="" border="0" src="【替换为PayPal像素跟踪图片URL】" width="1" height="1">
</form>

你可以登录PayPal商家后台，在创建按钮的界面选择“Pay with PayPal”样式的按钮，复制对应的图片地址替换到上述代码中。

二、修改智能按钮（JS SDK） #

如果你想用代码里的<div id="paypal-button-container"></div>这种智能按钮，需要先获取你的PayPal客户端ID，然后加载SDK并配置按钮文字。

完整代码示例：

<p><font size="4" color="#000000">3 day pass to Mr. Scanner databases  $15.00</font></p>

<div id="paypal-button-container"></div>

<!-- 加载PayPal JS SDK，替换为你的客户端ID -->
<script src="【替换为PayPal JS SDK地址，带上你的client-id参数】"></script>
<script>
  paypal.Buttons({
    // 创建订单
    createOrder: function(data, actions) {
      return actions.order.create({
        purchase_units: [{
          amount: {
            value: '15.00'
          },
          description: '3-day pass to Mr. Scanner databases'
        }]
      });
    },
    // 订单完成后跳转回你的网站
    onApprove: function(data, actions) {
      return actions.order.capture().then(function(details) {
        window.location.href = 'https://www.example.com/return.html';
      });
    },
    // 配置按钮显示文字为“Pay with PayPal”
    style: {
      label: 'payWithPayPal'
    }
  }).render('#paypal-button-container');
</script>

注意：不要同时保留传统表单按钮和智能按钮，选一种使用即可，避免页面出现重复按钮。

内容的提问来源于stack exchange，提问作者emma