In this article, we are going to explain how to hide the UK as a Country and selecting England, Northern Ireland, Scotland, and Wales as countries instead. 


Our location's system is based on Google Maps' structure and Google Maps treats the UK as a "Country" and England, Northern Ireland, Scotland, Wales as "States" (even though technically they are sub-countries of the UK). 


This is how it looks by default: 




This is how it is going to look after editing the form: 




Customizing the Form 


1. Navigate go to Toolbox >> Form Manager. 

  • If the website is using an on-site payment gateway like Stripe, PayPal Payments Pro, Authorize.net, PayPal Payflow, or eWay, edit this form "whmcs_signup_paid". 
  • If the website is using an off-site payment gateway like PayPal Standard, 2Checkout, or PayFast, edit this other form "whmcs_signup_external". 


2.  At the top right there is a search bar, conduct a search for "Paid" and select the correct form based on the information in step 1 and click on Actions >> Customize:



3. Find the field with database variable country_code and edit the following sections:


Field Type: Hidden Field

Label Name: GB

System Variable: country_code




4. Then find the field with database variable state_code and edit the following sections:


Field Type: Dropdown List (select Custom HTML option here for non-UK scenarios)

Label Name: %%%cc_country%%% (what to use here for non-UK scenarios will be specified below)

System Variable: state_code

Enter CSS Class: form-control

Display Options: Set all to YES


How this form field would look for UK scenarios:




As it can be seen from the screenshot above, if Dropdown List is selected as a field type, a button called "ADD OPTION" will be displayed at the bottom. Here the respected country values can be inserted. For this to work as expected, make sure to use the Database Variable names specified in the image above.


For non-UK scenarios, this might take a very long time to add each State and their respected Database Variable. As a work-around, a widget can be created with these values and this widget can be called on this form field instead. To accomplish this, create a new widget with the following information (the US states example):


<label class="vertical-label bd-text">States</label>
<select name="state_code" class="form-control" style="margin-bottom: 7px;">
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">District Of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select>


Then call this widget on the form field using its shortcode method. This is how the end result would look like:




5. Find the field with label </div><div class="col-lg-6"> and change the value to </div><div class="col-lg-12">:




Now, the default "State Field" is not going to show up and the "Country" field will show these 4 options: England, Northern Ireland, Scotland, and Wales.