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
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_enqueue_style( 'font-awesome-5-all', '', array(),  '5.15.3');
	wp_enqueue_style( 'font-awesome-4-shim', '', array(), '5.15.3' ); 

	wp_enqueue_script('font-awesome-4-shim','', [], '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. 


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', "", array(), '3.6.1' );
	$scripts->add( 'jquery-migrate', "", array(), '3.3.2' );
	$scripts->add( 'jquery-ui-core', "", array( 'jquery' ), '1.13.2', 1 );