Category Archives: Web development

Blogposts on blog.futtta.be about “web development”; looking into frameworks, security, best practices, the use of Flash, usability and accessibility, …

WP Safer Cache: stopgap for WordPress Cache plugins vulnerability

4 Replies

[UPDATE April 18th 2013: this vulnerability has been fixed in both WP Super Cache and W3 Total Cache. You can find more information in this "post mortem" blogpost]

[UPDATE April 11th to reflect that WP Super Cache version 1.3 fixed this issue]

There was a pretty severe vulnerability in WordPress installations that had WP Super Cache (until version 1.2, 1.3 fixed this issue) or W3 Total Cache (up until version 0.9.2.8) plugins activated. This security bug would, under certain circumstances, allow attackers to inject and execute arbitrary PHP code in comments.

The vulnerability could have been handled in WordPress core or in WP Super Cache and W3 Total Cache separately (with my preference being a fix in  comment sanitization in core). On April 11th WP Super Cache version 1.3 was released, fixing this issue and W3 Total Cache released a fix on April 18th. If you are on an older version of WP Super Cache or W3 Total Cache (do upgrade!), you might be interested in installing this little plugin that cleans out malicious … stuff from comments being posted.

As always; comments, bugs & improvements are welcome in the comment-field below or via the contact form.

The best WP YouTube Lyte to date!

17 Replies

Today WP YouTube Lyte 1.2.0 got finally pushed out the gates! This new version is beyond any doubt the best version to date, with the following new features:

  • LYTE embeds are now fully responsive
  • automatic inclusion of scheme.org microdata (VideoObject) (also known as “rich snippets”)
  • even better performance (less requests; was 5, now 3)
  • updated to the current YouTube look & feel, see this YouTube video about microdata:
Introduction to Rich Snippets

Watch this video on YouTube or on Easy Youtube.

Although I did go through a small beta-cycle, with feedback from 5 users (thanks guys), I am pretty sure there still are bugs that will rear their ugly head in the following days (some strings haven’t been translated yet, for example). Do contact me, add a comment here or create a post on the wordpress.org forum in case you encounter unexpected behavior!

Multi-lingual WordPress the Easy Way

Leave a reply

Imagine you run WordPress with English as default language, but some posts are in another language. Dutch, maybe? Up until a couple of months ago, you wouldn’t really notice anything about that setup. Google might be slightly confused, but us bloggers aren’t really into SEO anyhow, no? But with the release Safari 5.1, Firefox 16 and especially Internet Explorer 10, support for CSS Hyphenation became (somewhat) widely available and if your theme (WordPress TwentyTwelve or its performance-optimized 2012.FFWD child theme for example) has support for in the CSS, your hyphenation would yield weird results because of the fact that the browser uses the language attribute in the HTML to decide which dictionary to use.

The solution, if your theme is HTML5, is to add the lang-attribute to the article-tag if you have something to check the language with. In my case I just had to copy TwentyTwelve’s content.php and change line 11 into:

<article id="post-<?php the_ID(); ?>" <?php if (in_category('lang:nl')) { ?>lang="nl" <?php } ?><?php post_class(); ?>>

A real simple hack indeed; I check if the article has category “lang:nl” attached to it (which I already used) and set the language-attribute with the correct value if it does. Hyphenation now works for Dutch blogposts and I guess Google will be happier as well that way?

And now you can even have my WordPress password!

Leave a reply

Being slightly obsessed with security, I was delighted to discover that two factor-authentication (OTP) using Google Authenticator client is not restricted to Google applications, but is fully standardized and as such can be implemented without dependency on Google services on any system. There is code (off course varying in quality and scope) available for PHP, .NET, Java and Python (and I’m sure there are others).

As you might expect after reading the title, there is a great Google Authenticator WordPress plugin which I installed in 5 minutes time earlier today. For the Drupal-heads; Antwerp-based Attiks have a module that implements Google Authenticator OTP which looks worth checking out as well (and I’m interested in your experiences with it, actually).

Do background-images lazy-load with display:none?

Leave a reply

So, do background-images lazy-load with display:none? I did a quick test by loading this testpage created by Steve Souders on webpagetest.org. These are the results:

Conclusion: don’t rely on setting display:none on background-images to have them lazy load.

Site slower with CDN? Check your CSS!

Leave a reply

A couple of days ago we implemented a CDN for a Drupal-based website, using MaxCDN/ NetDNA and the Drupal CDN module. We were very surprised to discover the site became … slower. It took us some time to identify the problem, but CSS turned out to be the culprit;

  1. The supplier created separate CSS-file for each and every template using SASS, causing some automated duplication of CSS
  2. Some of that CSS was not in the theme .info-file and wasn’t added using drupal_add_css either, but the link was hardcoded in the template-file
  3. The CSS that was added the normal way (i.e. not hardcoded in the template) was picked up and modified by the CDN module (changing paths for e.g. images and fonts into URL’s pointing to the CDN)
  4. CSS that was hardcoded in the template was not visible for the CDN-module, so the paths were not updated and still pointed to the origin webserver
  5. Because of duplication of e.g. background-images and fonts, pointing at both the CDN and the origin-server, these assets were downloaded twice and the extra file-size resulted in a site that was slower with than without a CDN

Once we understood the problem, the solution was pretty simple;

  1. clean up the CSS, avoiding to re-declare e.g. @font-face in multiple templates (resulting in a smaller CSS file download size as well)
  2. add CSS using drupal_add_css (with the option not to aggregate, as IE8 might choke on the massive amount of CSS) for the CDN module to take that into account as well

Web Performance Optimization can be so much fun!

lyteShare.js high-performance social widget for your sharing pleasure

4 Replies

Based on last week’s performance analysis of popular sharing-services (AddThis, ShareThis and Lockerz/AddToAny) I decided to continue working on my high-performance & privacy-respecting but rather ad-hoc lyteShare alternative. The result is a 1.6Kb JavaScript file (or the non-minimized version here) that, upon being included in a HTML-file, looks for a div like this one:

<div class="lyteShare twitter googleplus facebook"></div>

and adds sharing-buttons for Twitter, Google+ and Facebook to that div (Linkedin, Yammer and Tumblr are also supported). You can see lyteShare.js in action on this test-page. The webpagetest.org test result is great when compared to that of the big boys;

ShareThisAddThisLockerz/ AddToAnylyteShare.js
Document Complete0.677s0.487s1.352s0.364s
Start Render0.715s0.279s0.304s0.275s
Fully Loaded1.507s3.718s1.407s0.596s
Full Download size70 KB384 KB 111 KB9 KB
WebPageTest URLsharethis resultaddthis result lockerz/ addtoany resultlyteshare result
3rd party tracking?yes yes yesno

Now the question is; does the world really need yet another social sharing widget solution, even if it is easy, fast & not a vehicle for 3rd party behavioral web tracking? Does the world (and this blog) even need social sharing widgets at all?