Template Pages

Change the design of your Affiliate Page

Purpose: This HTML template defines the layout of the affiliate system as seen by your shoppers/affiliates when they view their affiliate information page within the "My Account" page.

Note: It is important to preserve the commented tags to ensure the software performs correctly.

For example:

            [affiliate_details]
        <!--START: myAccount-->
        <!--END: myAccount-->
        <!--START: CATEGORY_HEADER-->
            [CONTENT]
        <!--END: CATEGORY_HEADER-->
        <!--START: affiliateStatistics-->
            [affiliate_details-summary]
            [affiliate_summary-header-membersince]
            [affiliate_summary-header-orders]
            [affiliate_summary-header-amount]
            [affiliate_summary-header-commission]
            [affiliate_summary-header-paid]
            [affiliate_summary-header-balance]
          <!--START: affiliateStatisticsNoOrders-->
            [affiliate_no-history-to-display]
          <!--END: affiliateStatisticsNoOrders-->
          <!--START: affiliateStatisticsDetail-->
            [memberSince]
            [orders]
            [amount]
            [totalCommission]
            [paid]
            [balance]
          <!--END: affiliateStatisticsDetail-->
        <!--END: affiliateStatistics-->
        <!--START: affiliatePayments-->
            [affiliate_details-payments]
            [lastDays]
            [affiliate_payments-header-date]
            [affiliate_payments-header-amount]
            [affiliate_payments-header-check]
          <!--START: affiliateNoPayments-->
            [affiliate_no-history-to-display]
          <!--END: affiliateNoPayments-->
          <!--START: affiliatePaymentsDetail-->
            [date]
            [amount]
            [check]
          <!--END: affiliatePaymentsDetail-->
        <!--END: affiliatePayments-->
        <!--START: affiliateAppOrders-->
            [affiliate_details-approvedorders]
            [lastDays]
            [affiliate_orders-header-date]
            [affiliate_orders-header-ordernum]
            [affiliate_orders-header-amount]
            [affiliate_orders-header-commissionperc]
            [affiliate_orders-header-commissionamnt]
          <!--START: affiliateNoAppOrders-->
            [affiliate_no-history-to-display]
          <!--END: affiliateNoAppOrders-->
          <!--START: affiliateAppOrdersDetail-->
            [date]
            [orderNumber]
            [amount]
            [percentCommission]
            [amountCommission]
          <!--END: affiliateAppOrdersDetail-->
        <!--END: affiliateAppOrders-->
        <!--START: affiliateDenOrders-->
            [affiliate_details-deniedorders]
            [lastDays]
            [affiliate_orders-header-date]
            [affiliate_orders-header-ordernum]
            [affiliate_orders-header-amount]
            [affiliate_orders-header-comments]
          <!--START: affiliateNoDenOrders-->
            [affiliate_no-history-to-display]
          <!--END: affiliateNoDenOrders-->
          <!--START: affiliateDenOrdersDetail-->
            [date]
            [orderNumber]
            [amount]
            [comments]
          <!--END: affiliateDenOrdersDetail-->
        <!--END: affiliateDenOrders-->
        <!--START: affiliateLinks-->
            [affiliate_details-links]
            [affiliate_details-link-instructions]
            [store_url]
            [affId]
            [affiliate_details-link-text]
            [store_url]
            [affId]
            [affiliate_details-link-text]
          <!--START: affiliateLinksDetails-->
            [store_url]
            [affId]
            [affBannersFolder]
            [intBannerCount]
            [intBannerCount]
            [intBannerCount]
            [store_url]
            [affId]
            [store_url]
            [affBannersFolder]
            [intBannerCount]
          <!--END: affiliateLinksDetails-->
        <!--END: affiliateLinks-->
        <!--START: CATEGORY_FOOTER-->
            [CONTENT]
        <!--END: CATEGORY_FOOTER-->

Note: Code blocks and their respective variables will only work with specific template pages.

