Forms for Custom Products

Introduction to Custom Products

Custom products are generally those that are made to the shopper's specific requirements. They will normally be useful only to the shopper that buys them. As an example, a dog collar with the owner's address is only useful to the dog owner.

Forms and buttons for custom products are very similar to the forms and buttons for other products, except that they will normally have one or more text boxes, allowing shoppers to enter the text of their choice. You may also use radio buttons, checkboxes and standard drop-down menus. Custom products also allow you to display the field name (if you want to) and also to separate each field with a comma (if you want to).

We recommend that you follow the instructions on the other pages carefully before creating custom product forms.

You should note that there are some differences between the basic forms and the custom product forms:

1)	You need to use custom[] instead of item - note that the word custom is followed by square brackets with no spaces
2)	You may use only one price per form, regardless of the options chosen for that product
3)	You may display the names of the keys by entering the key name inside the square brackets and using the hidden field showkeys
4)	You may separate keys and values in FastCart with a comma by using the hidden field separator

Custom Products Example Code

The following are just some of the ways you can create forms and buttons for products with custom options. Please look very carefully at how FastCart displays the information.

Basic Custom Product	HTML Code
Blue Widget Green Widget Red Widget Large Medium Small Name:	<form action="http://www.fastcart.co.uk/cart/index.php" method="post" target="_top"> <input type="hidden" name="id" value="1223"> <select name="custom[]"> <option value="Blue Widget">Blue Widget <option value="Green Widget">Green Widget <option value="Red Widget">Red Widget </select> <select name="custom[]"> <option value="Large">Large <option value="Medium">Medium <option value="Small">Small </select> Name: <input type="text" name="custom[]"> <input type="hidden" name="price" value="9.99"> <input type="submit" value="Add to Cart"> </form>
Simple product with multiple drop down menus and a single text entry box

Separated Values	HTML Code
Blue Widget Green Widget Red Widget Large Medium Small Circular Triangular Square Name: Address:	<form action="http://www.fastcart.co.uk/cart/index.php" method="post" target="_top"> <input type="hidden" name="id" value="1223"> <input type="hidden" name="separator"> <select name="custom[]"> <option value="Blue Widget">Blue Widget <option value="Green Widget">Green Widget <option value="Red Widget">Red Widget </select> <select name="custom[]"> <option value="Large">Large <option value="Medium">Medium <option value="Small">Small </select> <select name="custom[]"> <option value="Circular">Circular <option value="Triangular">Triangular <option value="Square">Square </select> Name: <input type="text" name="custom[]"> Address: <input type="text" name="custom[]"> <input type="hidden" name="price" value="9.99"> <input type="submit" value="Add to Cart"> </form>
Similar to the Basic Custom Products example, but we separate the values with a comma look for the hidden field called separator - note there is no need to use a value with this hidden field

Football Shirt Example	HTML Code
Team: Arsenal Chelsea Manchester United Size: Small Medium Large X Large Long Sleeve:     Short Sleeve: Number: 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 Name on Shirt:	<form action="http://www.fastcart.co.uk/cart/index.php" method="post" target="_top"> <input type="hidden" name="id" value="1223"> <input type="hidden" name="separator"> Team: <select name="custom[]"> <option value="Arsenal Home Shirt">Arsenal <option value="Chelsea Home Shirt">Chelsea <option value="Manchester United Home Shirt">Manchester United </select> Size: <select name="custom[]"> <option value="Small">Small <option value="Medium">Medium <option value="Large">Large <option value="Extra Large">X Large </select> Long Sleeve: <input type="radio" name="custom[]" value="Long Sleeve" checked> Short Sleeve: <input type="radio" name="custom[]" value="Short Sleeve"> Number: <select name="custom[]"> <option value="Number 2">2  <option value="Number 3">3 <option value="Number 4">4  <option value="Number 5">5 <option value="Number 6">6  <option value="Number 7">7 <option value="Number 8">8  <option value="Number 9">9 <option value="Number 10">10  <option value="Number 11">11 <option value="Number 12">12  <option value="Number 13">13 <option value="Number 14">14  <option value="Number 15">15 <option value="Number 16">16  <option value="Number 17">17 <option value="Number 18">18  <option value="Number 19">19 </select> Name on Shirt: <input type="text" name="custom[]" value="Name = "> <input type="hidden" name="price" value="40.00"> <input type="submit" value="Add to Cart"> </form>
A "real life" example that may suit most users. This time we have chosen to display more descriptive text in FastCart by making better use of the value. Note that "Name = " appears in the text box - if we don't do this, only the value entered will appear in FastCart - this could cause confusion if multiple text boxes are used. Also note that there is no guarantee that shoppers will leave this text in place - they may delete it. See the Show Key Names example below for an alternative that may be more suitable.

