Suffusion Theme Tutorials

 

Suffusion Theme Tutorials post provides a list of tutorials I have created for everyone to read and learn from. This list will grow in time.

Important Note: You must install the following plugin Disable Gutenberg or one similar to avoid issues with the Widget Block Editor in WordPress 5.8 and above. You can also use the following solution disable-widget-block-editor-in-wordpress-5-8. The following link https://wordpress.org/documentation/article/block-based-widgets-editor/ has more information about the new Widget Block Editor.

Last Updated: March 14, 2024

Latest News: Updated the documentation.

suffusion-theme

Note: Suffusion is no longer available in WordPress repository. You can read more about it from the following URL did not meet the requirements. Because of this Sayontan decided to release the raw code for version 4.4.9 and a small updated version 4.5.0. To learn more please check the following URL Legacy Suffusion Version Availability.

Suffusion Theme Tutorials

The good news is that Suffusion is currently supported by the following developers. I have added their names and a link to their website or github. This is so you know who they are and perhaps you might like to drop them a line.

Suffusion And Support Staff:

Latest News

Issue 1 ) There was a warning message popping up sometimes. See below.

Warning Undefined property: stdClass::$publish wp-content/themes/suffusion/functions/template.php:476

This has been fixed by Marc in the following PR 78.

=====================

Latest version Suffusion 4.6.4

