Suffusion

Welcome to Suffusion, my first experiment with a WordPress theme! Suffusion is a free Open Source package distributed through the official WordPress themes site. The theme is licensed under GPL version 3.

Suffusion is updated very regularly and the changes from one release to another might throw you off. I make honest attempts to capture a decent change log, which documents what has changed. So it might be a good idea for you to subscribe to the theme news. It will also preempt posting of any queries on the support forum that might have already been answered through this site.

Suffusion is a multi-featured theme with several customizable options:

  1. Multiple “skins” out of the box
    Suffusion has 17 pre-defined color schemes for you to choose from. Moreover you can pick a skin and customize the colors further based on your likes and dislikes. 
    United Colors of Suffusion - 16 Canned Skins to Choose from

    United Colors of Suffusion - 16 Canned Skins to Choose from

  2. Widget areas and widgets
    Suffusion provides you with 19 different widget areas to place your widgets. These widget areas let you define a theme with one column, two columns or three columns, and have the added advantage of letting you define widgets above and below your content. Suffusion also comes with bundled widgets for Twitter, Social media, Category Posts etc that you can set up.
    Pick your own Twitter icon from the set provided

    Pick your own Twitter icon from the set provided

  3. A terrific Featured Posts section
    The theme leverages the amazing JQuery Cycle plugin to build a featured posts section. What’s more – it lets you pick a transition effect from JQuery’s entire array of effects: fade-in, slide-up, slide-right etc.
  4. Tabbed Sidebars
    Suffusion lets you define a static tabbed sidebar, a.k.a. tabbed widgets. The standard WordPress widgets can all be included amongst the tabs, so go ahead and use this feature! In addition you can make some of your sidebars themselves tabbed dynamically.
  5. Exceptional control over most features that you can think of
    This is best illustrated through examples:

    1. A multi-level drop-down navigation bar
      1. Can explicitly select which page and category you want to show.
      2. Exclusions work perfectly. If you decide to exclude a page or category all its children are excluded too.
      3. WP 3.0 menus are supported, too.
    2. Control over which type of page you want excerpts to show up
      1. Explicit excerpt settings for each kind of page.
      2. Ability to define a thumbnail for a post that will be shown in the excerpt.
      3. Automatically fetched thumbnail images for your excerpts if not explicitly defined, etc.
    3. Fine-grained control over pagination options
      1. Support for the popular plugin WP-PageNavi.
      2. Alternative pagination approaches provided if the plugin is not being used.
      3. Pagination is supported both for posts and for comments.
    4. Comment control
      1. You can separate trackbacks and pingbacks from comments or hide them altogether
      2. In your “separated” mode you will have pagination for each type of comment
    5. Lots of other such features, including but not restricted to header look and feel, custom footer etc.

I have tested the theme for the following browsers:

  • Internet Explorer:
    • 6.0, 7.0, 8.0 – Works fine, but doesn’t show rounded borders or shadows (CSS3 features).
    • 5.5 – Doesn’t show rounded borders or shadows (CSS3 features) and shows extra space below the navigation bar. I haven’t had much time to debug for a fossilized browser.
  • Firefox:
    • 3.0, 3.5 – All features work as designed.
    • 2.0 and below – Haven’t tested, but I think it should be okay for everything apart from the rounded borders or shadows.
  • Safari:
    • 4.0+ – All features work as designed on both Windows and Mac
    • 3.2 and below – Haven’t tested, but I think it should be okay for everything apart from the rounded borders or shadows.
  • Opera:
    • 8+ – Works as designed, except for rounded borders and shadows
  • Chrome:
    • 2.0 – All features work as designed.

The theme is XHTML 1.0 compliant. Please feel free to pitch in with comments and bug reports by posting them on the forum.

Please don’t use the comments here any more for reporting issues or for support queries. Please use the support forum instead. This will help you track and search issues better.

Posted by Sayontan at 12:18 am

213 Responses to “Suffusion”

