Monthly Archives: April 2010
I’m speaking at WordCamp Chicago
I’m excited to announce that I’m going to be headed to my childhood home metropolitan area to speak at WordCamp Chicago (and not just because it is happening only a few blocks from Mr. Beef on Orleans) . I’ll be presenting a talk entitled Building Child Themes that will be geared toward helping beginning developers take the next step in their child theme development, and solidify best practices for intermediate and advanced developers. The talk will take place at 2:00pm and is part of the developer track.
I haven’t decided exactly what areas I’ll be addressing, but I plan to draw upon the Thirty Ten and Dirty Ten themes published on this site and the Thematic Theme Options theme that I’ve been working on recently. As I write my talk over the next month, you’ll find more information here. You can can follow my WordPress Feed if you’re looking to keep up to date on it. If you have any specific child theme questions that you’d like for me to address, please comment below. Chicago, I can’t wait to see you!
Fish an chips at the horsebrass. #100meat
Tweets from the week before 2010-04-26
- Want to use Output Buffers in a Twenty Ten child theme to add a widget area? Here's how: http://bit.ly/cr2XwU #
- Pretty cool comic book style brochure done by @fromtherooftops: http://twurl.nl/y4omut #
- @Whiffies No. Party Registration is required. in reply to Whiffies #
- How the Iceland volcano ash cloud is crippling Kenya's flower industry: http://bit.ly/9PDzPK #
- @iandstewart Congrats! in reply to iandstewart #
- Had my head down coding all afternoon and just realized I didn't eat lunch. That would explain the grumbling I'm hearing. #
Dirty Ten, a Twenty Ten Child Theme using Output Buffers
After making Thirty Ten, my first Twenty Ten Child Theme, Devin Price asked for an example of a child theme that used output buffers.I’m not a big fan of using output buffers in my themes, but it’s a worthwhile trick to have in your bag. There are two main reasons for this:
- It makes code harder to read.
- It makes it so html isn’t being sent immediately to the browser, which often means your loading time increases
That being said, you shouldn’t be afraid to use them. Just make sure you are documenting your code (which you should be doing anyway), and that you are using some sort of caching so you don’t have to regenerate the page on every load (also something you should be doing anyway).
I’m going to do a quick example and show you how to make a twenty-ten child theme that adds a widget area above the image and below the Site title and Description. To do this we are going to start our buffer at wp-head and then use the filters used for the header image as an action to end it and add our widget.
<br><br>add_action('wp_head', 'head_buffer');
/**
* Start our buffer and Use filters as actions and add them to end our buffer depending on the header image
*
*/
function head_buffer(){
ob_start();
if ( is_singular() && has_post_thumbnail( $post->ID ) && $width > HEADER_IMAGE_WIDTH ) :
add_filter('post_thumbnail_html', 'clear_buffer_post_thumbnail');
else :
add_filter('theme_mod_header_image', 'clear_buffer_header_image');
endif;
}
/**
* Our filter is really an action
*
*/
function clear_buffer_header_image($html){
clear_buffer();
return $html;
}
/**
* The Buffer ender. Clear it, add to it, echo it.
*
* Replace the blank space after our site description div with our header widget. This is called by both
* of our action psuedo filters
*/
function clear_buffer(){
$buffer = ob_get_clean();
$header = preg_replace('#<div id="site-description">.*</div>#',"$0".new_header_widget() ,$buffer);
echo $header;
}
function clear_buffer_post_thumbnail($html){
clear_buffer();
return $html;
}
Our next step is to register our widget and add a function that will add the content of our widget.
/**
* This adds the content of our widget. Could we use a new sidebar-*.php file? yes, but it's easier to keep all of this in one file
*
*/
function new_header_widget(){
ob_start();
?>
<div id="headerwidget" class="widget-area">
<ul class="xoxo">
<?php if ( ! dynamic_sidebar( 'header-widget-area' ) ) : // begin Header widget area ?>
<li id="search" class="widget-container widget_search">
<?php get_search_form(); ?&>
</li>
<li id="archives" class="widget-container">
<h3 class="widget-title"&><?php _e( 'The Maker', 'dirtyten' ); ></h3>
</ul>
<li><a href='http://aaron.jorb.in'>Wordpress Developer Aaron Jorbin</a> creates themes and plugins for both the masses and the individual</li><br> <li><a href='http://aaron.jorb.in/thirtyten'>Thirty Ten</a> is a Twenty Ten Child theme designed to teach you how to make child themes</li><br> </ul><br> </li><br><br> <li id="meta" class="widget-container"><br> <h3 class="widget-title"><?php _e( 'Meta', 'twentyten' ); ?></h3><br> <ul><br> <?php wp_register(); ?><br> <li><?php wp_loginout(); ?></li><br> <?php wp_meta(); ?><br> </ul><br> </li><br><?php endif; // end Header widget area ?><br> </ul><br> </div><!-- #headerwidget .widget-area --><br><?<br> $widget_area = ob_get_clean();<br> return $widget_area;<br>}<br><br>add_action( 'init', 'dirtyten_widgets_init' );<br><br>/**<br>* Register our widget<br>*<br>*/<br>function dirtyten_widgets_init() {<br> // Area 1<br> register_sidebar( array (<br> 'name' => 'Header Widget Area',<br> 'id' => 'header-widget-area',<br> 'description' => __( 'The widget area in the Header. Optimized to use three widgets' , 'dirtyten' ),<br> 'before_widget' => '<li id="%1$s" class="widget-container %2$s">',<br> 'after_widget' => "</li>",<br> 'before_title' => '<h3 class="widget-title">',<br> 'after_title' => '</h3>',<br> ) );<br><br>}<br><br>
And that's about it. It's 111 lines after comments and white space. I'd strongly encourage you to add your own widgets, unless you want to be advertising for me
.
The only other part is our css to style the widgets. This is also simple:
<br>@import url('../twentyten/style.css');<br><br>#headerwidget{<br>clear:both;<br>width: 100%;<br>}<br><br>#headerwidget ul li{<br>float: left;<br>width: 280px;<br>margin-right: 30px;<br><br>}<br>You can check out Dirty Ten, or Download it and use it. You can also clone it from the mercurial repository.
Tweets from the week before 2010-04-12
- Here's how easy it is to create a child theme for Twenty Ten (#WordPress 3.0 default theme): http://aaron.jorb.in/?p=430 #
- @devinsays That's the Open ID plugin checking to see if your website listed is also your open id. I've temporarily disabled it. in reply to devinsays #
- @devinsays And I'll start working on a quick 'Dark Arts' Tutorial. Great Idea! in reply to devinsays #
- @iammattthomas Thanks for Twenty Ten, it enabled me to quickly build Thirty Ten: http://aaron.jorb.in/thirtyten in reply to iammattthomas #
- Congratulations to Paul Konerko on the first White Sox Home Run of 2010! #
- Thanks to @ahockley, for allowing three photos to be bundled with Thirty Ten, A Twenty Ten Child Theme http://aaron.jorb.in/thirtyten #
- You know what we call that? A White Sox Winner. #
- @curlieluck Damn. Hopefully it was an entertaining game and the fans behaved themselves. in reply to curlieluck #
- @Viper007Bond if WordPress switched to base 16 we could be coming up on version 1E.00 which would be a lot less confusing in reply to Viper007Bond #
- From earlier: here's a tutorial showing just how easy it is to create a #wordpress Twenty Ten child theme: http://aaron.jorb.in/?p=430 #
- @verso how is your first day as a dev going? Did you build the next google yet? #
- RT @sivel: Wanna know if you're you hacked? Look in your wp_options for option_name 'stylesheet' with option_value 'thesis'. #
- Know what's happening in Rwanda? You should. http://hrrfoundation.org/elections-in-rwanda-and-the-region/ #
- What to expect at the #cocktailcamp panel discussion: http://www.cocktailcamp.net/blog/2010/04/ask-your-bartender #
- Taking a bus i never took before. Hello number 10! #
- Pork and Cabbage pie from @whiffies #100meat #
- Thanks for all the Links earlier and welcome to my new followers. If I don't know you, @ me and introduce yourself. #
- @devinsays Very cool indeed. First time that's happened to me. in reply to devinsays #
- @shendison Both the hot dogs and the baseball are much better at U.S. Cellular Field in reply to shendison #
- @dtwright Congrats. in reply to dtwright #
- apt-get autoremove feels so good. I can't believe the number of unneeded packages I had installed. #
- @valentmustamin Thanks! in reply to valentmustamin #
- RT @Viper007Bond: Calling All Flowplayer Users http://v007.me/86d (I need your help!)
# - In case you are taking @Trimet to #CocktailCamp note that delays are expected tomorrow: http://bit.ly/cCxuUO #
- Cheeseburger #100meat #
- On @trimet, headed to #cocktailcamp The day is here. #
- Great turnout already for #cocktailcamp #
- If you're going to have a home bar, you have to invest in your liquor. #cocktailcamp #
- Most fruit spirits are just flavored vodka and not made from real fruit. Clear creak is all fruit. #cocktailcamp #
- Discussing creating a home bar, the first 100 dollars. #cocktailcamp #
- @m23fields haha I guess that does work out even. in reply to m23fields #
- Carnitas burrito #100meat #
- @aaronpk Only at 17, I seem to be on a bit of a kick lately. You can follow along at http://aaron.jorb.in/100meat/ in reply to aaronpk #
- @aventurene It's been great so far and I will have some reactions up on my site this week. in reply to aventurene #
- The el dude is a tequila white russian and sounds delicious. #cocktailcamp #
- Thanks to everyone who spoke, attended and helped plan #cocktailcamp Today was such a blast because of you. #
Carnitas burrito #100meat


