Create custom registration fields and include them in invoice

There are times that you may want to add additional fields to your checkout billing page, registration page, shipping page, or even quote page. DecoNetwork allows you to do this. A common use case for custom registration fields is when you use affiliate stores to work with different types of organizations, such as schools or sports teams. Very often the orders are made by parents, but you still need a child’s name to process the transaction. In this tutorial, you will learn how to create a custom field, “Child’s Name”, which will be included on the checkout page. You will also learn how to include this newly created field in the print sheet (invoice) by using the custom variable.

Start with creating the custom field named “Child’s Name”. It is entirely up to you what you want to call it, eg, “Player’s Name” or any other string of words is fine. To do this:

1. Browse to Admin > Settings > Customer Settings > Customer Fields
   
2. Scroll to the bottom of the page and click on the Add Custom Field button.
   

   This will add a new field at the bottom of the page.

   
3. Configure the new field:
   • Specify the Title (Child’s Name)
   • Choose the Type (Text field)
   • Choose the Stores where this newly created field will be revealed (You can narrow the selection to certain stores only)
4. Click on the Save button to save the changes.

Now that you have the custom field created, you need to decide where you want this field to be displayed, and if this is a required field or just visible. If it is visible, your customers can leave this field blank and still be able to proceed to the next page. You can do this using the Define Field Usage feature.

1. Click on the button Define Field Usage at the top right of the page.
   

   The Define Field Usage popup is displayed.

   

   Here, you can define which field is displayed and on which page. Some fields, such as name or address, are required.

2. Scroll to the bottom and tick the Visible and Required checkboxes for the newly created field under Checkout: Billing Details
   
3. Close the window and click Save to save the changes.

   Once this is done, you should be able to see this field during the checkout as shown below:

   

   You will still need to include this field on your print sheet, otherwise, you are not going to see Child’s Name included anywhere in the production files.

To include a custom registration field on your print sheet you need to add the variable which will display it to the worksheet and order template in your store.

The variable is {{customer.custom_fields.xxx }}
Where xxx is the name of the field in lowercase, with all non-alphanumeric fields changed to "_"
i.e: “Test Field” = “test_field”

Note: A non-alphanumeric character is anything that is not A-Z or 0-9.

In this case, your variable is {{customer.custom_fields.child_s_name}} (Note: if you used a different name, such as Player’s Name, then you will need to replace child_s_name with player_s_name)

1. To add this variable to the Order and Worksheet template, browse to Admin > Settings > Email & Order Templates > Order Templates
   
2. Click on the Edit button next to Worksheet.
   

   The Edit Worksheet Template page is displayed.

   
3. Click on Customize template from the left menu.
   
4. Tick the Customize default template checkbox.
   

   The template editor is displayed.

   
5. Now, here is the tricky part. Some basic HTML understanding would help but is not required. Basically, you need to decide where you want to display that field on your worksheet. First, it is a good idea to click on Test Template (right upper corner) so you can see the default template.
   

   In this tutorial, you will learn how to add a custom field right below the email address under the contact details as shown below:

   
6. Next, you need to find this spot in the code. The easiest way to do it is by using the Find option in your browser. For example in Mozilla you can click Ctrl+F and the Find option will appear on the bottom of the page. Then you can type in “email” because you want this code to be added right below it, and it should take you to that place in the code.
   
7. Once you find the code, you just need to add the variable along with the description right below the email. For example, you can add this:

   <li>Child’s Name: {{customer.custom_fields.child_s_name}}</li>

   as shown below:

   

   Where <li></li> is the code that will display your Child’s Name on the next line in the worksheet.

   Child’s Name is the title for the content which comes next.

   {{customer.custom_fields.child_s_name}} displays the information provided by the customer during the checkout.

8. Click Save to save the changes.
9. Repeat steps 3-8 for the Order Template.