Note: Several of these variables are used in multiple places on the page, with their dynamic content controlled by the code block used in each instance.

  • [affiliate_details] - The heading of the Affiliate Details page. (See Settings ->Design ->Store Language)
  • [affiliate_details-summary] - Display the Title of Affiliate's Info (See Settings ->Design ->Store Language)
  • [affiliate_summary-header-membersince] - Display the Title of when Customer became an Affiliate (See Settings ->Design ->Store Language)
  • [affiliate_summary-header-orders] - Display the Title of Customer's Total Orders (See Settings ->Design ->Store Language)
  • [affiliate_summary-header-amount] - Display the Title of Customer's Order Total (See Settings ->Design ->Store Language)
  • [affiliate_summary-header-commission] - Display the Title of Customer's Total Commission (See Settings ->Design ->Store Language)
  • [affiliate_summary-header-paid] - Display the Title of Customer's Total Commission Paid (See Settings ->Design ->Store Language)
  • [affiliate_summary-header-balance] - Display the Title of Customer's Total Commission Remaining (See Settings ->Design ->Store Language)
  • [affiliate_no-history-to-display] - Display this if Affiliate has no history (See Settings ->Design ->Store Language)
  • [memberSince] - Display date when Customer became an Affiliate
  • [orders] - Display Total Affiliate Orders
  • [amount] - Display Total Affiliate Order Amount
  • [totalCommission] - Display Total Affiliate Order Commission
  • [paid] - Display Total Paid to Affiliate
  • [balance] - Display Total Remaining to be paid to Affiliate
  • [affiliate_details-payments] - Display the Title of Affiliate Payments (See Settings ->Design ->Store Language)
  • [affiliate_payments-header-date] - Display the Title of Payment Date (See Settings ->Design ->Store Language)
  • [affiliate_payments-header-amount] - Display the Title of Payment Amount (See Settings ->Design ->Store Language)
  • [affiliate_payments-header-check] - Display the Title of Payment Check # (See Settings ->Design ->Store Language)
  • [date] - Display the Payment Date
  • [check] - Display the Payment Check#
  • [affiliate_details-approvedorders] Display the Title of Approved Orders (See Settings ->Design ->Store Language)
  • [affiliate_orders-header-date] Display the Title of the Affiliate Order's Dates. (See Settings ->Design ->Store Language)
  • [affiliate_orders-header-ordernum] Display the title of the Affiliate Order's number. (See Settings ->Design ->Store Language)
  • [affiliate_orders-header-amount] Display the title of Affiliate Order amounts. (See Settings ->Design ->Store Language)
  • [affiliate_orders-header-commissionperc] Display the title of the Affiliate payout commision percentage. (See Settings ->Design ->Store Language)
  • [affiliate_orders-header-commissionamnt] Display the title of the Affiliate payout commision amounts. (See Settings ->Design ->Store Language)
  • [orderNumber] Display the Affiliate order numbers.
  • [percentCommission] Display the Affiliate specific commision percentage.
  • [amountCommission] Display the Affiliate specific commision amount.
  • [affiliate_details-deniedorders] Display the Title of the Denied Affiliate orders (See Settings ->Design ->Store Language)
  • [affiliate_orders-header-comments] Display the title of the Denied Affiliate Order comments. (See Settings ->Design ->Store Language)
  • [comments] Display the denied Affiliate Order comments.
  • [affiliate_details-links] Display the Title of the Affiliate Link Area (See Settings ->Design ->Store Language)
  • [affiliate_details-link-instructions] Display your Affiliate link instructions. (See Settings ->Design ->Store Language)
  • [affiliate_details-link-text] Display the labeling of the Affiliate link as it will appear. (See Settings ->Design ->Store Language)

These next few Variables will be autopoulated by the Shift4Shop software. Typically you'll want to keep the scripting for these variables intact.

  • [affid] - This is the specific ID given to the customer's Affiliate record.
  • [affBannersFolder]- This is the default folder where your affiliate banners will be kept. (assets/images/affiliateBanners)
  • [intBannerCount] - The default number given to your affiliate banners.

Download this Template     (Save as a backup or edit to customize)

Screenshot of the home.html Template