如何集成 SeedProd 按钮和定价表

本文档将向您展示如何让 SeedProd 的定价表或单个按钮与 WP Simple Pay 的站内叠加表单和站外 Stripe Checkout 页面协同工作。

准备您的 WP Simple Pay 表单 + 检索用于使用的短代码

要完成本教程，您需要已创建好付款表单。我们还假设您已准备好 SeedProd 按钮或定价表。

要完成此设置，您需要从 WP Simple Pay → 付款表单 管理后台复制表单的短代码。

链接 SeedProd 按钮到 WP Simple Pay

在 SeedProd → 着陆页 菜单中，选择您想要使用的定价表/按钮所在的页面，这将加载拖放编辑器

接下来，在每个定价表按钮下方添加一个 短代码块。这里我们将处理“购买银牌套餐”按钮。在左侧列表找到 短代码块，将其拖到相应按钮下方并放置好。

点击已创建的橙色高亮区域中的 输入您的短代码 文本。这将打开短代码块编辑器。

短代码文本区域最初是空白的。现在只需粘贴您在本文开头复制的短代码。您的短代码很可能包含与此处显示的不同的 ID 号。

然后，您需要将以下代码复制并粘贴到新的一行，放在短代码下方：

<script> 
( function( $ ) {
var ids = [ '24' ];

// Do not modify.
ids.forEach( function( id ) { $( 'a[href~="#form-' + id + '"]' ).click( function( e ) { e.preventDefault(); $( '.simpay-form-' + id + ' .simpay-payment-btn' ).click(); $( '#simpay-modal-control-' + id ).click(); }); });
})( jQuery );
</script>
<style> 
.simpay-form-wrap { display: none; } 
</style>

确保您的短代码中的 ID 号已在 var ids 区域中输入，如图所示。

只剩最后一步，您就完成了！

点击您想要使用的定价表按钮；在此示例中，是“购买银牌套餐”按钮 – 这将打开该按钮的设置面板。

在 按钮链接 字段中输入 #form-24。 在下面的示例中，您需要 将 24 替换为您表单的 ID。

完成后，点击右上角的绿色大 保存 按钮。

当您为每个定价表按钮重复上述过程后，可以点击 保存 右侧的向下箭头，然后选择 发布。您的定价表现已上线。

您的按钮已设置为启动您的 WP Simple Pay 表单。