SubscribeMe - Listing the Products

The smListProducts snippet, included in the package, can and should be used to output a list of your products (managed in the SubscribeMe Component).

User Check

SubscribeMe needs the soon to be paying member to already have a user account, so depending on your website structure, you may want to create a registration page before linking to this page. You could also use If to display a user login/registration form, before showing the product list. You can use Register to handle the user registration and making a member only page if you haven't already setup a members area of your website.

Minimum Call

[[smListProducts]]

The minimum call is a functional assuming you have set up a PayPal account, or PayPal Sandbox account properly and have FormIt installed. You must edit the OptionsResource located in the smListProducts.outer file, in order for SubscribeMe to function properly.

Available Properties

You can use all of the following properties in the smListProducts snippet, all of these are also available from the snippets' Properties tab.

This snippet also uses the following system settings for some parts of its behavior:

tplOuter

Default value (from core/components/subscribeme/elements/chunks/smListProducts.outer.tpl):

[[!FormIt?
  &hooks=`smNewSubscription`
  &optionsResource=`4`
]]
<p>Choose the product you would like to subscribe to:</p>
<ul>
    [[+products]]
</ul>

Note: You should NOT edit the default file directly, as future updates will overwrite any changes to this file. It is highly recommended you duplicate the file, or create a chunk with the contents, updating the snippet call, or snippet parameters accordingly.

In your outer template (or near it) you should set up your FormIt call like the above. The optionsResource setting points to the next step in the checkout flow, which is the payment options screen. This ID is used to redirect from the smNewSubscription hook. If you use multiple formit calls and they seem to be conflicting, use unique form IDs, refer to the FormIt documentation.

The smNewSubscription hook contacts PayPal with the product details to set up a token for the transaction, this link will be used in the next page.

The tplOuter chunk only has access to the products placeholder.

tplRow

Default value (from core/components/subscribeme/elements/chunks/smListProducts.row.tpl):

<li style="width: 450px; border: 2px solid #333; list-style-type: none; padding: 15px;">
    <form action="[[~[[*id]]]]" method="POST">
        <input type="hidden" name="product" value="[[+product_id]]" / >
        <input type="submit" value="Subscribe!" style="float: right;" />
        <h3>[[+name]] ([[+currency]] [[+amount_total]] / [[+periods:gt=`1`:then=`[[+periods]] [[+period]]`:else=`[[+period]]`]])</h3>
        <p>[[+description]]</p>
    </form>
</li>

Note: You should NOT edit the default file directly, as future updates will overwrite any changes to this file. It is highly recommended you duplicate the file, or create a chunk with the contents, updating the snippet call, or snippet parameters accordingly.

Unless you're an inline-style lover you'll probably want to change this default. :D

The row template consists of a form posting to itself with a hidden field (name: product) that contains the product_id property and a submit button.

You can already see most of the placeholders in the default, here's a total list:

Displaying the Payment Methods

The next step in the checkout process is the payment methods page. You may also optionally disable this page as outlined.