As shoppers check out of your store, they will typically enter their billing and shipping addresses (including their ZIP/Postal code) into the checkout pages to complete their purchases.
Most countries have postal codes to use, but there are a few that do not. If your primary business is exclusive to countries without a postal code, it is possible (through some HTML editing) to remove the Postal Code requirement from your store's checkout pages.
Note
The steps outlined here will allow you to remove the Zip/Postal code field from your store's checkout pages. As your shoppers proceed to checkout, they will use the checkout forms to not only create their order, but also create their customer record on your store.
It is important to note however, that the regular account registration form (under My Account) cannot be edited in this fashion due to scripted validation that occurs on that particular form when information is entered.
To disable the ZIP field on your checkout pages, you will need to retrieve and edit individual checkout page templates. Which templates you edit will depend on your store's configuration (for example, if you are using single page checkout instead of multiple page checkout). In the steps below we will outline the process for each possible scenario.
Single Page Checkout
If your store is using Single Page Checkout, the template you will need to edit is called checkout-singlepage.html. To make the edits to this template, follow these steps:
- Log into your 3dcart Online Store Manager
- Using the left hand navigation menu, go to Settings ->Design ->Themes & Styles
- Once there, look to the top right of the page and click on the "Edit Template (HTML)" button
This will take you to your store's theme folder which will contain a list of HTML template files that are unique to your selected theme. You will always see a file labeled "frame.html" and possibly some other files in the list. Look within this list for a file called "checkout-singlepage.html"
If you do not have this file in your theme folder, proceed to the next steps. However, if you do have this file in your theme folder, skip ahead to step 6.
- Look at the top right section of the page and click on the "Go to folder:" drop down menu
- Select the templates/common-html5 folder
This file will contain every HTML template file used on 3dcart. The files will be listed alphabetically, so search and locate the file named "checkout-singlepage.html" and proceed with the following steps.
- Once you've located the "checkout-singlepage.html" file, click on its name to view the file in the Template Editor
- Make the changes labeled below:
Using CTRL-F on your browser, search for each snippet of code below and make the outlined changes. For this template there will be 4 sections that need changing
checkout-singlepage.html:
Section 1
Locate this code:
<label for="billing_zip">[CustomerInfo_zip]</label>
<input name="billing_zip" type="text" id="billing_zip" value="[billing_zip]" size="10" tabindex="10" maxlength="20" class="txtBoxStyle" onchange="clearContent(this);check_address('billing');" />
<!--START: req_billing_zip-->
<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />
<!--END: req_billing_zip-->
Change it to this:
!--<label for="billing_zip">[CustomerInfo_zip]</label>-->
<input name="billing_zip" type="hidden" id="billing_zip" value="[billing_zip]" size="10" tabindex="10" maxlength="20" class="txtBoxStyle" onchange="clearContent(this);check_address('billing');" />
<!--START: req_billing_zip-->
!--<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />-->
<!--END: req_billing_zip-->
Section 2
Locate this code:
<label for="shipping_zip">[CustomerInfo_zip]</label>
<input name="shipping_zip" type="text" id="shipping_zip" value="[shipping_zip]" size="10" tabindex="25" maxlength="20" class="txtBoxStyle" onchange="clearContent(this);check_address('shipping');" />
<!--START: req_shipping_zip-->
<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />
<!--END: req_shipping_zip-->
Change it to this:
<!--<label for="shipping_zip">[CustomerInfo_zip]</label>-->
<input name="shipping_zip" type="hidden" id="shipping_zip" value="[shipping_zip]" size="10" tabindex="25" maxlength="20" class="txtBoxStyle" onchange="clearContent(this);check_address('shipping');" />
<!--START: req_shipping_zip-->
!--<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />-->
<!--END: req_shipping_zip-->
Section 3
Locate this code:
frmvalidator.addValidation("billing_zip","maxlen=20");
frmvalidator.addValidation("billing_zip","req","Please enter your billing zip code");
Change it to this:
//frmvalidator.addValidation("billing_zip","maxlen=20");
//frmvalidator.addValidation("billing_zip","req","Please enter your billing zip code");
Section 4
Locate this code:
frmvalidator.addValidation("shipping_zip","maxlen=20");
frmvalidator.addValidation("shipping_zip","req","Please enter your shipping zip code");
Change it to this:
//frmvalidator.addValidation("shipping_zip","maxlen=20");
//frmvalidator.addValidation("shipping_zip","req","Please enter your shipping zip code");
After making the above changes, click "Save" at the top right to have the changes go into effect.
Single Page Checkout (v2)
If your store is using Single Page Checkout style v2 (as specified in Store Settings), the template you will need to edit is called checkout-singlepage-v2.html. To make the edits to this template, follow these steps:
- Log into your 3dcart Online Store Manager
- Using the left hand navigation menu, go to Settings ->Design ->Themes & Styles
- Once there, look to the top right of the page and click on the "Edit Template (HTML)" button
This will take you to your store's theme folder which will contain a list of HTML template files that are unique to your selected theme. You will always see a file labeled "frame.html" and possibly some other files in the list. Look within this list for a file called "checkout-singlepage-v2.html"
If you do not have this file in your theme folder, proceed to the next steps. However, if you do have this file in your theme folder, skip ahead to step 6.
- Look at the top right section of the page and click on the "Go to folder:" drop down menu
- Select the templates/common-html5 folder
This file will contain every HTML template file used on 3dcart. The files will be listed alphabetically, so search and locate the file named "checkout-singlepage-v2.html" and proceed with the following steps.
- Once you've located the "checkout-singlepage-v2.html" file, click on its name to view the file in the Template Editor
- Make the changes labeled below:
Using CTRL-F on your browser, search for each snippet of code below and make the outlined changes. For this template there will be 4 sections that need changing
checkout-singlepage-v2.html:
Section 1
Locate this code:
<input name="billing_zip" type="text" id="billing_zip" value="[billing_zip]" placeholder="[CustomerInfo_zip]" size="10" tabindex="13" maxlength="20" class="txtBoxStyle" onchange="clearContent(this);check_address('billing');" />
Change it to this:
<input name="billing_zip" type="hidden" id="billing_zip" value="[billing_zip]" placeholder="[CustomerInfo_zip]" size="10" tabindex="13" maxlength="20" class="txtBoxStyle" onchange="clearContent(this);check_address('billing');" />
Section 2
Locate this code:
<input name="shipping_zip" type="text" id="shipping_zip" value="[shipping_zip]" placeholder="[CustomerInfo_zip]" size="10" tabindex="25" maxlength="20" class="txtBoxStyle" onchange="clearContent(this);check_address('shipping');" />
Change it to this:
<input name="shipping_zip" type="hidden" id="shipping_zip" value="[shipping_zip]" placeholder="[CustomerInfo_zip]" size="10" tabindex="25" maxlength="20" class="txtBoxStyle" onchange="clearContent(this);check_address('shipping');" />
Section 3
Locate this code:
frmvalidator.addValidation("billing_zip","maxlen=20");
frmvalidator.addValidation("billing_zip","req","Please enter your billing zip code");
Change it to this:
//frmvalidator.addValidation("billing_zip","maxlen=20");
//frmvalidator.addValidation("billing_zip","req","Please enter your billing zip code");
Section 4
Locate this code:
frmvalidator.addValidation("shipping_zip","maxlen=20");
frmvalidator.addValidation("shipping_zip","req","Please enter your shipping zip code");
Change it to this:
//frmvalidator.addValidation("shipping_zip","maxlen=20");
//frmvalidator.addValidation("shipping_zip","req","Please enter your shipping zip code");
After making the above changes, click "Save" at the top right to have the changes go into effect.
Multi-Page Checkout
If your store is using Multiple Page Checkout (as specified in Store Settings), you will need to edit several templates. The main two templates you will need to edit are called checkout-step1.html, checkout-step3.html. Additionally, if your store is set to also allow shipping of orders to multiple addresses, then you will also need to edit two additional templates called shipment_update_address.html and checkout-step3_multiple.html
To make the edits to the templates mentioned above, follow these steps:
- Log into your 3dcart Online Store Manager
- Using the left hand navigation menu, go to Settings ->Design ->Themes & Styles
- Once there, look to the top right of the page and click on the "Edit Template (HTML)" button
This will take you to your store's theme folder which will contain a list of HTML template files that are unique to your selected theme. You will always see a file labeled "frame.html" and possibly some other files in the list. Look within this list for any of the files mentioned above (checkout-step1.html, checkout-step3.html and/or checkout-step3_multiple.html)
If you do not have these files in your theme folder, proceed to the next steps. However, if you do have them present in your theme folder, skip ahead to step 6.
- Look at the top right section of the page and click on the "Go to folder:" drop down menu
- Select the templates/common-html5 folder
This file will contain every HTML template file used on 3dcart. The files will be listed alphabetically, so search and locate the file named above and proceed with the following steps.
- Once you've located the HTML templates files, click on each one's name to view the file in the Template Editor
- Make the changes labeled below:
Using CTRL-F on your browser, search for each snippet of code below and make the outlined changes.
Note
Remember that there are three separate templates you'll be editing in this case
- checkout-step1.html will contain 2 sections to change
- checkout-step3.html will contain 4 sections to change
- shipment_update_address.html will contain 2 sections to change
- checkout-step3_multiple.html will contain 4 sections to change
checkout-step1.html:
Section 1
Locate this code:
<label for="shipping_zip">[CustomerInfo_zip]</label>
<input name="shipping_zip" type="text" id="shipping_zip" value="[shipping_zip]" size="10" tabindex="15" maxlength="20" class="txtBoxStyle" />
<!--START: req_shipping_zip-->
<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />
<!--END: req_shipping_zip-->
Change it to this:
<!--<label for="shipping_zip">[CustomerInfo_zip]</label>-->
<input name="shipping_zip" type="hidden" id="shipping_zip" value="[shipping_zip]" size="10" tabindex="15" maxlength="20" class="txtBoxStyle" />
<!--START: req_shipping_zip-->
<!--<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />-->
<!--END: req_shipping_zip-->
Section 2
Locate this code:
frmvalidator.addValidation("shipping_zip","maxlen=20","Max length for Zip is 20");
frmvalidator.addValidation("shipping_zip","req","Please enter your zip code");
Change it to this:
//frmvalidator.addValidation("shipping_zip","maxlen=20","Max length for Zip is 20");
//frmvalidator.addValidation("shipping_zip","req","Please enter your zip code");
After making the above changes, click "Save" at the top right to have the changes go into effect for this template and proceed to the next.
checkout-step3.html:
Section 1
Locate this code:
document.billing.billing_zip.value="";
Change it to this:
//document.billing.billing_zip.value="";
Section 2
Locate this code:
document.billing.billing_zip.value="[shipping_zip]";
Change it to this:
//document.billing.billing_zip.value="[shipping_zip]";
Section 3
Locate this code:
<label for="billing_zip">[CustomerInfo_zip]</label>
<input name="billing_zip" type="text" id="billing_zip" value="[billing_zip]" size="10" tabindex="10" maxlength="20" class="txtBoxStyle" />
<!--START: req_billing_zip-->
<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />
<!--END: req_billing_zip-->
Change it to this:
<!--<label for="billing_zip">[CustomerInfo_zip]</label>-->
<input name="billing_zip" type="hidden" id="billing_zip" value="[billing_zip]" size="10" tabindex="10" maxlength="20" class="txtBoxStyle" />
<!--START: req_billing_zip-->
<!--<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" /> -->
<!--END: req_billing_zip-->
Section 4
Locate this code:
frmvalidator.addValidation("billing_zip", "maxlen=20", "Max length for Zip is 20");
frmvalidator.addValidation("billing_zip", "req", "Please enter your zip code");
Change it to this:
//frmvalidator.addValidation("billing_zip", "maxlen=20", "Max length for Zip is 20");
//frmvalidator.addValidation("billing_zip", "req", "Please enter your zip code");
After making the above changes, click "Save" at the top right to have the changes go into effect for this template and proceed to the next.
Note
Remember that these next two template edits are only needed if your store uses the Multi Ship To function.
shipment_update_address.html
Section 1
Locate this code:
<label for="oshipzip">[CustomerInfo_zip]</label>
<input name="oshipzip" type="text" id="oshipzip" value="[oshipzip]" size="10" tabindex="11" class="txtBoxStyle" />
<!--START: req_shipping_zip-->
<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />
<!--END: req_shipping_zip-->
Change it to this:
<!--<label for="oshipzip">[CustomerInfo_zip]</label>-->
<input name="oshipzip" type="hidden" id="oshipzip" value="[oshipzip]" size="10" tabindex="11" class="txtBoxStyle" />
<!--START: req_shipping_zip-->
<!--<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" /> -->
<!--END: req_shipping_zip-->
Section 2
Locate this code:
frmvalidator.addValidation("oshipzip","maxlen=20");
frmvalidator.addValidation("oshipzip","req","Please enter your zip code");
Change it to this:
//frmvalidator.addValidation("oshipzip","maxlen=20");
//frmvalidator.addValidation("oshipzip","req","Please enter your zip code");
checkout-step3_multiple.html:
Section 1
Locate this code:
document.billing.billing_zip.value = "";
Change it to this:
//document.billing.billing_zip.value = "";
Section 2
Locate this code:
document.billing.billing_zip.value = "[shipping_zip]";
Change it to this:
//document.billing.billing_zip.value = "[shipping_zip]";
Section 3
Locate this code:
<label for="billing_zip">[CustomerInfo_zip]</label>
<input name="billing_zip" type="text" id="billing_zip" value="[billing_zip]" size="10" tabindex="10" maxlength="20" class="txtBoxStyle" />
<!--START: req_billing_zip-->
<img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" />
<!--END: req_billing_zip-->
Change it to this:
<!--<label for="billing_zip">[CustomerInfo_zip]</label>-->
<input name="billing_zip" type="hidden" id="billing_zip" value="[billing_zip]" size="10" tabindex="10" maxlength="20" class="txtBoxStyle" />
<!--START: req_billing_zip-->
<!-- <img src="assets/templates/common/images/error2.gif" width="12" height="12" alt="" /> -->
<!--END: req_billing_zip-->
Section 4
Locate this code:
frmvalidator.addValidation("billing_zip", "maxlen=15", "Max length for Zip is 15");
frmvalidator.addValidation("billing_zip", "req", "Please enter your zip code");
Change it to this:
//frmvalidator.addValidation("billing_zip", "maxlen=15", "Max length for Zip is 15");
//frmvalidator.addValidation("billing_zip", "req", "Please enter your zip code");
After making the above changes, click "Save" at the top right to have the changes go into effect for this template and you're done!