Suffusion Version 3.9.1

Version 3.9.1 of Suffusion got approved today. It has a long list of enhancements, mostly cosmetic, though rather good:

  1. Changes
    1. A couple of minor changes to begin with: the Theme Skinning section in the Options page is now called Skinning, Sidebar Configuration is called Sidebars and Back-end Settings is called Back-end.
    2. I also renamed the navigation bars to something more appropriate. The Top Navigation Bar is called Navigation Bar Above Header and the Main Navigation Bar is called Navigation Bar Below Header.
  2. New Features
    1. The Photonique Skin
      This is the biggest feature of this release. Photonique is a new skin, well suited for photo-blogging. You have seen the demo in my previous post. Based on some feedback I have also included a “charcoal” skin that you could use. Note that for this skin you have to use a child theme – I haven’t provided an option to pick it from the skinning section.
    2. Typography
      This release features some typographic enhancements:
      1. The section called Body Fonts under Skinning is now called Typography.
      2. The list of web-safe fonts has been augmented with an impressive list of 35+ fonts from Google Web Fonts.
      3. You can now change the fonts for the site header, individual post/page headers etc.
      4. There is also support for drop-caps enabled for the first letter of a paragraph.
    3. Better Post Formats
      I have improved support for the following post formats:
      1. Status
        This will display the author’s Avatar adjacent to the status message.
      2. Audio:
        1. I have bundled support for the WordPress Audio Player plugin. Under certain circumstances this will display a nice audio player consistently across all browsers (instead of relying on a browser plugin).
        2. I have added a new short-code called “audio” that can be passed a URL and will show the audio player. This short-code gets activated only if you don’t have an existing JetPack plugin installation and the WP Audio Player is not explicitly installed.
        3. If you have a post with the Audio post format, Suffusion will scan the post for the “audio” short-code or for audio attachments. The short-code will be shown in its place, but the attachment will be shown in an audio player at the top of the post.
        4. There is no HTML5 support because the theme doesn’t do HTML5 at the moment.
      3. Gallery
        A post with the Gallery post format will be displayed a lot more nicely in archive views such as the front page. The gallery will be displayed with either the featured image for the post or the first photo in the gallery as the leading image. Then there will be a small panel of thumbnails next to it. You can control the thumbnails (sizes and number) from Other Graphical Elements → Post Formats.
    4. New Comment Features 
      Three major changes have come about in the comments:
      1. You can change how the comment forms look. You earlier had form labels adjacent to the input fields. Now you can also have the form labels inside the input fields. See Back-end → Comment Settings → Comment Form Label Styles.
      2. You can also change how your comments are displayed. Earlier you had the comment author’s Avatar and information displayed in the same box as the comment. Now you can give more of a “speech bubble” effect. See Back-end → Comment Settings → Comment Styles.
      3. You can also disable commenting on attachments such as images. Go to Templates → Attachments, then disable comments where you don’t want them. Comments will still be enabled on the back-end and this option simply serves to disable the comment form (WP itself doesn’t offer any other way to disable comments for attachments).
    5. New Icon Sets
      The following are new:
      1. I have bundled the icons generously offered by StudioPress into a few new icon sets. You can pick the one you want from Skinning → Icon Sets.
      2. I have also provided two variants of another icon set with post format icons. However this is not integrated into the theme UI yet.
    6. Navigation Bar Positioning
      1. The Navigation Bar Below Header can now be positioned at the left, center or the right. See Other Graphical Elements → Navigation Bar Below Header.
      2. The Navigation Bar Above Header can now be positioned at the center (you were able to position it to the left or right earlier). See Other Graphical Elements → Navigation Bar Above Header.
    7. New Byline Style
      You can now display the byline as a single line above your post or below your post. A byline displayed thus is centered.
    8. Framework Features
      1. Posts with no title will get a no-title class assigned to them.
      2. A new skin-specific setup hook has been added, suffusion_skin_setup_{$skin_name}.
    9. Other Cosmetic Additions
      1. The Mosaic Layout has been made much better looking. In addition I have bundled Fancybox and/or Colorbox support for the Mosaic layout to get a preview before opening the posts.
      2. For image attachments I have made the EXIF display a lot more appealing. There is now a small button that you click to toggle EXIF.
      3. I have introduced the capability to center featured image in the slider or to bump up its size in case of small images to fit the slider display.
  3. Bug Fixes
    The following bugs have been fixed:
    1. In a very rare combination of settings the Navigation Bar Below Header was floating to the left.
    2. Navigation bar borders were not getting overridden by the skinning options.
    3. Date box skinning was not working.
    4. There was a small bug with the post_class filter – it was not assigning the “full-content” and “excerpt” classes correctly.

I am keeping my fingers crossed that you will enjoy this release. I definitely had fun coding it! I have never made a secret of the fact that UI designing is my weak point. Hopefully Photonique will be a skin that acts as a turning point.

