Sayontan Sinha is a technology strategy consultant living in Houston, Texas. Coding is his hobby, as are philately, numismatics, classical music, creative writing and quizzing. He is the author of numerous pieces of WordPress software, including the ultra-popular Suffusion WordPress theme and the versatile Photonic (for Flickr, Picasa, Smugmug and integration) and FontMeister.

Jun 172010

After months of waiting and after a series of Beta versions and Release Candidates WP 3.0 finally came out today. I encourage all of you to upgrade your installations.

Why Should You Upgrade?

Version 3.0 is a significant release that has a lot of terrific features. Here are some:

  1. Menus
    This is arguably the most awaited feature of WordPress. This is  a huge relief for developers more than users as we don’t have to code our themes to provide you with a mechanism to select pages / categories / links to build the menu. As long as the themes offer basic WP 3.0 menu support you are good to go. You can build and structure your menus as and how you want with very little restrictions.
    Suffusion has supported native menus from version 3.5.0.
    It has been brought to my notice that WP pulled a little trick here. In the release version they changed a call ever so slightly, thereby making it seem like menus don’t work in Suffusion 3.5.3 (and a bunch of other themes that claim to support menus). To fix this:
    1. Open functions.php in your theme editor
    2. Search for the line that says add_theme_support(‘nav-menus’);
    3. Change that to say add_theme_support(‘menus’);

    That’s all.

  2. Integrated Multi-User Code
    With WP 3.0 the two branches of code, WP-MU (multi-user) and WP have been merged. You need to tweak a few settings to convert your site from a regular WP site to a WP-MS (multi-site) installation. You can start by creating a network.
    Suffusion can be used for WP-MS and can be made to work with BuddyPress too for a better experience.
  3. Custom Post Types and Custom Taxonomies
    The next big feature for folks wishing to use WordPress as a full-blown CMS is the concept of Custom Post Types and Custom Taxonomies. This offers limitless possibilities. If you have a site where you do reviews of books, movies and music, you can create custom post types for each of those, then associate custom taxonomies to them, like authors for books, actors and directors for movies and artists for music albums. In a theme that supports child themes you can suitably create your own templates for each of these post types and make them appear very different from the regular “blog” look.
    Suffusion added a plugin-like feature to let you define custom post types and taxonomies in version 3.5.3. This functionality will be enhanced in the next few releases.
  4. Native Support for Custom Header and Custom Background Images
    Now theme developers don’t have to code up a bunch of stuff to handle custom header images and background images. Of course, if you are like me you might still want to code up things – coding definitely gives you a lot of flexibility.
    Suffusion doesn’t support this feature at present, but it will, very soon. I couldn’t beat the WP 3.0 deadline, to be honest :-)

Why Shouldn’t You Upgrade?

Simple answer – themes and plugins. Before you upgrade make sure that your theme is tested to work for the theme you are using. I am assuming that you are not necessarily a Suffusion user, so if you are using a theme that is not compatible and you upgrade, you will find yourself on a sticky wicket.

Another reason why you shouldn’t upgrade is if you have some indispensible plugin that is not tested on WP 3.0.

How Should You Upgrade?

If you don’t see an option on your admin Dashboard to upgrade, head over to Tools → Upgrade and then do the upgrade.

There is always the manual upgrade option, where you can download the zip file from WordPress, unzip it and overwrite everything apart from the wp-content folder.

What? No Suffusion News?

Come on! You cannot expect me to sign off without talking about the progress on Suffusion!

I have been busy the last week adding some optimization-specific stuff to Suffusion, like an ability to use GZip compression and minification on CSS and JavaScript. I have been largely successful in improving a lot of things, significantly bumping up the scores on Google Page Speed and Yahoo YSlow. Mind you, YSlow is quite hard to please – Yahoo’s own site scores a “B” grade on its performance test.

I have also been working on a ton of other stuff, small and big. Stay tuned – a new version will be submitted soon.

Jun 092010

Since it has been exactly 2 weeks after my submission of version 3.5.2 and I have heard nothing useful from the folks at WP despite my queries, I have decided to take some drastic measures resulting in some bad news and some good news.