Comments (157) Trackbacks (1) Pingbacks (55)
  1. Marc says:
    October 7, 2009 at 10:16 am

    I love this theme.
    but I have 2 questions.
    When I enable widget area with the 2 columns under the header I do not see anywhere to place widgets in the 2nd column. did i miss something?
    Also is there any way, within the admin to add a flash header or should i do that in the template file or css?

    Looking forward to your reply,

    • Sayontan says:
      October 7, 2009 at 10:35 am

      Marc,
      Your widgets have to be defined in the Appearance -> Widgets section of your admin screen. You will see a widget area called “sidebar-2″. That is where you add the widgets.
      There is a way to do the flash header:
      1. Create a text widget and place it in the “Widget Area below header”.
      2. Call your flash file in that widget and don’t give a title to the Text Widget.

      Sayontan.

      • Marc says:
        October 7, 2009 at 10:41 am

        I know that you add widgets to sidebars, but when i enabled the 2 widget areas below the header all it allows is 1, on my webpage you will see 2 images there, GHL and Fauna Marin. they are both residing in one widget.

        I’d like 2 widgets side by side so I enabled the below header widget area to have 2 columns. should i not see “Widget Area Below Header” AND another one called “Widget Area Below Header- 2″ or something? If you wish to bring this to email feel free to do so.

  2. Nate says:
    October 9, 2009 at 5:33 am

    I like this theme a lot. It’s very clean and elegant. Thanks for posting it! However, there are a couple of features that I’d like to request:

    1) The option to add a header logo to the left of the blog title, instead of (or maybe in addition to) the header background image.

    2) The option to display the time an item was posted. This might go after the posted-by line, like “Posted by Nate at 8:02 pm” for example.

    I will look into implementing these myself, but I’m very new to wordpress, and I’m still feeling my way around. If these sound like good ideas to you, I’m sure you could do it much more effectively than I could.

    Let me know what you think.

    • Sayontan says:
      October 9, 2009 at 7:46 am

      Nate,
      Thanks. Regarding your points:
      #1 can be achieved with the theme setup options. You can go to the “Header Customization”, define a header image, then set the tiling option to say “Do not repeat – show background once only”, your header image position as “Center Left” or “Top Left” and your blog title / header alignment as “Right”. This should do it for you.

      #2 is on its way. I have had this request from another user too and it is to be included in a patch that I plan to release today.

      Cheers,
      Sayontan.

  3. Mike says:
    October 11, 2009 at 9:52 pm

    I wish there was an icon that allowed the end user to switch between certain color choices. I personally want a dark theme, but many visitors are visually impaired and need more contrast to the theme. Is is possible to include this on future revisions to allow user switching between selected theme colors and making one the default.

    Thanks

    • Sayontan says:
      October 11, 2009 at 10:12 pm

      No plans to do that, because it would make things slower. I spoke to one particular designer who has this feature enabled and he believes it really slows things down on slow connections (Inanis Glass is the theme).

  4. Nadia says:
    October 12, 2009 at 3:08 pm

    Dear Sayontan,

    First I want to thank you for making such an elegant and stylish theme. I absolutely love it. I also appreciate the user friendliness. Had to change from my old theme because it was impossible to work out (I am a novice in the whole wordpress thing).

    I just have a quick question. Would it be possible to place the name of the blog and the tagline above the header (as seen here http://foodfanatic.wordpress.com)?

    Kind Regards, Nadia

    • Sayontan says:
      October 12, 2009 at 3:20 pm

      Nadia,
      You can do it without changing any code, but it will need a bit of effort:
      1. First go to the “Header Customization” and set the “Header Image Position” to “Bottom Left” or “Bottom Center”, whatever works well for you.
      2. Now go to the “Custom CSS, JavaScript and RSS” and put in something like this:

      #header {
        height: 100px;
}

      This should move up the title. Try increasing the height of #header if you want the text to move higher.

      Cheers,
      Sayontan.

      • Nadia says:
        October 13, 2009 at 12:49 am

        Thanks for the quick reply,

        I did what you said. Changed the place of the header and in Custom Styles (under the “Custom CSS, JavaScript and RSS) I added the code. Now the blogtitle moved up a bit but it is still in the headerimage. I am trying to have it above the headerimage as seen here http://foodfanatic.wordpress.com

        Did I do something wrong?

        Nadia

  5. Honigkuchenwolf says:
    October 13, 2009 at 3:59 am

    Hi,

    I’ve two questions:

    1. In the admin panel I can switch post ito get shown in excerpts, which is pretty cool, but It doesn’t shows then any images… as I have in every posts in the top left corner a thumbnail which is linked to the categoriy it would be nice to to show those thumbails too when I choose the excerpts fuction.

    2. I lve this theme, because of his many posibilities to optimise it for my own taste. but one thing is left. Like many newer magazine styles for WordPress I would like to have the main body (where the post are) as a two column style, where I can show (together with the excerpts option) two Posts in one line.

    Perhaps the newest post above and then in excerpts two older post beside each other under the newest.

    Or two rows for two different categories… would have a few Ideas What I can do with such stuff.

    • Sayontan says:
      October 13, 2009 at 5:37 am

      Hi,
      For #1 I made a release last night (2.4.5, not yet approved) that shows the images. You can either define a thumbnail image or it will pick up an image associated with the post (though I don’t have anything to link to a category).

      For your second point, I didn’t design this with magazine styles in mind, but I can explore the option. It will take a few weeks, though, since it is not just a layout change, but it requires an addition of a lot of new features.

      Sayontan.

  6. Sayontan says:
    October 13, 2009 at 5:27 am

    Nadia,
    Your header image is quite tall (310 px), which is causing this to happen. Try putting this in the custom CSS:

    #header {
    height: 100px;
    }
    #header-container {
    background-position: 0px 50px;
    }

    As I mentioned earlier, I am not familiar with your blog’s settings, so you will have to experiment a bit. If you are still not getting the desired results, change the header height to 120px and background-position to “0px 60px”.

    Sayontan.

  7. Honigkuchenwolf says:
    October 13, 2009 at 5:59 am

    thx for quick answer

  8. Honigkuchenwolf says:
    October 13, 2009 at 6:00 am

    nope sorry have the last update of your theme, and tried. no thumbnail get shown…

    • Sayontan says:
      October 13, 2009 at 6:03 am

      You have version 2.4.4. The changes are in 2.4.5. When we release a theme or a new version, it takes 1-3 days to get approved by the WordPress team. I submitted 2.4.5 last night – it might get approved today. You will see it in that version.

      Cheers,
      Sayontan.

  9. Guildford says:
    October 15, 2009 at 9:30 am

    Great theme for a newbie, thanks.

    So I had an swf in html and I used it, then I had some bugs due to moving files to a new domain. So I reinstalled and I think the header file changed. Now I am a bit confused as to where to add in the code for a swf/flash header. I had managed it to put it in, but the current line that ran horizontally at the bottom of the header, dropped down about 100px once it hit the sidebar and I want to keep it going all the way across under the header.

    In conclusion, I would like to know where I can throw my swf html into the header.php file please.

    Thanks

    • Sayontan says:
      October 15, 2009 at 10:38 am

      In your “Custom CSS, JavaScript and RSS” section of the options you have some code in the “Custom CSS” section, that sets the header height to 200px. If you remove that then the horizontal line will be at the correct place. A question, though – where did you add the flash file?

  10. Guildford says:
    October 15, 2009 at 11:44 am

    Hi, perfect. I believe previously I had header instead of header-container and its there I threw in the code. So …

    <img style="visibility

    etc

    So now I have added it onto header-container and that's gone well. I just need to try and figure out how to reduce the space under the flash. I know setting a header height messes with the line again. Any ideas?

  11. Guildford says:
    October 15, 2009 at 12:21 pm

    Ok, managed to get it sorted, header height impacts one, and header container impacts the other. :) thanks for your help

Page 4 of 4 1 2 3 4
© 2010 Aquoid Suffusion theme by Sayontan Sinha