Show Key Names	HTML Code
Blue Widget Green Widget Red Widget Large Medium Small Circular Triangular Square Your Name: Partner's Name:	<form action="http://www.fastcart.co.uk/cart/index.php" method="post" target="_top"> <input type="hidden" name="id" value="1223"> <input type="hidden" name="showkeys"> <input type="hidden" name="separator"> <select name="custom[Colour]"> <option value="Blue Widget">Blue Widget <option value="Green Widget">Green Widget <option value="Red Widget">Red Widget </select> <select name="custom[Size]"> <option value="Large">Large <option value="Medium">Medium <option value="Small">Small </select> <select name="custom[Shape]"> <option value="Circular">Circular <option value="Triangular">Triangular <option value="Square">Square </select> Your Name: <input type="text" name="custom[YourName]"> Partner's Name: <input type="text" name="custom[PartnersName]"> <input type="hidden" name="price" value="9.99"> <input type="submit" value="Add to Cart"> </form>
Similar to the Separated Values example above, but this time we display the names of the keys - note the extra hidden field called showkeys and that the key names are inside the square brackets of custom[]. If you choose this method, do not uses spaces in the key names. If you use showkeys but do not enter names in the square brackets, the key number will be shown instead.

Don't Show Key Names	HTML Code
Blue Widget Green Widget Red Widget Large Medium Small Circular Triangular Square Your Name: Partner's Name:	<form action="http://www.fastcart.co.uk/cart/index.php" method="post" target="_top"> <input type="hidden" name="id" value="1223"> <input type="hidden" name="separator"> <select name="custom[Colour]"> <option value="Blue Widget">Blue Widget <option value="Green Widget">Green Widget <option value="Red Widget">Red Widget </select> <select name="custom[Size]"> <option value="Large">Large <option value="Medium">Medium <option value="Small">Small </select> <select name="custom[Shape]"> <option value="Circular">Circular <option value="Triangular">Triangular <option value="Square">Square </select> Your Name: <input type="text" name="custom[YourName]"> Partner's Name: <input type="text" name="custom[PartnersName]"> <input type="hidden" name="price" value="9.99"> <input type="submit" value="Add to Cart"> </form>
This is what happens if use key names in the square brackets but omit the showkeys field - the field names are simply not shown.

Custom Books Example	HTML Code
First Name: Last Name: Gender: Boy     Girl Likes Football? Likes Tennis? Likes Netball? Likes Swimming? Friend 1 Name: Friend 2 Name:	<form action="http://www.fastcart.co.uk/cart/index.php" method="post" target="_top"> <input type="hidden" name="id" value="1223"> <input type="hidden" name="showkeys"> <input type="hidden" name="separator"> <input type="hidden" name="custom[Book]" value="SportStar"> First Name:<input type="text" name="custom[FirstName]"> Last Name:<input type="text" name="custom[LastName]"> Gender: Boy <input type="radio" name="custom[Gender]" value="Boy" checked> Girl <input type="radio" name="custom[Gender]" value="Girl"> Likes Football?<input type="checkbox" name="custom[Football]" value="Yes"> Likes Tennis?<input type="checkbox" name="custom[Tennis]" value="Yes"> Likes Netball?<input type="checkbox" name="custom[Netball]" value="Yes"> Likes Swimming?<input type="checkbox" name="custom[Swimming]" value="Yes"> Friend 1 Name: <input type="text" name="custom[Friend1]"> Friend 2 Name: <input type="text" name="custom[Friend2]"> <input type="hidden" name="price" value="9.95"> <input type="submit" value="Add to Cart"> </form>
A "real life" example that could be used for books where your child is the main character - story will also include friends etc. Note we can send data in hidden fields and can also use radio buttons and checkboxes. If using radio buttons, always ensure that one button is marked checked. Checkbox values are only passed if the checkbox is ticked. If no checkbox value is included, the word on will be used in FastCart.