The Bad News
I have pulled BuddyPress support from the theme. All the folders have been removed and a trimmed down version has been resubmitted as version 3.5.3 to WordPress for approval. I would have liked to be a complete theme with BP support, but 2 weeks for approval is simply not acceptable. I hope all of you agree.

The Good News
Of course, my conscience wouldn’t let me leave you in the lurch, so you will get the next best thing – a plugin that you can use on Suffusion and any child theme.

The Bad News – 2
Given the nature of changes in 3.5.3 I couldn’t do the theme AND the plugin. So the plugin is not yet developed.

The Good News – 2
While I haven’t got the plugin ready, you certainly can try out the BP functionality!!! Head over to the plugin page, or what will become the plugin page – right now it has instructions for you to make this work. Go ahead and give it a shot and let me know what you like / dislike.

And now for the details of version 3.5.3:

  1. Removed BuddyPress Support
    As described above. I haven’t removed the style information from the theme’s stylesheets, though. Just the files for BP have been removed.
  2. Bug Fixes
    There were some issues with BP styles, particularly for IE. Those have been addressed. Also the introduction of the body_class() call caused some unexpected styling issues – they have been addressed, too. Then there was an issue with the registration on the multi-site setup of WP, where the form was not rendering correctly. That has been taken care of.
  3. Custom Post Types and Custom Taxonomies
    This is the biggest feature of this release. Custom Post Types have been supported in version 2.9 of WP, but WP 3.0 takes it a lot further. I have provided a UI for you to add custom post types and custom taxonomies. This development took a good bit of time and testing. Here are the highlights:
    1. The Options menu has been subtly reorganized. You earlier had the options accessible through the “Appearance” menu:
      Now Suffusion has its own menu with an ability to set theme options or define custom types:
    2. The major sub-feature here is the use of AJAX in the “Custom Types” section. People have complained regarding the fact that Suffusion does a “resubmit” of the options, reloading the page. What is not often understood is that the options UI for Suffusion is phenomenally complex and handling it all through AJAX is not feasible because you will lose the spiffiness that you currently have in the back-end. However I gave AJAX a shot in the Custom Types menu and tedious though it was, I might consider extending AJAX support to the main options page. The UI is still rough around the edges, but I will polish it in the coming weeks.
    3. You can set up custom post types for books, movies, music albums, support forums etc. You can associate your own taxonomies to these, like genre, rating, writer, support-type etc. You can include these in WP 3.0 menus and a bunch of other places, and in general you can make your site a true CMS site.
    4. In conjunction with child themes you can create your own custom layouts for each custom post type.
  4. Support for hAtom Microformats
    Your posts and pages now support the hAtom Microformat, which will  help microformat-capable browsers and browser-plugins detect post content much better.

I am sincerely hoping that 3.5.3 will get approved quickly. And I am hoping even more that you will like this triple release.

Jun 032010

Six days after submitting version 3.5.2 of Suffusion for approval I contacted the folks who do the approvals. The news I received was somewhat discouraging. Since I tagged my theme with “buddypress” because it is now BuddyPress-enabled, it goes into a different review queue. The person who does the approvals there is apparently behind, so I don’t know when this version will be available. Let’s keep our fingers crossed, because there were a lot of things in 3.5.1/3.5.2 that were non-BP features.

Jun 012010

