code snippets

Hide-my-WordPress & Autoptimize compatibility glue

by

An “Autoptimize Critical CSS“-user saw some weirdness in how the site looked when optimized. The reason for this turned out to be not the critical CSS, but the fact that he used “Hide My WordPress Pro”, a plugin that changes well-known paths in WordPress URL’s to other paths (e.g. /wp-content/plugins -> /modules/ and /wp-content/themes -> /templates) and uses rewrite rules .htaccess to map requests to the filesystem. This resulted in Autoptimize not finding the files on the filesystem (as AO does not “see” the mapping in .htaccess), leaving them un-aggregated.
To fix something like that, a small code snippet that hooks into Autoptimize’s API can do the trick;

add_filter('autoptimize_filter_cssjs_alter_url', 'rewrite_hidemywp');
function rewrite_hidemywp($url) {
    if ( strpos( $url, 'modules/' ) !== false && strpos( $url, 'wp-content' ) === false ) {
        $url = str_replace('modules/','wp-content/plugins/', $url);
    } elseif ( strpos( $url, 'templates/' ) !== false && strpos( $url, 'wp-content' ) === false ) {
	$url = str_replace('templates/','wp-content/themes/', $url);
    }
    return $url;
}

The above is just an example (as in the Pro version of hide-my-wp you can set paths of your own liking and you can even replace theme names by random-ish strings), but with a small amount of PHP-skills you should be able to work out the solution for your own site. Happy optimized hiding!

How to LYTE-n up your WooCommerce video’s

by

So you have a WooCommerce shop which uses YouTube video’s to showcase your products but those same video’s are slowing your site down as YouTube embeds typically do? WP YouTube Lyte can go a long way to fix that issue, replacing the “fat embedded YouTube player” with a LYTE alternative.
LYTE will automatically detect and replace YouTube links (oEmbeds) and iFrames in your content (blogposts, pages, product descriptions) but is not active on content that does not hook into WordPress’ the_content filter (e.g. category descriptions or short product descriptions). To have LYTE active on those as well, just hook the respective filters up with the lyte_parse-function and you’re good to go;

if (function_exists('lyte_parse')) {
add_filter('woocommerce_short_description','lyte_parse');
add_filter('category_description','lyte_parse');
}

And a LYTE video, in case you’re wondering, looks like this (in this case beautiful harmonies by David Crosby & Venice, filmed way back in 1999 on Dutch TV);

Venice & David Crosby - Guinnevere (Live on 2 Meter Sessions)
Watch this video on YouTube.

How to force Autoptimize to output protocol-relative URL’s

by

Autoptimize by default uses WordPress’ internal logic to determine if a URL should be HTTP or HTTPS. But in some cases WordPress may not be fully aware it is on HTTPS, or maybe you want part of your site HTTP and another part (cart & checkout?) in HTTPS. Protocol-relative URL’s to the rescue, except Autoptimize does not do those, right?
Well, not by default no. But the following code-snippet uses AO’s API to output protocol-relative URL’s (warning: not tested thoroughly in a production environment, but I’ll happy to assist in case of problems):

add_filter('autoptimize_filter_cache_getname','protocollesser');
add_filter('autoptimize_filter_base_replace_cdn','protocollesser');
function protocollesser($urlIn) {
  $urlOut=preg_replace('/https?:/i','',$urlIn);
  return $urlOut;
}

3 interesting WordPress plugins

by

I came across some interesting WordPress plugins and thought I’d document these quickly;

  1. Warm Cache; have your site crawled based on your sitemap.xml to re-generate your cache (applicable to both your page cache and Autoptimize’s cache)
  2. Duplicator: export your entire WordPress installation to an archive and install elsewhere. Haven’t tried this yet, but might come in very handy at some point.
  3. Code Snippets: don’t burden your theme’s functions.php with your own code (risking losing the changes with a theme update), but use Code Snippets instead. Handy if you want to e.g. tell Autoptimize not to be active on specific pages or if you want WP YouTube Lyte to also act on youtube-links in text widgets for example.