Version 4.6.4 – 06 January 2024
============================================

  • Fix saving options (#85)
  • Avoid warning when unlinking custom-styles.css (#84)
  • Fix PHP warnings when exporting all options (#83)
  • Fix PHP warning regarding post count (#78)

Version 4.6.3 – 06 January 2024
============================================

  • Improve PHP 8.x compatibility (#74)
  • Add styles for TinyMCE (#72)

Version 4.6.2 – 17 December 2023
============================================

  • Remove “latest” from page head (#70)
  • Fix PHP deprecate in settings (#67)
  • Old versions available in archive repo (#66)
  • Fix PHP warning in sitemap (#64)
  • Fix version number in 4.6.1 zip

Version 4.6.1 – 27 November 2023
============================================

  • Updated custom post types (#62)
  • Fixed issues with empty option fields (#61)
  • Fixed check for translation files (#60)
  • Changed http to https (#59)
  • Added German and Spanish translations (#54, #57)
  • Removed old versions (#56)

Version 4.6.0 – 22 November 2023
============================================

  • Theme Check: Escape URLs used in attributes (#31)
  • Removed obsolete files (#39)
  • Updated options header (#40)
  • Removed broken link in options (#41)
  • Fixed PHP deprecated warnings (#42)
  • Clean-up obsolete tags (#44)
  • Fix PHP warnings (#45)
  • Theme Check: Fix text domain (#46)
  • Theme Check: Update metadata (#47)
  • Theme Check: Replace add_theme_support (#48)
  • Theme Check: Escape URLs (#49)
  • Remove WordPress version number (#51)
  • Add wp_body_open to header (#52)

Since version 4.4.8 all inbuilt shortcodes have been removed. If you are going to use or are currently using Suffusion inbuilt shortcodes, you need to install the following plugin Suffusion Shortcodes Plugin.

Suffusion 4.6.2 is compatible with WordPress version 6.4.2. I have also tested Suffusion 4.6.2 with WordPress 6.5 Alpha and it works without any issues.

Must Read First

  1. About WordPress Theme Suffusion talks about the potential and how powerful this theme is. It is a very intuitive framework that allows you to develop different types of websites.
  2. How To Install or Update Suffusion Theme shows you how to manually install the latest version of suffusion theme by following a few steps and more.
  3. Suffusion WordPress Theme Check List provides a list of settings I have added to help you get started. This also helps you check against your own current settings.
  4. Admin Options Settings shows you the complete suffusion admin layout. This helps beginners and advanced users alike.

GDPR Compliance

Please check the following information shared by Sayontan in the forum.

Advertising:

  1. Adding Adsense To Suffusion Using Shortcodes This post post shows you how to add Google Adsense to your posts and or pages using shortcodes.
  2. Add a Pricing Table This post will shows you how to add a pricing table using Suffusion theme and Easy Pricing Tables.

Child Theme:

  1. Create a Suffusion Child Theme in a Few Steps This post helps you to create a suffusion child theme in a few steps. Sayontan Sinha has released this amazing child theme for everyone to use.

Facebook Page:

  1. Display Facebook Pages In WordPress Using Suffusion This post will show you in simple steps how to display your Facebook pages on your website.

Integrate Google Search Engine:

  1. Google Custom Search Engine Create New This post shows you a simple way to customize the search box in your website using Suffusion WordPress theme.
  2. Google Analytics This tutorial will guide you and help you set up your Google Analytics in Suffusion theme.

Layout:

  1. Theme Dimension Layout Measurements This tutorial illustrates the different layout structure and measurements. It also shows you the most common used website layouts.
  2. Add a Header Image This post will show you how to add a header image to the website. This is a very simple tutorial which everyone should be able to follow.
  3. Custom Style Navigation Bar This post teaches you how to add some style to the navigation bar above the header.

Menu:

  1. How To Add A Header Menu In Suffusion This shows you how to add a menu on the top of the header in Suffusion above the banner.
  2. Mega Menu This post will shows you how to add an extra mega menu to your navigation bar.

Performance:

  1. How to Speed Up Suffusion and WordPress This post will help you improve Suffusion theme and WordPress to work better and faster. I always work with a child theme as recommended by many developers including myself.

Responsive Settings:

  1. Responsive Settings This post shows you how to configure the theme to be responsive.

Shortcodes:

  1. How To Display Suffusion Author Using Shortcodes This post shows you how to display suffusion author using different types of shortcodes in pages and posts.
  2. Suffusion Shortcodes Plugin This post talks about all the shortcodes you can add in the theme when using this plugin.
  3. How To Add Columns In Suffusion Using Shortcodes This post shows you how to add columns to your site using a shortcode. You will use a parameter with a value.

Slideshow:

  1. Add a Slideshow This tutorial will show you how to add a slideshow using Photonic.
  2. Add a Slideshow to Text Widget This post is similar to the previous tutorial but the difference is you will be adding a slideshow to a text widget anywhere on your Suffusion theme.

Social Media Sharing:

  1. Social Media Widget Settings This post show you how to add the widget to your website backend. Set set up a few social media accounts.
  2. Social Media Widget Feedburner This post will show you how to set up feedburner to work with suffusion theme.

Templates

  1. Suffusion Theme Custom Layout Template Design Page Shows you how to display different widgets in a page with different categories.

Translation Settings:

  1. Translate Suffusion Theme Into Another Language This tutorial shows you how to translate Suffusion theme into Spanish.
  2. Edit Suffusion Translation Using Poedit This tutorial shows you how to edit the po language file to include your customized translation for your site.

Widgets:

  1. Ad Hoc Widgets This post shows you how to set up and enable the ad hoc widgets in your website page or post.
  2. Query Posts Widget This post shows you how to set up this very powerful widget to display your posts based on a category.

Troubleshooting

  1. Troubleshooting This post provides the most common questions asked to setup and configure Suffusion theme.
  2. Theme Displaying Problem If you have installed the new Suffusion Theme and are having problems displaying all the pages when you are viewing the website through the browser then follow these simple instructions.
  3. Hide Comments Page Post Show you how to hide the comments from your pages and post.
  4. Suffusion Theme Troubleshoot Login Header Error shows you how to troubleshoot the header.php error message and allow you to log back in.
  5. Remove Right Side Credit Suffusion Footer The following post shows you how to remove the credential found on the right hand side of the footer when you install Suffusion.
======================================

Remember come back for more great tutorial’s.

Enjoy.

I have been working in IT since 1999 and I enjoy the challenges it brings me. I love developing websites with WordPress. I spend a lot of time helping out in wordpress.org forums. I have been writing tutorials since 2011. Now I am learning how to manage my own VPS "Virtual Private Server.

  21 Responses to “Suffusion Theme Tutorials”

  1. Hello! I love that you’re creating a tutorial for just suffusion theme.

    I’m new to this whole coding thing, can you please have a tutorial on how to insert Google Adsense advertisements between posts on the home page? And also on how to insert advertisements onto individual posts automatically after the posts but before the comments?

    Thank you!!

  2. thanks a lot, i used your tutorial to create a child theme and succeeded. Thanks again as I was extremely confused..

  3. Glad to find your tutorial list. :)

    Any help for those of us trying to implement mega menus with suffusion?

    Besides trial and error guesswork on my part, I have spent many hours looking for help on this topic. I have not found any clear, concise tutorials on this yet. No replies to my request for help after a few days on the suffusion forum either.

    Thanks!

    • Hello jumpqbert, thank you for your question. Can you please elaborate more on what you mean by mega menus? I would love to help you.

      Kind regards

      • I posted this on the Aquoid Forum, but if you search mega menu on the support requests thread, you will see other posts about mega menus:

        tia,
        jumpqbert

        • Hello jumpqbert, when you first read the instructions it sounds a bit tricky but when you read it carefully it starts to make sense. I am currently writing a tutorial because I can see how many would find it challenging to understand. For now try the following instructions.

          1. Go to Appearance >> Menus and select your current menu or create a new menu.

          2. Add a new item to this menu called “Anything you want” and set it up as a Custom Link with URL #. This will avoid creating a link because you just want the menu to display on your navigation and not link away. Click Add to Menu.

          3. Associate a Mega Menu widget area to “Anything you want”, for example we will use Mega Menu Widget Area 1. Add other widgets of your choice. I have added Search: Search, Pages and Links.

          4. Now go back to your front page and view the new added menu to your navigation bar.

          I hope this helps you.

          Kind regards

          • Thanks much for the help, I look forward to your tutorial. Today I will give your instructions above a try and see what I can do :) If I have success I will share…
            take care,
            jumpqbert

          • Hi jumpqbert, I have added a tutorial. Look above on the list at number 10. I hope this helps you further. If you feel that the tutorial can be improved please advice.

            Kind regards

  4. I am SO happy to see that someone is brave and smart enough to put a tutorial together at last.
    I am a beginner and it took me a VERY long time to figure out how to barely use this theme, so long in fact that now I don’t remember how I STARTED in order to build my 2nd site.
    Do you maybe have a checklist of steps to setup a website with suffusion?
    Also, I keep hearing about Suffusion templates. Are those websites that one can use and change to suit and if so, where does one find them?.
    Thank you.
    Marius

    • Hello Marius, thank you for your comment. I am happy to hear that you found my post interesting. I don’t have a step by step tutorail as such. If you read through my list above you will be able to install and configure most options for suffusion. I might in the near future wright a step by step tutorial like a guide to help people install and setup Suffusion.

      In regards to your question about Suffusion templates, simply navigate to Appearance >> Suffusion Options >> Skinning >> Theme Selection and choose which ever sking you want to use for your website or blog.

      If you require any more help please let me know.

      Kind regards

  5. I have a Suffusion theme installed, however my Header image is not responsive, the rest of the page is. And yes, i do have Resize header foreground images (logos) proportionately checked

    • Hello Marc, thank you for your question.

      Please read the following URL and let me know if you have set it up like the tutorial. Have you also enable the responsive settings? If not once you have logged into WordPress as the administrator navigate to Appearance >> Suffusion Options >> Layouts >> Responsive Layout and enable this options. Play around with the settings to best suit your needs.

      Or are you using a responsive plugin?

      Let me know if the above helps you.

      Kind regards

  6. Manuel,

    I am wondering if Suffusion’s latest version 4.4.7 is 100% compatible with WordPress 3.9 (and/or 3.9.1). Do you know? I am recommending Suffusion to 2 clients this week.

    By the way, I agree Suffusion theme is AWESOME for its flexibility and customizing features. I look forward to checking out your tutorials. Thanks for doing them…

    Kathy

    • Hi Kathy, thank you for your question.

      Yes Suffusion is compatible with WordPress 3.9 and supposedly 3.9.1 which would be a patch and security release. The only problem currently is the following reported by Jason Lasky on the wordpress.org site.

      Suffusion custom background color is not showing on website. Background defaults to theme skin default and blocks WP native background setting as well.
      To set a custom color, return to Suffusion option / background / theme default and then use the WP Native background option to select a color – which will now show up on front end.

      That is only a minor bug which is drivable. Also be aware that Suffusion has an impecable support all the way through. :) If you need more information please let me know.

      Kind regards

      • Thanks for letting me know about the background. One of my sites uses a background image, not a color. I wonder if those are affected as well (?)

        It is on this site: http://www.girlinthejitterbugdress.com if anyone is interested in taking a look!

        • Hi Kathy, I have done some testing on my test environment running WordPress 3.9 and 4 alpha. Suffusion runs very smoothly however I have not tested every options available because there are too many variants. I can say that you are safe to recommend Suffusion to anyone. If there are ever any problems it would be from a compatibilty issue with a plugin or it could be a host “Server” related issue.

          Kind regards

  7. I am using the Suffusion theme and trying to implement rotating headers. Do you have a tutorial for this? If I had hair, I’d be pulling it out! I’ve spent hours trying to make this work. I can get the header to rotate, but it is repeating vertically and I cannot stop the repeating no matter what I try.

    • Hi Jerry, thank you for your question. Unfortunately at the present I have no tutorial in regards to your question. However I will probably write one very soon. Meanwhile you can log into github. You will get very quick support there. You are most welcome to get in contact through my contact form if you need more help.

      Regards

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)

two − one =