Minutes after making my submission of version 3.5.1 I realized that there were some errors that had inadvertently crept in because I used the body_class() method. So I had to fix the errors and resubmit the theme, but as version 3.5.2. Now, I had already laid out plans for 3.5.3 before making these changes, so another feature found its way in. So here are the changes for 3.5.2:

  1. Support for Child Themes
    This was another of those long-time to-do activities that I finally got around to delivering. This was surprisingly easy to incorporate and I just had to make a handful of changes. You can now define child themes for Suffusion. This is very easy for you as well. Let us assume that you will create a child theme called “Son of Suffusion”. Here is what you will do:
    1. Create a folder called son-of-suffusion under wp-content/themes.
    2. Create a file called style.css in this folder. Put in these lines:
      Theme Name: Son of Suffusion
      Theme URI: http://your-theme-url
      Description: Child Theme based on Suffusion
      Version: 1.0.0
      Author: Your Name
      Author URI: http://your-url
      Template: suffusion
      @import url("../suffusion/style.css");
    3. The last line in comments, “Template: suffusion” is critical. It tells WP that your theme is based on Suffusion. Make sure that what you put in there is the directory where Suffusion resides.
    4. The first line after the comments is important if you want to use the Suffusion stylesheet. If you don’t have it, Suffusion’s styles will not be loaded.
    5. That’s all, really. You can add additional styles if you wish. This would be one way to not use the “Custom Styles” option. You can also add a functions.php and define your own PHP functions there. That would be one way to avoid using the “Custom PHP” functionality. Note the following:
      1. What you define in functions.php adds on to the existing functions in Suffusion’s functions.php file.
      2. Any other template file that you add overrides Suffusion’s templates. So if you create your own author.php file, that will take precedence over Suffusion’s author template. One very important use of child themes is if you want custom templates for custom purposes. E.g. You can create a file called category-16.php and define a special layout for your category with id 16. You can also create author-specific templates for WP 3.0. See WP’s template hierarchy for more details regarding how to add custom templates.
    6. Suffusion’s huge array of options will all be available to you using this method. Ensure that you keep the theme up-to-date.
  2. Bug fixes for some errors introduced by the body_class() function, for static pages. Of course, after submitting 3.5.2 I caught another of these errors for author pages, but I am not going to bother with another release before WP approves my current release.

That’s it for now. I guess 3.5.2 will be a significant release for you users because it will come armed with both BuddyPress support and Child Theme support. So just keep waiting for WP to approve, while I figure out how to make some more WP 3.0 functionality available to you.

May 282010

I submitted version 3.5.1 about a couple of hours back today, which is a pity because I believe I missed the bus for it being approved today, which is an even bigger pity since it will probably not be approved before Tuesday (1st June). Sad, because it has one HUGE feature.

  1. BuddyPress Compatibility
    After quite a few months of procrastination I finally bit the bullet and built full BuddyPress integration capabilities with the theme. It was not a difficult task thanks to the BP Template Pack plugin, but it took a really long time to implement. I had to go through a large number of files, check the layouts for each of those, modify all my stylesheets etc, because the output that I was getting was simply ugly. Also, the BP Template Pack plugin is still in its evolving stages, so there is a lack of consistency in the way it does its HTML markup.
    Mind you, you don’t need the BP Template Pack plugin to enable BP integration with Suffusion. This release takes care of that. Of course, you do need the BuddyPress plugin itself :-).
    As I mentioned, this was a very long exercise and I got a bit desperate towards the end last night. As a result some minute errors might have fallen through the cracks. Please feel free to post them on the support forum.
  2. Bug Fixes
    Surprisingly there were some unexpected bug fixes. I say unexpected because they came up in functionality that has existed for a long time.
    The first was in the “Page of Posts” template, where if you chose to display posts in the “List mode” the output came out wrong.
    The second was a 2-pronged bug in the image fetching function. The “Tiles mode” and the “Magazine layout” were not picking up an image defined as a thumbnail through WP’s native thumbnail feature. Plus under certain conditions TimThumb was not being invoked for resizing the images. I have fixed both of these. Note that if you are using WP’s native thumbnails you will not be able to resize them using TimThumb (I will have to investigate if it is possible to integrate TimThumb with native thumbnails)
    The third was in the Search results. I had never realized that the Search results were showing a date box and categories even for pages. Combined with the fact that I recently added some support for WP’s post_class() function, the net result was that the date was showing up for pages in search results in a really ugly manner.
    The fourth fix is for the static tabbed sidebar, where a div element within the custom tabs would automatically get hidden. Now it won’t.
  3. New Features
    I added a capability to disable the “date box” on the search results page. This will ensure that a page returned in a search result doesn’t look dramatically different from a post.
    I also added in the body_class() call to the body element of the HTML markup.

