Donate for a cup of coffee
In this tutorial we are going to look at suffusion layout structure and at the same time check out the most commonly used website layouts.
The layouts you see below are based on a header image of the following size 1000px X 204px.
Hint: Click an image to view a larger image.
We are going to look at the most common layouts. See images below:
Layout 1: Header, left sidebar, content, right sidebar and footer
Layout 2: Header, 2 left sidebar, content and footer
Layout 3: Header, content and footer
Layout 4: Header, content, 1 right sidebar and footer
Layout 5: Header, content, 2 right sidebar and footer. Notice how one side bar is larger than the other.
Step 1: Login into your admin account and navigate to Appearance >> Suffusion Options >> Layouts >> Default Sidebar Layout. See image below:
Step 2: Set up your sidebars and the position. You have 3 options; 0 sidebars, 1 or 2 sidebars and set the position. See image below:
Step 3: Widths page layout. Here you will choose between default theme sizes and margin or custom sizes and margin. In custom you have 2 options, fixed size or fluid size. For this tutorial I have chosen custom size and fluid flexible width. See image below:
Step 4: Fluid width settings for your website. This part is important because of your header. If you increase the max width to a size larger than your header image then you will notice an ugly header. So be careful in with this setting. See image below:
Step 5: This one is obvious, it will set the sizes of your sidebar’s. If you have 2 sidebars but you know that one sidebar will have a unique size widgets then this is where you can set up the size of the sidebar to meet the unique widgets. See image below:
Hint: Reset the theme layout if you are not happy with your settings
There are more options that you might want to check while you are setting up the layout. However this tutorial will give you a head start and provide you with an idea of the layout structure you want for your website or blog.
If you have any questions please leave a comment. Come back for more suffusion tutorials
More suffusion tutorials:









