Suffusion Tutorial for WordPress


I have received several questions regarding various facets of Suffusion, so I decided to put together a set of help pages for the same.

You can download Suffusion from the WordPress official page for the theme.

Once you have downloaded, installed and activated the theme for your blog, go to your blog’s Administration page. You will see the following:


When you click on “Suffusion Theme Options” you see the complete list of available configuration options for the theme:


The options are divided into two main categories, which are further divided into sub-categories:

  1. Visual Effects
    1. Theme Selection – Lets you pick out the color base you want to use. Each color base comes with a predefined list of icons and images, backgrounds and font colors. Apart from the icon packs you can change the rest of the settings in subsequent sections.
    2. Header Customization – Lets you define the header layout, custom header images, gradient images etc.
    3. Body Background Settings – Helps you set the background colors, background images etc.
    4. Body Font Settings – Enables you to set font colors, link colors, link effects etc.
    5. Navigation Bar Setup – Helps define the pages to show in the drop-down menu at the top. Also allows you to have a custom home icon and to disable the search field from showing up.
    6. Sidebar Setup – Provides control of the number of sidebars you have (1 or 2), the position of each sidebar (left or right), the widgets for each sidebar, the styling for the widgets and the ability to move / expand / collapse the widgets.
    7. Sizes and Margins – Currently only one setting is provided here – the ability to set the margin between the top of the page and the top of the window.
    8. Custom Emphasis Elements – A set of styles for visual impact, like the “Download” section you see earlier in this page.
  2. Blog Features
    1. Excerpts / Full Contents – Gives control over whether you want to display the full contents or excerpts of posts. You can have different settings for the front page, the archive page, the category page and the search page.
    2. Comment Settings –
    3. Analytics – You can add your Google Analytics scripts here
    4. OpenID Setup – If your blog is set up as an OpenID provider and you want to use your blog’s address as your OpenID, you can add the server and the delegate links here
    5. Custom CSS and JavaScript – If you find the available settings inadequate (as I am sure a few of you would), you can make those definitions here.

For each section you can:

  1. Save the options
  2. Reset the options for the section
  3. Reset all options for all sections.

The options for each section are discussed the section’s respective page. As you go through the subsequent sections you will see some things that surprise you. To explain that let me mention something humorous to you:

There were two men trying to decide what to do for a living.  They went to see a counselor, and he decided that they had good problem solving skills.

He tried a test to narrow the area of specialty.  He put each man in a room with a stove, a table, and a pot of water on the table.  He said "Boil the water".  Both men moved the pot from the table to the stove and turned on the burner to boil the water.  Next, he put them into a room with a stove, a table, and a pot of water on the floor.  Again, he said "Boil the water".  The first man put the pot on the stove and turned on the burner.  The counselor told him to be an Engineer,
because he could solve each problem individually.  The second man moved the pot from the floor to the table, and then moved the pot from the table to the stove and turned on the burner.  The counselor told him to be a mathematician because he reduced the problem to a previously solved problem.

– From The Mathematician, The Physicist and The Engineer (and Others)

A lot of options were added as enhancements to existing functionality, so rather than redesign I had to work my way around the existing options and prevent breaking an option that a user had already set. Hence the weirdness in some of the options.

  23 Responses to “Suffusion Tutorial for WordPress”

Comments (23)
  1. Thank you for this excellent theme! Very very much appreciated!

    A quick question: when upgrading to a newer version of the theme, do I have to save somehow the theme’s Options (if yes, how). I guess an upgrade will overwrite my old options, right?

  2. Please ignore me above comment, I just read the answer in the forum!


  3. I would like to put a “out” link (my portfolio is on an other site) between “References” and “Contact” in the navigation bar menu.
    Thank you for your help !

  4. I would like to split my main page posts down so that I can have them spanning over separate pages. is there a way to decide the number of posts shown before paginating the posts onto separate pages?

    I have had a look in the “page navigation” section but cannot seem to see.



  5. Sayontan

    I love the theme, but am having difficulty uploading my logo to the “header foreground image” spot – maybe because i am simply not too computer-lingo savvy. Can you please walk me through the steps of doing this? I thought I would turn for help straight at the source! It is a jpeg file on my computer. I have uploaded it to the images folder within the suffusion folder, in my ftp – what next?

    Thank you so much!

  6. Fantastic job. Thank you for your new release.
    If you need some help with Catalan translation, i’m catalan so, just tell me how to do it and i will try to help as much as i can.
    Sorry for my english, my catalan is better!

  7. I love all the options w/the Suffusion theme! I’m new to this and this is probably the 20th theme I’ve tried and I think this one will meet my needs! Only problem is I want a sidebar w/tabs for ecommerce. I want the sidebar to the left completely, even to the left of the main content area. I don’t see an option where I can put it there. Is that possible?
    Also, I want my blog separate but linked by a tab under the header. I want the sidebar on the right for my blog, so I think I need to install WP in a different location for th blog. ?

  8. The Recent Comments Widget does not update – it does not show the most recent comments, only first 5!
    How can I fix it?
    Thank you!

  9. Hello Sayontan,

    Again, thanks for all your hard work, I love this theme.

    Did you ever hear of vistabuttons? Here is a link to their site vista-buttons and dot com. (just in case your span filter kicks this).

    I use this software in one of my other sites (costaresume dot com). I was just wondering if I could use this software to do my menus.

    If you have time, please check it out and let me know.

    Thanks again,


  10. Hi, thanks a lot for creating this theme, looks excellent and I love how customizable it seems. Still, I have a little question, how do you change the appearance of the navigation bar (color, fonts, size, borders)?

  11. Just wanna say thanks for this theme. Love the look and feel, the customisability and how easy it is to use/customise (even for me with no techo skills).

  12. When upgrading the theme, I recieved two error messages

    Invalid argument supplied for foreach() in /ihome……./wp-content/themes/suffusion/index.php on line 12

    Fatal error: Call to undefined function suffusion_query_posts() in /ihome…./suffusion/index.php on line 22

    I unistalled the theme and still get these lines dis[palyingeven when a new theme is installed.
    I installed suffusion again – it says successfully – but when I go to view the blog page i still recieve the above messages on the page,

    please help.

    • That’s a wrong message. Your theme hasn’t installed properly. Try installing it manually. Please use the support forum for subsequent queries as they will not be answered here.

  13. First off…I Love the Theme, the Best one out of the Themes I’ve tried so far..I was wondering..How do I change the Font when you write in the Add New Post section..I write in italics..theme puts them in italics but it won’t let me change the font..I can change the fonts in everything else But the font in the ‘body’ or ‘add new’ part..heres the The part where I write my Clog (complainers log) won’t let me change the font..I hope that doesn’t confuse anyone..I really need some help on this..