Text duration in listing

Hello team, you sent me the solution to put the text of the duration of the service on the cover of the ads. but it does not look good and I would like to put the text Duration and the number of hours or minutes in bold typeface and in red color.
The text that you sent me earlier is the following:

	function( $attributes ) {
		if ( isset( $attributes['booking_slot_duration'] ) ) {
			$attributes['booking_slot_duration']['display_areas'] = [ 'view_page_primary', 'view_block_secondary' ];

		return $attributes;

	function( $value, $field ) {
		if ( $field->get_name() === 'booking_slot_duration' ) {
			$hour = intdiv( $value, 60 );
			if($hour < 10){
				$hour = ' '.$hour;
			$minute = $value % 60;
			if(intval($minute) < 10){
				$minute = '0'.$minute;
			$value = '<i class="hp-icon fas fa-fw fa-clock"></i>  Duración: ' . $hour . ':' . $minute . 'h';

		return $value;

Hola equipo, me enviasteis la solucion para poner el texto de la duracion del servicio en la portada de los anuncios . pero no se ve bien y me gustaria poner el texto Duracion y el numero de horas o minutos en tipografia negrita y de color rojo.
el texto que me enviasteis anteriormente es el siguiente:


Sorry, there’s no simple code snippet for this, it would require a custom implementation. If customizations beyond the available features are required for your site, please consider hiring someone for custom work https://fvrr.co/32e7LvY.

But can’t you help me?

I already have the fragment I have already installed and it works.

I just need it to look more,

Putting it bigger, either in bold, or in another color. Or some solution that comes to mind.

Pero no puedes ayudarme?
El fragmento que te he pasado ya lo tengo instalado y funciona.
Solo necesito que se vea más ,
Poniéndole más grande , o en negrita, o en otro color . O alguna solución que se te ocurra.

Please change this part

$value = '<i class="hp-icon fas fa-fw fa-clock"></i> Duración: ' . $hour . ':' . $minute . 'h';

on this in your code snippet

$value = '<i class="hp-icon fas fa-fw fa-clock"></i><span class="hp_custom_slot_duration_attribute"> Duración: ' . $hour . ':' . $minute . 'h</span>';

Then it is possible to use class hp_custom_slot_duration_attribute to make changes to styles of this attribute with the CSS code snippets. For example, please try this CSS snippet to change this text to red color and bold font weight

	color: #FF0000;
	font-weight: 900;

But please note that it can require further customization. If you are not familiar with the code customization then please consider hiring someone for custom work https://fvrr.co/32e7LvY

Lo voy a probar.
Quiero decirte que estoy muy agradecido por la ayuda que nos prestas.
Has sido muy amable como siempre .

I’m going to try it.

I want to tell you that I am very grateful for the help you give us.

He has been very kind as always.

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.