This document is provided as a technical resource to all FlexForms users. It is intended to help merchants configure FlexForms and engineer Payment Flows. Some of the advanced options, such as Dynamic Pricing and A/B testing, are mentioned only briefly and you will find instructions on these advanced options in other company documents.
The targeted audience of the Quick Start Guide are Web Developers and Merchants who are setting up FlexForms which are to be used on commercial websites.
Note: For the best user experience, please avoid using Google Chrome when administering FlexForms.
This quick start guide will lead you through the form-creation process in FlexForms. The document was published on August 24th, 2016.
FlexForms is the result of the company's continuous effort of updating our existing legacy forms. CCBill has created a payment flow system that is simple to use, yet full of features. By creating Payment Flows you will engineer a pleasurable customer experience and determine the path your customers take when clicking that first Buy Now! button.
The Sandbox is a test environment in which you create, edit, and perfect your Payment Flows before displaying them to your customers. All Payment Flows are created in Sandbox mode, and external users cannot view Payment Flows in the Sandbox.
When you perfect your Forms and Payment Flows and want to display them to customers, you need to PROMOTE them to the Live Environment. The toggle switch in the upper-left corner of the FlexForms Payment Links screen indicates in which mode you are in.
For now, stay in Sandbox mode until you perfect a Payment Flow.
In order to open the FlexForms System you need to:
This will take you to the FlexForms landing page, on which you can create and edit Payment Flows.
Your Primary Tile is the starting point of your Payment Flow, so you MUST select a Redirect To option.
1. Select New Form, as you do not have any existing forms.
2. Set basic Form settings:
|Enter a Form Name||This will be the name of your Form.|
|Select the Pricing||Assign Price Points to the Form. This will be the pricing offered to customers.|
|Select a Layout||Centered, Right Justified, or Left Justified.|
|Select a Color Theme||Select a predetermined Color Theme.|
3. Optionally, you may want to:
|Set up Special Offers||These are secondary offers which are presented to customers as discounts.|
|Write a Form Description||The Form Description is intended to simplify differentiating between forms. For example, you can enter Denial Form if you intend to use it as a Deny path.|
|Write a Product Description||The description of the product or membership being sold on your subaccount website.|
All of these settings can be modified in the FlexForms Editor at every moment. Pop up the Editor by clicking the Forms Library button in the upper-right corner of the screen. There you can create new forms as well, by clicking the Create New Form button.
Price Points are your existing pricing options which you assign to a Form. To assign a Price Point:
After you have created your Primary Tile, you will see a graphic representation of the Flow.
Edit your Primary Tile by clicking on it. Beside your Primary Tile are Redirect Tiles which are automatically made, and their default state is No Redirect. So, if a customer is declined or approved when making a transaction, they will see the default approval or decline message.
Click a Redirect Tile to modify it.
This is the path customers take when their transaction is approved. The Approval Tile is always below the Primary and Deny Tile. When editing the Approval Path, your options are limited. You can redirect to a URL, or make a URL available for the consumer to MANUALLY click on.
This is the path consumers take when they are declined on a transaction. They will be redirected to the deny path to try again. The Deny Tile is always to the right of the Primary Tile.
To set up a Deny Path:
FlexForms can be modified in terms of appearance and can also be integrated with Google Analytics and other payment processors. To modify advanced options:
With advanced options you can:
As this document tackles the most important steps of launching a FlexForm, advanced options will not be dealt with in detail. For further instructions on advanced form options, refer to the FlexForms User Guide.
However, customizing the visual appearance of a form will be explained in the section below.
CCBill offers predetermined visual themes, but FlexForms can be visually modified to resemble the look and feel of your website. It must be noted that while the visual appearance can be customized, the action fields remain the same, and all visual modifications are subject to approval by CCBill, LLC.
To customize the look of a Form:
|FlexForms Banner Image||Select an image for your banner. It will appear at the top of the Form.||960 x 100|
|Approval Message||Add an image to the approval page.||150 x 270|
|Image 1/2||Topmost and lowermost on Form. Depending on the layout you might not be able to add these images.||150 x 270|
|Promotional Offers||Add images to compliment your promotional offers.||Dimensions vary depending on the number of images and position.|
All uploaded images can be found in the Image Library. Click on the Image Library button in order to pop up the Image Library.
Besides images, adjust the visual appearance of your FlexForm by setting the Color Theme and Card Logos option.
To preview a FlexForm:
The preview represents the major changes you have made.
This is essentially how customers are redirected to a Payment Flow. They click on a Web Widget button or hyperlink to be redirected to the Flow. The Web Widget can be modified to appear as a button or hyperlink with different wording.
In order to push a Payment Flow to Live (meaning to link a Payment Flow to your website) you need to:
Now customers can click on the button or hyperlink in order to open the Payment Flow.
The URLs Library is where you will find every external or internal link you ever added to a Payment Flow. In the URLs Library, you are able to add URLs and customize them. Open the URLs Library by clicking the URLs Library button on the right side of the FlexForms screen.
Advanced Feature: Use the Add Name/Value Pairs to pass information to external links. This is how you can manually set up what you need to make a third-party payment processor work. However, this is an advanced feature and it is not needed for setting up a basic configuration.
While previewing the changes you have made, you can test the CCBill Pay option and experience it for yourself as well. For the initial release of CCBill Pay, however, there are NO dummy accounts. You need to have a real CCBill Pay account in order to log in and test the environment.
If you need any further assistance in setting up FlexForms or if you have any questions regarding FlexForms, contact Merchant Support via email at firstname.lastname@example.org, through an online chat request, or call Merchant Support at 800.510.2859. We offer 24/7 around the clock support.