How to

Add States and Cities to WooCommerce (Provincia, Cantones)

This is a simple guide about how to add States, Cities, and Postcodes relationship to WooCommerce by Country, using the plugin WC Provincia Canton Distrito. This requires access to the source code of your site and minimal knowledge of coding.

Step #1

Copy the main json file from /assets/js/prov-cant-dist.json to /your-theme/assets/js/prov-cant-dist.json. If you don’t need it on this location, you can use the filter wcpcd_prov_cant_dist_json to move it to your custom location.

Step #2

Map your current country, state, city, and postcode information to the json file located in your plugin. As an example, this is part of the mapping information for Ecuador Thanks to José Leones.

Step #3

Map your states to WooCommerce in relation to your country. This is required to become the state field on the Checkout as a dropdown. Based on the same example of Ecuador, you need to use the filter woocommerce_states.

function kmchild_wc_states($states) {
	$states['EC'] = array(
		'A' => 'Azuay',
		'B' => 'Bolívar',
		'P' => 'Pichincha'

	return $states;
add_filter('woocommerce_states', 'kmchild_wc_states');


Now, you’ll be able to choose Country (optional), State, State-District and it places the postcode related to the postcode field.

I hope that these instructions help you to use this plugin with your country information. Don’t hesitate to contact me in case you need anything else.

Update 01-2021: Now you can get or share your country’s State and cities locations. Please, visit State and cities locations to get more information about it.

Any doubts or suggestions?

By KeylorCR

Hello world. My name is Keylor Mendoza from Costa Rica, a WordPress Developer with more than 5 years of experience working with custom themes and plugins. Strong experience working with WooCommerce customizations.

4 replies on “Add States and Cities to WooCommerce (Provincia, Cantones)”

Hola, estuve siguiendo los pasos de este tutorial pero sigo sin poder ver el dropdown en los campos de ciudad:
Solamente agregando el filter add_filter(‘woocommerce_states’, ‘kmchild_wc_states’);
pude obtener el dropdown en los campos de state, pero todavía no logro verlo en el de city.

Hola Raúl, en los casos que no se carguen las opciones de cantones y distritos puede ser por alguna incompatibilidad con otro plugin o tema. También puede ser por la optimización de JS que use en su sitio, dado que este plugin funciona por completo con JS.


Leave a Reply

Your email address will not be published. Required fields are marked *