Full Frontal 2009 - The line up
This post is slightly late as the conference was on the 20th November 2009. But better late than never i guess!
The day was very wet and rainy but that didn’t take anything away from a brilliant conference. Some great speakers there: Simon Willison, Christian Heilmann and Peter-Paul Koch(ppk) to name a few.
The two highlights for me were the very entertaining talk on ‘Optimising where it hurts’ by Jake Archibold and a great introduction to node.js by Simon Willison. It was quite a technical talk and after a long day of listening to various people present it did make my brain hurt a little. I’ve added node.js to the ‘TODO’ list of things to look at… eventually.
Hopefully there will be another Full Frontal in 2010, if there is I’ll be going again.
It’s always interesting running ySlow on a website you are working on, getting that ‘warm fuzzy feeling’ when you finally get that ‘A’. I noticed while using it on nooshu that jQuery was being included twice. Version 1.4 by me in the footer.php and version 1.3.2 being included by a plug-in (or WordPress itself). Not Good. The user gets an extra 40Kb download and an added HTTP request.
A quick way to fix this is to add this to your functions.php file (located in the theme directory). The admin section will still be able to use it’s own version of jQuery due to the if statement.
1
2
3
| if(!is_admin()){
wp_deregister_script('jquery');
} |
If you don’t have a functions.php file you can create a new one and paste that code inside. While in there you may also want to include this:
1
| remove_action('wp_head', 'wp_generator'); |
That will remove your current WordPress version from your ‘head’ tag in your templates. Not a big issue but could be useful information to a malicious individual.
For more information on both functions in the WordPress codex see remove_action and wp_deregister_script
A while ago I was presented with a design that was split into 3 columns all of equal height. This isn’t usually an issue but the content within the columns was going to be content managed by the client so would always be changing (or breaking). The designer was adamant that all the columns should line up across the bottom so I decided to write a quick jQuery plug-in to do this.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
| /**
* Simple equal height columns jQuery plugin
* Usage: $(".col").equalCols();
*/
(function($){
$.fn.equalCols = function(){
//Used to sort the array
var sortNumber = function(a,b){return b - a;};
//Empty array
var heights = [];
//Save the jQuery object for manipulation at the end
var $all = this;
return this.each(function(i){
var $this = $(this);
//Push all the heights into the array
heights.push($this.height());
//Once we have looped through all elements
if($.length === i){
//Sort the array
heights.sort(sortNumber);
//Set all elements to the same height
$all.css({'height': heights[0]});
}
});
};
})(jQuery); |
As I haven’t had much need to create custom jQuery plug-ins so far this is great practice. It also shows how easy it is to add functionality using jQuery.
The downside to this is the user will need JavaScript enabled for it to work as is always the case with client side solutions. Since the user can still see the content, even with JavaScript off I see this as no big issue.
Update: I had a comment on my Snipplr account informing me about an example given on the jQuery.map() method API page. A lot less code than what I have above but may take a few minutes to get your head around what exactly is happening.
1
2
3
4
5
6
7
8
9
| $.fn.equalizeHeights = function(){
return this.height(
Math.max.apply(this,
$(this).map(function(i,e){
return $(e).height()
}).get()
)
)
} |