How do I change the telephone field format?

[Valentin.M]

Hello,

This post follows on from previous posts on the subject:

→ Format and Display Phone Numbers (Revisited) - General - HivePress Community,
→ Phone field format - General - HivePress Community.

For these customizations, you will need :
→ How to add custom code snippets - HivePress Help Center,
→ Code Snippets – WordPress plugin | WordPress.org.

Here’s how to customize your phone number :

Display 1

add_filter(
	'hivepress/v1/fields/phone/display_value',
	function($value){
		$listing = hivepress()->request->get_context('listing');

		if(!$listing){
			return $value;
		}

		// remove the "+" sign from the beginning of the phone number
		$value = ltrim($value, '+');

		// display phone number
		return preg_replace('~(\d{1}){0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})~', '0$1.$2.$3.$4.$5.$6', $value);
	},
	1000
);

Display 2 :

add_filter(
	'hivepress/v1/fields/phone/display_value',
	function($value){
		$listing = hivepress()->request->get_context('listing');

		if(!$listing){
			return $value;
		}

		// display phone number
		return preg_replace('~(\d{2}){0,7}(\d{1})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})~', '($1) 0$2.$3.$4.$5.$6', $value);
	},
	1000
);

Display 3 :

add_filter(
	'hivepress/v1/fields/phone/display_value',
	function($value){
		$listing = hivepress()->request->get_context('listing');

		if(!$listing){
			return $value;
		}

		// display phone number
		return preg_replace('~.*(\d{3})[^\d]{0,7}(\d{3})[^\d]{0,7}(\d{4}).*~', '+1 ($1) $2-$3', $value);
	},
	1000
);

For other formats, please modify the following items :

Element 1
(\d{2}) → change the number to suit your needs.

Element 2
“$1 $2 $3 $4 … “ → And add the signs you want : “.”, “-”, “()”, …

__

I’d like to take this opportunity to reopen the question of the “call button”, which is a very interesting function :
→ Add a phone field for social links - Feature Requests - HivePress Community,
→ I want to display a call now button that use the attribute phone-num - Development - HivePress Community,
→ I want to display a call now button that use attribute phone_num - Development - HivePress Community.

While waiting for this function to be added, you can transform the phone attribute into a button that will open the phone application automatically with the following HTML code :

<a class="button button--primary hp-button hp-button--wide" href="tel:%value%" target="_blank" rel="nofollow">%icon% %value%</a>

To avoid opening a new page, you can delete : target=“_blank”

I hope this helps

Good luck in the development of your websites

[ihor]

Thanks for sharing the solution, really appreciate this!

[Valentin.M]

UPDATE

If you wish to customize the display of the phone number according to a specific attribute and/or a specific country, you’ll need to modify the PHP code.

Replace “custom attribute” with your own attribute.

Also, if you wish to customize the format of the vendor’s phone number, you’ll need to replace “listing” by “vendor”.

Listing - French phone

//French cell phone number
add_filter(
	'hivepress/v1/fields/phone/display_value',
	function($value, $field){
		$listing = hivepress()->request->get_context('listing');

		if ( 'custom attribut' !== $field->get_name() ) {
			return $value;
		}
		
		// remove the "+" sign from the beginning of the phone number
		$value = ltrim($value, '+');
		
		// display phone number
		return preg_replace('~(\d{2}){0,7}(\d{1})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})~', '(+$1) 0$2.$3.$4.$5.$6', $value);

		return $value;
	},
	1000,
	2
);

Listing - Spanish phone

//Spanish cell phone number
add_filter(
	'hivepress/v1/fields/phone/display_value',
	function($value, $field){
		$listing = hivepress()->request->get_context('listing');

		if ( 'custom attribut' !== $field->get_name() ) {
			return $value;
		}

		// remove the "+" sign from the beginning of the phone number
		$value = ltrim($value, '+');

		// format the phone number
		$value = preg_replace('~^(\d{2})(\d{3})(\d{2})(\d{2})(\d{2})$~', '(+$1) $2.$3.$4.$5', $value);

		return $value;
	},
	1000,
	2
);

Listing - Italian phone

//Italian cell phone number
add_filter(
	'hivepress/v1/fields/phone/display_value',
	function($value, $field){
		$listing = hivepress()->request->get_context('listing');

		if ( 'custom attribut' !== $field->get_name() ) {
			return $value;
		}

		// remove the "+" sign from the beginning of the phone number
		$value = ltrim($value, '+');

		// format the phone number
		return preg_replace('~(\d{2}){0,7}(\d{3})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{3})~', '(+$1) $2.$3.$4.$5', $value);

		return $value;
	},
	1000,
	2
);

Vendor - Italian phone

//Italian cell phone number - Vendor
add_filter(
	'hivepress/v1/fields/phone/display_value',
	function($value, $field){
		$listing = hivepress()->request->get_context('vendor');

		if ( 'custom attribut' !== $field->get_name() ) {
			return $value;
		}

		// remove the "+" sign from the beginning of the phone number
		$value = ltrim($value, '+');

		// format the phone number
		return preg_replace('~(\d{2}){0,7}(\d{3})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{3})~', '$2.$3.$4.$5', $value);

		return $value;
	},
	1000,
	2
);

If you can’t find the format you want, you can write the following prompt in ChatGPT or Mistral AI or another machine learning (artificial intelligence) to get the desired format :

PHP code to write (+XX) XX.XX.XX.XX : add_filter(
	'hivepress/v1/fields/phone/display_value',
	function($value, $field){
		$listing = hivepress()->request->get_context('listing');

		if ( 'custom attribut' !== $field->get_name() ) {
			return $value;
		}

		// remove the "+" sign from the beginning of the phone number
		$value = ltrim($value, '+');

		// format the phone number
		return preg_replace('~(\d{2}){0,7}(\d{3})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{2})[^\d]{0,7}(\d{3})~', '(+$1) $2.$3.$4.$5', $value);

		return $value;
	},
	1000,
	2
);

[andrii]

Hi,

Thank you for your solution, it will be useful for our community. If you are a developer, please consider joining our community of experts: Customization | HivePress

[aq6121453]

hi,

how can i remove + from the phone number so it will display only the number without (+).

thank you

[andrii]

Hi,

Please check the solutions in this topic.