Wednesday, March 15, 2023

How to CDN Elementor's Font Awesome CSS and JS






This is how to overload Elementor's plugin which uses Font Awesome Icons CSS and JS files to use a CDN for page speed optimization. 







Key to this setting the priority to run after plugins are loaded, and that why we are using wp_head  hook  with an add_action priority 5. If this is larger or equal to 10 this did not work. You have to experiment to find your own priority level. 
//Wed 15-Mar-23 10:12pm metadataconsulting.ca
function mdc_font_awesome_elementor_CDNify()
{
	//WARNING: This will change the order of the script be loaded pay close attention to rendering of pages
	wp_dequeue_style('font-awesome-5-all');
	wp_deregister_style('font-awesome-5-all');
	wp_enqueue_style( 'font-awesome-5-all', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css', array(),  '5.15.3');
		
	wp_dequeue_style('font-awesome-4-shim');
	wp_deregister_style('font-awesome-4-shim');
	wp_enqueue_style( 'font-awesome-4-shim', 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/v4-shims.min.css', array(), '5.15.3' ); 

	wp_dequeue_script('font-awesome-4-shim'); 
	wp_deregister_script('font-awesome-4-shim'); 
	wp_enqueue_script('font-awesome-4-shim','https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/js/v4-shims.min.js', [], '5.15.3', false );
	
}

add_action( 'wp_head', 'mdc_font_awesome_elementor_CDNify', 5 ); 

Friday, March 3, 2023

JQuery CDN breaking Wordpress Elementor Editor - Fixing Elementor Safe Mode

If you are getting the Elementor Safe Mode, appearing when you are editing in WordPress and you have jQuery using a CDN, they don't mix. It will break Elementor. 









Solution: 


The solution is load WordPress default jQuery libraries when you are logged in as admin. Otherwise for web users jQuery CDN links work fine. 

In script-loader.php


if (is_admin()) { //back-end
		
	$scripts->add( 'jquery-core', "/wp-includes/js/jquery/jquery$suffix.js", array(), '3.6.1' );
	$scripts->add( 'jquery-migrate', "/wp-includes/js/jquery/jquery-migrate$suffix.js", array(), '3.3.2' );
	$scripts->add( 'jquery-ui-core', "/wp-includes/js/jquery/ui/core$suffix.js", array( 'jquery' ), '1.13.2', 1 );

} else { //front-end

	$scripts->add( 'jquery-core', "https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js", array(), '3.6.1' );
	$scripts->add( 'jquery-migrate', "https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/3.3.2/jquery-migrate.min.js", array(), '3.3.2' );
	$scripts->add( 'jquery-ui-core', "https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js", array( 'jquery' ), '1.13.2', 1 );
}