December 11, 2015 at 4:11 pm | Programming, web, Wordpress.

If you have upgraded your WordPress to 4.4 and have a secure HTTPS URL, you might be experiencing image problems due to a mixed content URL message in the browser. Some browsers will display the content and give you a message that it is mixed and some will block the content all together.

The new WordPress responsive sourceset image addition could be the problem.

The image itself is coming from the HTTPS secure URL, but the alternate image sizes in the image sourceset tag might be coming from HTTP if your config.php URLs are set a certain way.

This will cause image problems.

define('WP_SITEURL',     'http://www.NAMEOFYOURSITE.com/');
define('WP_HOME',        'http://www.NAMEOFYOURSITE.com/');
define('WP_CONTENT_URL', 'http://www.NAMEOFYOURSITE.com/wp-content');

This will fix it.

define('WP_SITEURL',     'https://www.NAMEOFYOURSITE.com/');
define('WP_HOME',        'https://www.NAMEOFYOURSITE.com/');
define('WP_CONTENT_URL', 'https://www.NAMEOFYOURSITE.com/wp-content');

If you want to be able to have your local dev site without https in those variables you can just do a switch statement in the config.php based on the URL.

switch ($_SERVER['HTTP_HOST'])
{
	case 'NAMEOFYOURSITE.com.dev':
                 define('WP_SITEURL',     'http://www.NAMEOFYOURSITE.com/');
                 define('WP_HOME',        'http://www.NAMEOFYOURSITE.com/');
                 define('WP_CONTENT_URL', 'http://www.NAMEOFYOURSITE.com/wp-content');
		break;
	case 'www.NAMEOFYOURSITE.com':
		define('WP_SITEURL',     'https://www.NAMEOFYOURSITE.com/');
                define('WP_HOME',        'https://www.NAMEOFYOURSITE.com/');
                define('WP_CONTENT_URL', 'https://www.NAMEOFYOURSITE.com/wp-content');
		break;	
}