Change Caldera Forms phone field default country. See: https://calderaforms.com/doc/caldera_forms_phone_js_options/

caldera_forms_phone_js_options-preferred.php

<?php
/**
* Set preffered countries for Caldera Forms phone fields
*/
add_filter( 'caldera_forms_phone_js_options', function( $options){
	//Use ISO_3166-1_alpha-2 formatted country code
	$options[ 'preferredCountries' ] = array( 'MX' );
	return $options;
});

caldera_forms_phone_js_options.php

<?php
/**
* Set intiial country for Caldera Forms phone fields
*/
add_filter( 'caldera_forms_phone_js_options', function( $options){
	//Use ISO_3166-1_alpha-2 formatted country code
	$options[ 'initialCountry' ] = 'CH';
	return $options;
});

only-countries.php

<?php
/**
 * Show only specific countries' flag in Caldera Forms phone fields
 */
add_filter( 'caldera_forms_phone_js_options', function($options ){
	$options[ 'onlyCountries' ] = array( 'cn', 'tw' );
	return $options;
});

I want to set the default country code to SG. What are the difference between all the 3 codes provided? Do I have to input all these 3 codes?

@samuelhoks

First Code : Gives you a list of countries you would like to set as preferred at the top of your drop-down list.

Second Code : Lets you set the initial country code on the left of the phone number. ( which by default is USA)

Third Code : Drop down will only have the countries you specify , no more.

Hope that helps.

@samuelhoks

# Solution :

Step 1 :- Copy the code

       `add_filter( 'caldera_forms_phone_js_options', function( $options){
          $options[ 'initialCountry' ] = 'SG';                   //I've set this Based on your question
          return $options;
       });`  

Without the <?php ?> tags. ( Will explain why in the following steps)

Step 2 :- Back in wordpress, open Appearance >> Editor. In here you will find the back-end code for the whole theme.

Step 3 :- Right hand side you will see a list of example.php code.

Step 4 :- Search for Theme Functions (functions.php). THIS IS WHERE THE IMPORTANT CODE LIVES. To be safe; copy the code that is already in there as backup before making any changes/or adding anything.

Step 5 :- In there, at the beginning you will see -

        `public function initialize() {
	      add_filter('upfront_augment_theme_layout', array($this, 'augment_layout'));
	      $this->add_actions_filters();
	      $this->populate_pages();
        }`

This might be slightly different, but it generally have the similar structure.

Step 6 :- Paste in the block of code you copied at the very beginning into the public function initialize() { }, if there is any code already in there, just put your code underneath them. Between
public function initialize() { add_filter('upfront_augment_theme_layout', array($this, 'augment_layout')); $this->add_actions_filters(); $this->populate_pages(); **{HERE}** }

Step 7 :- Once finished and you're happy and sure it's done right, press Update File and the code will get saved.

IT SHOULD WORK NOW !!

Back in your main page / form where the Phone Field is it will now initially have SG. ( or whichever country code you've specified )

If you want to have a list of preferred countries show up at the top of the drop-down list.

Just add this one line $options[ 'preferredCountries' ] = array( 'MX' ); before return $options, and add different country codes into array('MX' , 'GB', 'IN' )

I hope that was helpful.

☮️

@rendermanGL,

I am wondering if you have a readily available solution or something in the making for functionality whereas GeoIP data is pulled before the form loads and then the matching country flag is fetched based on the IP address.

Alternatively and equally cool way to handle this would be based on user input - Country field should be on the form before the phone number and once a user selects the country the form would update the country code/flag in the phone field accordingly?

Thanks

How do I do this in the wordpress astra theme? thank you

I have the same issue i am using astra theme for some reason when i put the above code it works for the first time but when i reload again , the default country is gone again ,