With this release I can lay serious claim to be able to support the multi-site capability of WP. If you weren’t aware, WP and WP-MU (Multi-user) are merged in version 3.0 of WP. So you can run WP in a single-site mode (default) or in multi-site (MS) from the same installation. Suffusion always worked fine with WP-MU, but BP integration had been a headache.

I still have to test out one tiny little to-do item – TimThumb integration with WP-MS, and I promise to do it soon.

This whole process of making the theme extract full mileage from WP 3.0 is getting very exciting. Let’s see what I can do with the remaining features.

May 272010

In the release notes for version 3.5.0 of Suffusion I mentioned that native tabbed sidebar support was added. Since I am quite proud of the technique I used to get this effect, I decided to write a tutorial on how to do it. But first I would like to pay homage to the following that helped me visualize the solution:

  1. How To Create Tabs Using JQuery – This article by Justin Tadlock, the creator of the awesome Hybrid Theme, was something I used for version 2.0 of Suffusion, where I introduced the tabbed options panel of Suffusion.
  2. Widget container HTML (and missing titles) – A thread on the WP forums started (and resolved) by DigitalNature, the creator of the Mystique and some other popular themes, regarding an issue with widgets that do not have titles

The Foundation

If you go through Justin’s tutorial you will get the basic gist of how to build a tabbed box. Basically you need to set up 3 things:

  1. The HTML markup
  2. The CSS
  3. The JQuery for the actual tab effects

The HTML markup requires your page’s source code to look similar to this (like Justin’s example, the differences being in the way I named my classes):

<div id="sidebar" class="tabbed-sidebar">
	<!-- The tabs -->
	<ul class="sidebar-tabs">
	<li id="t1" class="sidebar-tab t1"><a class="sidebar-tab t1" title="Tab 1">Tab 1</a></li>
	<li id="t2" class="sidebar-tab t2"><a class="sidebar-tab t2" title="Tab 2">Tab 2</a></li>
	<li id="t3" class="sidebar-tab t3"><a class="sidebar-tab t3" title="Tab 3">Tab 3</a></li>
	<li id="t4" class="sidebar-tab t4"><a class="sidebar-tab t4" title="Tab 4">Tab 4</a></li>

	<!-- tab 1 -->
	<div class="sidebar-tab-content sidebar-tab-content-t1">
	<!-- Put what you want in here.  For the sake of this tutorial, we'll make a list.  -->
		<li>List item</li>
		<li>List item</li>
		<li>List item</li>
		<li>List item</li>
		<li>List item</li>

	<!-- tab 2 -->
	<div class="sidebar-tab-content sidebar-tab-content-t2">
	<!-- Or, we could put a paragraph -->
		<p>This is a paragraph about the jQuery tabs tutorial.</p>

	<!-- tab 3 -->
	<div class="sidebar-tab-content sidebar-tab-content-t3">
	<!-- Or, we could add a div -->
		<div>Something needs to go in here!</div>

	<!-- tab 4 -->
	<div class="sidebar-tab-content sidebar-tab-content-t4">
	<!-- Why not put a few images in here? -->
			<img src="image.gif" alt="Sample" />
			<img src="image.gif" alt="Sample" />
			<img src="image.gif" alt="Sample" />

</div><!-- tabbed-sidebar -->

Now for the JQuery code to run this:

$j = jQuery.noConflict(); 

$j('div.tabbed-sidebar ul.sidebar-tabs li:first').addClass('sidebar-tab-first');
$j('div.tabbed-sidebar div.sidebar-tab-content:first').addClass('sidebar-tab-content-first');
$j('div.tabbed-sidebar div.sidebar-tab-content').hide();
$j('div.tabbed-sidebar ul.sidebar-tabs li.sidebar-tab-first a').addClass('tab-current'); 

