Nuevo icono de Twitter en Elementor

Con el cambio de imagen corporativa de Twitter es necesario cambiar el icono del tradicional pajarito por la ya conocida X.

El proceso para cambiar por el nuevo icono de Twitter es muy fácil o por lo menos la opción que he encontrado fue la que me ha funcionado en los proyectos de mis clientes, e incluso en mi propio sitio web.

Pasos para cambiar el nuevo icono de Twitter en Elementor

1. Primer paso: habilitar el ícono SVG:

Para esto, debes ir a Elementor > ajustes > Características > fuentes de iconos integradas y cambiar el estado a «Activo»

2. Segundo paso: insertar código:

El código a continuación lo puedes insertar en tu «plugin de funciones», tu «tema hijo» o plugin para insertar códigos en tu sitio web, como por ejemplo el code snippets.

En mi caso, he usado el tema hijo para insertarlo y lo he puesto de la siguiente manera:

/* agregar nuevo icono de Twitter */
add_filter( 'elementor/widget/render_content', function($output){
	// replace the
	$re = '/(<svg[^>]+class="[^"]*e-fab-twitter".*?<path\s+d=")(.+?)(".+?<\/svg>)/s';
	$output = preg_replace_callback($re, function($matches){
		$path = "M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z";
		return $matches[1].$path.$matches[3];
	}, $output);
	return $output;
}, 10, 2 );

¡Y listo!

Así de fácil es cambiar el nuevo icono de Twitter en Elementor en todo tu proyecto.

Espero que este post te haya servido de ayuda, cuéntame como te fue en los comentarios. Me hará mucha ilusión leerte.