24 Responses to “Suffusion Version 3.9.1”

  1. hi there the wideside bar at the top on the right of my website has lost its margin since updating to 3.9.1 and i cant seem to get it back (

    the other widgets below are aligned correctly its just the wide sidebar ive used firebug and located sidebar-wrap-right but this all seems fine in the css – its not the widget it self as i have removed it and the problem is still there
    ive also cleaned out my backend custom includes could you let me know whats gone wrong ?

    Thank you for the update everything else works brilliantly for me

  2. Keep up the great work Sayontan! It’s so nice to work with Suffusion and your diligence in updating the theme is remarkable.

  3. Awesome News! Thank you so much and I will be checking in here to see how the others like it too. Your work is great and we appreciate so much what you do for the community! Keep up the outstanding work.

  4. Under Featured Content (and some other places) you have a nice descriptive piece of text explaining what this is and how it is best used. I find that there are a lot of things (such as the various formats like “magazine”, etc. and many of the Blog components) that I do not understand. As a consequence, I don’t dare try them out and many of the best features of Suffusion go unused. Would it be possible for you to someday include helpful text like this for most or all of the various settings? I’ve pasted the example from Featured Content below.

    Featured posts help bring certain posts to the top of your blog. Suffusion supports Featured Posts in multiple ways:
    Sticky Posts
    Selected Categories
    Selected Posts
    Selected Pages
    Selected Tags
    Suffusion uses the excellent JQuery Cycle to create a Featured section above your posts. Additionally you can define a “Featured Image” (preferably as wide as your blog posts). If you don’t associate a featured image, the thumbnail will be picked. And if you don’t provide a thumbnail, the first attached image will be used. Note, though, that not having a featured image will generate thumbnail size images, displaying a lot of blank space. Good practices:
    Use featured images for every post that you want to show in your featured section.
    Define featured images that are at least as wide as your posts.
    Don’t use too many featured posts. Remember that this section should have useful information, not all information. Having too many posts will make your script sluggish.

    • My apologies, Larry. I suffer from an extreme developer’s malaise: poor feature documentation. Another reason I have been hesitant to add more documentation to the back-end is because those options files are monstrous in terms of code. I however will be adding more documentation via tutorials on this site so that the theme files themselves are left uncluttered.

  5. Love your work Sayontan. I know its a lot of work for you but you really keep on top things.

    Suffusion is a fantastic theme and I’ve used nothing else on my blogs ever since stumbling across yours.

    I recommend Suffusion to everyone I talk ‘blogs’ to .

  6. I love that Google Fonts are now integrated with the theme. Thanks for the awesome theme Sayontan.

  7. absolutely love the new options available in the theme.

    thank you so much for all your hard work x

  8. Thanks a lot for your hard work, but there is an issue emerged when i have enabled the new icon sets.

    The [image icon] Posted by [author] on [Date] at [time] is now trouncated in two lines.

    There is a way to increase the width of the “Posted By” by some pixel? I don’t have find this option in the admin menu so i guess i have to manipulate the CSS file? I prefer avoid it.


    • Ok np i fixed the issue myself editing CSS but an option for the width of author/tags/categories will ba appreciated.

      In CSS: {
      	float: left;
      	display: inline-block;
      	color: #aaa;
      	max-width: 250px;

      from 250px to 260px.

  9. Love the theme, having a small issue with the css file. My site is https but it loads the css file in http making one insecure element on the page causing the warning to come up.

    Any help appreciated

    • I guess the message shows up if Google Fonts are selected. I will try to figure out a way to prevent the message.

  10. Love the update!

    Just one quick question, is there a way of rotating the header image automatically instead of when the user changes a page…

    I did ask this question on the forum but wondered was there an easier option or is that the best way?

    Keep up the great work!

  11. I think as much as I love the large upgrades, I love the little small details that you incorporate like the dividers. They all just make me smile. Thanks for the little things too.


    • By dividers do you mean the glyph patterns below the title / widget header? That took a good bit of effort, actually. You might also want to try out the new comment label styles in 3.9.1 – they go pretty well with the new skin (unless you tried that and decided to go back to the default styling).

  12. I like the new update of the theme. But with a new form of comments there is a problem: if the branch has a lot of comments (6-10 comments), there is a big gap between it and the next branch 🙁

  13. Well written. Thanks for the post. How can remove featured image from the post in Suffusion – 4.0.7? there is a option at Layouts>Layout: Excerpt / List / Tile / Mosaic / Full>Thumbnail settings>Show thumbnails for full content, when I disable it, it also disable form thumbnails for excerpts. Can you help me?

  14. Hey,
    Tried to post a support question in the forum, but wouldn’t let me. Anyway, wanted to know how to change the Font Color for the Scribbles Skin from the brown. The featured content slider with the brown is too dark on the featured images. I have been racking my brain, as it should be simple, but can’t find where to change it. Even in the Skin css file, I haven’t seen that color. Where is it, and how to change it?

    I am waiting to finish the change from Arras theme on my site to Suffusion. So if anyone knows, can you let me know pls.

    Oh and Sayontan, you need to add the “filter: alpha(opacity=70); /* For IE8 and earlier */” to make your
    theme backwards compatible where you have other references to Opacity. Just a tip. lol,

    Also a tip for people with the slider – using a semi-transparent back ground for the txt, looks a lot more classy. Also adjust the Height/Width to 100%. not sure why it was 90 and 85.

    In Skin.Css – the changes for semi-transparent are… (just change colours to suit your needs).

    .suffusion-custom .sliderImage div {
    /*background: url(../../images/notebook-bg.png);*/
    background-color: #333;
    opacity: 0.7;
    filter: alpha(opacity=70); /* For IE8 and earlier */
    border: 1px solid #642;
    border-radius: 5px;
    margin: 5px;
    color: #FFFFFF;

Sorry, comments are closed at this time.