Skip to main content

Create or edit an online payment form

Create a payment form to enable customers to buy goods and services online. You can link your payment form to the University's online payment service, the Transaction Tracking System (TTS). There are two options for creating a payment form:

The University does not currently have an online shopping cart facility.
Important: Please ensure you read and/or complete all steps in this process to ensure the payment form is set up successfully:

  1. Apply for a University trading account
  2. Create an online payment form
  3. Fixed price option
  4. Custom payment option
  5. Add any amount option
  6. Form properties
  7. Payment confirmation

1. Apply for a University trading account

To use the online payment service, you first need to apply for a trading account.

  1. Read the information about operating a trading account.
  2. How to apply for a trading account.

    For assistance and advice about applying for a trading account, contact Peter Robinson (WCG Directorate). Please note the process of setting up an account can take some time, depending on the type of account required. It could take up to three weeks.

Once you have a trading account and you're familiar with the online payment processes, you can create a payment form on your website using SiteBuilder.

2. Create an online payment form

  1. Create a standard form containing your required fields (see the related FAQ on how to create a form).
  2. Go to the form you have created to turn it into a payment form.
  3. Select Edit > Edit formsbuilder page or Edit this form at the bottom of the page.
  4. In the Modify the form section on the left-hand side, select Online payment:

    Modify form options

  5. The Configure an online payment form screen appears:

    Configure online payment form

  6. Select the Enable online payment box at the top of the page.
  7. Enter your Trading account ID. The Finance Office provide you with this after you apply for a TTS trading account. It's a long number containing numbers and lower case letters. Take care to enter it correctly.
  8. Use the radio buttons to choose your pricing options.
  9. Select the Save button.

3. Fixed price option

Fixed price means that you are selling one item at a price that does not vary. If you wish to use the Fixed price option, select the radio button and enter the amount in the Price field in pounds and pence e.g. 25.00. Do not include the pound sign.

Note that with fixed price, the cost is not displayed on the form. To help the user, you could provide a visual clue about what they are purchasing and the price. E.g. a single line text box showing the price and marked ‘view only’, which ensures the user cannot edit the price:

Fixed price field

4.Custom payment option

If you want a list of different items with different prices, then choose Enable custom payment option.

Note: although your customers can only select one item from a particular list, you can add as many drop-down lists (with different selections) as you like as part of the same transaction. The transaction value will add up all the amounts from the different lists for you.
  1. To enable customers to pay for different items at different prices, ensure you choose Enable custom payment options in Edit > Edit formsbuilder page > Modify the form > Online payment.
  2. The custom payment options are now available in the list of options under Modify the form. Select the Custom payment link. You should now see the following screen:

    Add or edit a custom payment element form

  3. Give the custom payment a name by entering it in the Field name box.
  4. Enter any instructions to the customer in the Label field.
  5. In the Options section, enter the price of the first item in pounds and pence in the Cost field e.g. 35.00. Do not include the pound sign.

    Cost and description fields for each item

  6. Add a Description. The price you have just entered in the Cost field does not display on the form to the customer. So, you could include the full price for the customer in the description field as well – for example:

    1 x night accommodation = £35.00

    2 x nights accommodation = £70.00
    3 x nights accommodation = £105.00

  7. Select the Add new item button to add the next item. Continue adding new items to complete your first list.
  8. To create a different set of options or new list, start again with a new Add/Edit a Custom payment element. Use as many different payment fields as you need. For example, a conference payment form could have separate elements for conference fees, accommodation and food.
  9. Optionally, enter a Pre-selected item as the default. If this field is empty, a blank choice (---) is displayed to the customer in the payment options drop-down menu.
  10. Specify whether this payment field is Required or optional by (un)selecting the Required checkbox. When a payment field is set to Required, the customer cannot submit the form without choosing an option from the required field. For example, a conference payment form could have a required payment field for ticket registration and optional payment fields for accommodation or food.
  11. If you want the customer to be able to see the total cost of all payments (probably advisable as this also provides a record for you on the form submission), select the Show transaction total checkbox. The transaction total is displayed at the end of the payment form, so it doesn't matter which payment field you add it to – but you only add it once.
  12. Once you've finished setting your custom payment options, select the Save button. The published view looks like this before the customer makes their selection:

    Please choose your accommodation drop-down with three options

    …and like this (with the transaction value added) once they have made their choice:

    Please choose your accommodation with one option selected

  13. When the customer submits the payment form, they are automatically taken to the secure online payment screen to enter their card details and complete the payment.

5. Using the ‘Allow any amount to be entered’ option

This enables people to make a donation to the value of their choice e.g. for the Giving or Alumni departments. You can use it too for varying amounts which you cannot specify. For the most part though, you will probably want to control the amounts people pay you and for what.

To use the option, you need to do three things.

  1. Select the Allow any amount to be entered checkbox at the bottom of the page.
  2. The form does need some value in the Cost and Description fields, in the Options section, otherwise the form does not save and will generate an error message. Enter a value in the Cost field. It doesn't matter what it is (the customer will not see it) so e.g. 00.00 (pounds.pence) is fine.

    Forms - online payment - add any amount

  3. Provide instructions to the customer in the Description field. In the published view they see, they will need to select Other from the drop-down menu and then enter their cash amount in the Other field. So, tell them explicity what to do – for example:

    Select Other from this drop-down menu, then enter the amount you wish to donate in the Other field, e.g. 24.99.

6. Edit form properties

Once you have created/edited your form and set it up as you require, it's essential that you edit the form properties to ensure your form functions as you intend it to.

7. Payment confirmation

  1. You also need to create a Payment success page to inform people that their booking or payment was successful. This is a standard SiteBuilder page. You could create this under the payment form or anywhere on your site. (Hide it from users by unselecting Show in local navigation in Edit > Edit page properties.)
  2. When you have a trading account, you will be given access to the TTS (Transaction Tracking System) to manage your account at https://onlinepayment.warwick.ac.uk/payments
  3. Ensure that the success page has correctly been set up in the TTS.

    Note: It is very important that you carry out the two steps – creating a payment success page and setting it up correctly in the TTS system. This ensures that TTS and SiteBuilder are talking to one another. If you don't do this, the user will get an error message because there is no page to redirect the user back to after payment is complete. So, although the money will be taken, the customer is unaware that the process is complete.
  4. If you wish to offer users an email receipt of their form submission, ensure that the email field on your form has the label email.
  5. There is a feature in SiteBuilder which enables you to test prior to making your form live, so you may want to look at the notes on testing your payment form integration in the first instance. The account will default to test (if it's new) so it's important to complete the setup and testing process for the account to be made live. Once the test is complete, you then need to change your form in TTS to be live too.

Related links

Online payment and TTS (Transaction Tracking System) 

Forms FAQs

Form properties

Support

Telephone 73737
Email webteam at warwick dot ac dot uk
How to report a problem