$j('div.tabbed-sidebar ul.sidebar-tabs li a').click(function(){
	var thisClass = this.className.substring(12, this.className.length);
	$j('div.tabbed-sidebar div.sidebar-tab-content').hide();
	$j('div.tabbed-sidebar div.sidebar-tab-content-' + thisClass).show();
	$j('div.tabbed-sidebar ul.sidebar-tabs li a').removeClass('tab-current');

The above code simply does the following:

  1. Adds the classes “sidebar-tab-first” and “sidebar-tab-content-first” to the tab and content. We could have done this directly in our markup, but the reason for doing it in JQuery will soon become clear.
  2. Hides all “content” divs, shows the first content div (with class sidebar-tab-content-first), then adds the “tab-current” class to the first tab (with class sidebar-tab-first)
  3. Adds a click function to each tab, making it display the associated content by determining the class of the tab.

So Where is the Problem?

So far we have done something fairly simple for a person with basic JQuery knowledge. The problem lies in tying this with dynamic sidebars. Consider the fact that the definition of a sidebar requires the following parameters:

  1. $before_widget
  2. $after_widget
  3. $before_title
  4. $after_title

These are parameters that apply to the creation of individual widgets, not the overall sidebar. If you notice our HTML markup in the previous section, we have created separate sections with all the tabs isolated from the content. But this is not possible for widget definition!! In other words, the widgets print one after the other, so each tab (i.e. the title of a widget) is grouped with the body of the widget, followed by the tab for the next widget and its body, etc. In WP-speak, the widgets typically print $before_widget, then $before_title, then the title, then $after_title, then the content and finally $after_widget. Or course there is nothing preventing a widget author from going bonkers and messing up the order, or not using one of the tags above etc. But that is the widget author’s problem. Assuming that the widgets are coded in a standard fashion, the code doesn’t quite render in a way conducive to tabbed sidebars.

The Fix

The fix is intuitive and is wholly borrowed from the WP forum post I lined to in the above. First we register the sidebar with parameters as follows:

  1. before_widget: ‘<li id="%1$s" class="sidebar-tab %2$s"><a class="sidebar-tab">’
  2. after_widget: ‘</div></li>’
  3. before_title: ” (a blank)
  4. after_title: ‘</a><div class="sidebar-tab-content">’

Note the following:

  1. We are creating the content as a “div” object within the “li” object.
  2. We are unable to assign the widget class (“%2$s”) or the widget id (“%1$s”) to the “a” element.

Now we will pull a trick using JQuery. We will modify the JQuery code thus:

$j = jQuery.noConflict();

$j('.sidebar-tab .sidebar-tab-content').each(function() {
	var parentId =;
	var parentClass = this.parentNode.className;
	parentClass = parentClass.substring(12);
	$j(this).addClass('sidebar-tab-content-' + parentId);

$j('.tabbed-sidebar ul.sidebar-tabs a').each(function() {
	var parentId =;

$j('div.tabbed-sidebar ul.sidebar-tabs li:first').addClass('sidebar-tab-first');
$j('div.tabbed-sidebar div.sidebar-tab-content:first').addClass('sidebar-tab-content-first'); 
$j('div.tabbed-sidebar div.sidebar-tab-content').hide();
$j('div.tabbed-sidebar ul.sidebar-tabs li.sidebar-tab-first a').addClass('tab-current'); 

$j('div.tabbed-sidebar ul.sidebar-tabs li a').click(function(){
	var thisClass = this.className.substring(12, this.className.length);
	var parentId =;
	$j('#' + parentId + '.tabbed-sidebar div.sidebar-tab-content').hide();
	$j('#' + parentId + '.tabbed-sidebar div.sidebar-tab-content-' + thisClass).show();
	$j('#' + parentId + '.tabbed-sidebar ul.sidebar-tabs li a').removeClass('tab-current');

What we did is this:

  1. After the page was loaded, we moved the “sidebar-tab-content” objects out of the “li” objects and appended those to the “sidebar-tabs” list as a whole. We did this by smart use of the JQuery “appendTo” function to add every tab’s content to its grandparent.
  2. Did all the necessary class additions that we couldn’t in our widget setup, again by fetching it from the parent / grandparent and using the “addClass” function.
  3. Added other necessities like the classes for the first tab etc.

That’s basically it. The JavaScript neatly rearranges our code into something conducive for tabbing, then applies the tabbing effects.

Is Everything Hunky-Dory?

Maybe. Let’s first see what advantages it gives us:

  1. You are not constrained by a rigid framework. Most of your widgets will seamlessly tie in with this sidebar.
  2. With a little extra effort you can make every sidebar behave this way without repeating this code. You just have to be smart with the sidebar ids and use them while doing the hide/show.

Now let’s first examine cases where the tabbing will not work:

  1. If your widget has no title, obviously there is no handle for the content in the tab-bar and the result is not pretty. This is not a shortcoming of the code – it is more like a user error. Imagine looking for a document without a title.
  2. If a widget author has not followed standard WP guidelines and has ignored the $before_title and $after_title tags and decided to specify his own, that too will cause issues, because the JQuery is relying on certain classes to be named in a certain manner. As I mentioned in the previous section, this is really bad coding on the part of the widget author.

Lastly let’s see what the pitfalls are:

  1. If your page is not using JQuery currently, adding this capability will require it to do so. That might slow your page down.
  2. If you have a lot of content on your page and if your images are heavy, the JQuery code will be the last to load. While your page is loading the users will see a haphazard layout of the sidebar and once the script is executed at the end of the page load the layout will click in place.

That’s about it. If anyone has a better approach do let me know.

May 202010

I submitted version 3.5.0 of Suffusion a few minutes back for approval. With this release, as promised, I have taken a major step towards supporting WP version 3.0. Here are the key features of this release:

  1. Support for WP 3.0 Menus:
    Initially this was a desperate measure. Some folks testing with WP 3.0 Beta 1 complained that they could not see the list of pages in the navigation bar setup. I did some debugging and found that this wasn’t a fault of the theme, but rather the functionality in the beta release itself was broken. Not knowing when the WP bug would be fixed, I decided to support the menu feature provided in WP 3.0. Of course, by the time I actually started writing the functionality Beta 2 was released and it fixed the original problem. I introduced the support, nonetheless. To use this feature go to Suffusion Theme Options → Blog Features → Main Navigation Bar Setup and Top Navigation Bar Setup and scroll to the section that says WP 3.0 Navigation Menus. This will only work if you have WP 3.0. Before you rush off to install 3.0 be warned that it is still in Beta, so a lot of things will not work as desired.
  2. Native Tabbed Sidebars:
    This was something I had in mind since a really long time, but I had never gotten around to coding it. This is similar to the “Tabbed Sidebar” setup you do in the Blog Features, but with a huge difference: it applies directly to the sidebar!!! In other words, if you go to Suffusion Theme Options → Visual Effects → Sidebars and Widget Areas and set the style of Sidebar 1 to be “Tabbed”, you can add widgets directly to your sidebar and have them show up as tabs. You don’t need to search for short codes to enter in the Custom Tab setup that Suffusion had so far.
    Mind you, there are some caveats – the widgets you add to the sidebar must have a title. Also, they must be “good” widgets following standard coding practices. In other words, the widget authors must take care to use the standard WP tags, $before_widget, $after_widget, $before_title and $after_title while coding their widgets. That means the NextGEN Gallery widget will not work in the tabbed sidebar (Apologies to fans of that plugin, but the widget that comes with it doesn’t follow WP coding guidelines).
    As far as I know Suffusion is the only free theme (and possibly the only theme, free or premium) that offers the capability to have your sidebar show tabs natively. Isn’t that cool? I am going to write up a tutorial on how to do this in a few days.
  3. Bug Fixes:
    I fixed a bug that was causing the title of the magazine section excerpts to show up supersized. Another bug that I fixed was that the JQuery Cycle script was being included twice. Thirdly, there was a minor alignment issue in the comments section, brought around by the relative font-sizing. That is now fixed.
  4. General Changes:
    I have merged the content of plugin.css with the main content. This should reduce one HTTP call from the page. I have also made the fonts for different headers slightly smaller, just to make things appear more pleasant.
  5. New Translation:
    Abe Li has graciously provided a Chinese translation that I have included in this version. Thanks Abe!

I have been delving deeper into WP 3.0 and there are a lot of things I can see that I like:

  1. One big “to-fix” item on my list is full BuddyPress support. In WP 3.0 WP and WP-MU have been integrated, but with one major caveat. Previously you could install WP-MU in a sub-directory on your site, but with the merger, WP cannot be installed in its own directory. This poses a challenge for me, as I have to figure out how to test this setup – I always have WP installed as a sub-directory and I don’t have domains where I could test this.
  2. Another really interesting feature is “Custom Post Types” and “Custom Taxonomies”. The reason I call this interesting is because the themes that will truly benefit from this are full-blown frameworks (like Thematic, Hybrid etc) rather than classical themes like Atahualpa or Suffusion. Of course, Suffusion has enough hooks to have its own child themes, so I have to give this some more thought.
  3. Some rather basic capabilities have been provided like native support for custom headers and custom backgrounds. Since Suffusion already has extensive capabilities in this space, this is not urgent on my priority list.
May 182010

One of Suffusion’s neat little features is the Custom Styles option. Based on some feedback that I had received from some users, in release 3.4.2 I provided a way to bundle custom PHP with your installation.

In this post I will walk you through the following scenarios explaining how you can use this functionality:

  1. Adding your own meta tags.
  2. Creating your own short codes.
  3. Passing extra parameters to queries for fetching posts.

Here is how you begin:

  1. Create a PHP file called, say, custom-code.php. Put this file somewhere under your “wp-content” folder, but not under the “suffusion” folder. If you put it in the “suffusion” folder it will get overwritten upon an upgrade!
  2. Go to Suffusion Theme Options Blog Features Custom Includes Custom PHP. Put in the file name with the path, as instructed.
  3. Now for some serious business. Open the file you created in an editor. You could use any editor that you want (but not a Word Processor!!), like Notepad or Vim or Emacs or EditPlus or Textpad. Your choice depends on your individual preferences and your Operating System. I personally use Vim for editing minor things because of my Unix-based background, and a full-blown IDE like PhpStorm or Aptana Studio or Eclipse for the heavy-duty stuff.
    Now build the shell for the file as follows:
     * Custom includes

    Make sure that you have no white-spaces or new lines or text before the “<?php” or after the “?>”. This is critical. If you have spaces there, you will get nasty PHP errors that will require you to replace file/folder contents using FTP.

Now let us address each of our scenarios.

Scenario 1: Adding your own meta tags

This is something I have addressed on the support forum. Let’s say you want to create your own meta tags with name “my-custom-tag” and value “my-custom-tag-value”. Here is what your code looks like:

 * Custom includes
//The hook for publishing the document header is suffusion_document_header.
//This tells the code to add an extra action to suffusion_document_header:
add_action('suffusion_document_header', 'suffusion_include_custom_meta_tags');

function suffusion_include_custom_meta_tags() {
    echo "<meta name=""my-custom-tag"" content=""my-custom-tag-value"" />n";;

That’s it. You can add as many “echo” statements as you want in the “suffusion_include_custom_meta_tags” function.

Scenario 2: Creating your own Short Codes

The ability to use your own short codes with Suffusion speeds up things several notches. The following code is from one of my previous posts, and it demonstrates how to add a short code that will execute any PHP function. You can add it within the “<?php” and “?>” tags:

function sc_php_function($attr) {
    $function = $attr['function'];
    $params = $attr['params'];
    $params = explode("||", $params);

    if (is_callable($function)) {
        $ret = call_user_func_array($function, $params);

    return $ret;

add_shortcode('php-function', 'sc_php_function');

This will create a short code called “php-function” which is like RDX – it will let you execute any PHP function from within a post or a page.

The short code above is dangerous if you have a multi-user blog, or if you are using a plugin that enables short codes in the comments section, because it will let anyone execute any PHP function on your site – it is a significant security risk, so use it with utmost care!


Scenario 3: Passing extra parameters to queries for fetching posts

I recently introduced a hook called “suffusion_query_posts”. This hook is executed before your posts are parsed (aka The Loop), so you can use this to modify what you want to display. It is present on different templates, like Author, Category, Date, Index, Page of Posts, Search and Tag. Let’s say you want to exclude posts belonging to the category with id 15. Here is what you add in the PHP code in the file:

add_action('suffusion_query_posts', 'suffusion_query_enhancer');
function suffusion_query_enhancer() {
    global $wp_query, $query_string;
    $query_string .= "&cat=-15";

You could think of a lot of other scenarios where you could use the custom PHP inclusion. Note that like its more popular cousin, the Custom Styles, this too is upgrade-proof. It also adds to Suffusion the feel of a theme framework. If you are looking to add some functionality and you don’t see a hook for it, do post your query on the support forum.

May 132010

Once again I break my habit of posting a release announcement before my theme submission is approved. However, given that I am on a flight and I just submitted version 3.4.9 and I have nothing else to do for the next 2 hours, I thought this time was best utilized in writing up the announcement.

Over the past few weeks you might have seen a dip in Suffusion-related activity from my side. The reasons have been manifold – high work pressure, a full house with a lot of chores, back-breaking travel and what not. I have also started taking it slow on the development side, focusing on bug fixes and performance improvements primarily, laying the foundation for bigger things to come.

Anyway, this release has been cooking for 2 weeks (WP approved version 3.4.8 rather late):

  1. Bug Fixes
    1. I  have fixed the problem with the CDN JQuery script. Now the script will be loaded only if you are not in the admin dashboard, thereby letting you continue your admin activities as usual.
    2. I have also fixed a bug in the font selection option that was adding a “” to the font name if it had spaces.
    3. The CSS file rtl.css used to be loaded twice for sites using an RTL language. I have fixed this.
  2. Code Housekeeping
    1. I have changed all fonts to relative sizes. In other words I have moved away from using “px” (pixels) as my unit for font sizes to using “%” (percentages) and “em” (Em-dash). This will help with future enhancements, where I can provide universal font-resizers.
    2. I have removed the “PHP Safe Mode” check from the “Follow Me” widget loading. I had earlier put that in thinking that it would help resolve a permissions issue that people were facing with that widget. Since the permissions issue has been resolved a while back, I decided to take the check off.
    3. I have separated the options page code from functions.php. This doesn’t impact you as end-users, but it helps me manage things better.
    4. I have also streamlined the admin page and made it load Suffusion-specific JavaScript and CSS only if the options page is being displayed. This is in response to a request on the WP forum.
    5. I have replaced the classes assigned to a post from something I had coded manually to something that WordPress provides. This will offer you a lot more flexibility in terms of how you style your posts.
      People who have defined a custom class called “sticky-post” will have to rename it to “sticky”, in accordance with the WP function.
  3. New Functionality
    1. You can now hide the date icon on posts. This seemed to be a very frequently asked question and I was tired of repeatedly telling people how to do it. Now you can go to Suffusion Theme Options → Visual Effects → Theme Skinning → Data Box Settings and configure this. As a bonus I also provided options to skin this, like using your own image, setting your own fonts etc.
  4. Updated Translations
    1. The Arabic translation has now been updated and is 100% translated.

That’s it for this release. I will be focusing on further streamlining and supporting WP 3.0 in the next few releases.

May 112010

I had submitted version 3.4.8 of Suffusion to WordPress on 29th April, but it took a while to get approved because one of the main persons who does the approvals was traveling. Anyway, this version was approved last night. This has the following updates:

  1. A fix for the bug that displayed HTML characters. If you still see special characters displayed in your footer, go to Suffusion Theme Options Visual Effects Footer Customization and Save the settings there.
  2. Updated Swedish and Russian translations.

The next version will have some pretty useful fixes and features, like the fix for the CDN JQuery script, and some options to tweak the appearance of the date icon.