Alchemist

After a bit of spring cleaning, I’m happy to present to you the new Alchemi.st.

You’ll probably note immediately the new design. It’s based of an excellent, free theme called “Codium Extend” from code-2-reduction.fr. I made some minor tweaks, not enough to really call it my design at all. What’s nifty about this particular design is that it reorganizes itself automatically based on the size of the browser window. That means that alchemi.st will look good on your phone, ipad, and laptop.

What’s more interesting though, is perhaps what you might not notice: I’ve patched Automattic’s lazy load plugin so that it also lazily loads all of the youtube and vimeo videos as well. Should make the blog feel snappier.

Here’s how to patch the lazy-load plugin for iframes:

in ./js/lazy-load.js change:

1

$( 'img[data-lazy-src]' ).bind( 'scrollin', { distance: 200 }, function() {

to

1

$( '[data-lazy-src]' ).bind( 'scrollin', { distance: 200 }, function() {

and in lazyload.php add this line in right before the “return $content”

1
2
3

$content = preg_replace( '#]+?)src=[\'"]([^\'">]*)[\'"]([^>]*)>#', sprintf( '
<noscript>&amp;amp;lt;iframe${1}src="${2}"${3}&amp;amp;gt;</noscript>', 'about:blank' ), $content ); 
return $content;

And that’s it! It should work as advertised.

Additionally, I’ve updated my wordpress/nginx config so that I can concatenate and asynchronously load all my javascript from amazon cloudfront with W3-totalcache.

To get it to work, first off, you have to instruct cloudfront to forward all query strings to your blog. Secondly, you need to configure w3-totalcache to rewrite the urls for the minified javascript and css. Third, add this to your nginx configuration for your blog:

1
2
3
4
5
6
7

location ~* \.(css|js) {
  if (!-f $request_filename) {
    rewrite ^/wp-content/w3tc(.*?)/min/w3tc_rewrite_test$ /wp-content/w3tc$1/min/index.php?w3tc_rewrite_test=1 last;
    rewrite ^/wp-content/w3tc(.*?)/min/(.+\.(css|js))$ /wp-content/w3tc$1/min/index.php?file=$2 last;
    expires 365d;
  }
}

And that’s all. Let me know if you have any questions.