1. Suffusion - A Free WP Theme
Customizable through options and plug in
Integration.
Export/import options for revision control
Dashboard>Appearance>Suffusion
Options>Introduction>Import/Export
Great Support on the developers site
Active Developer — http://aquoid.com/
Support Forum — http://aquoid.com/forum/
Developer’s site is full of instructions and tips. Of special
interest is the Markup and Hook Reference:
http://aquoid.com/news/themes/suffusion/hook-reference/
2. Suffusion Theme Basic Install—Color
Schemes / Widget Areas
http://elurie.com/sand
box/04
Included Color
Schemes- use as
is, or as a starting
place for
customization
Dashboard>Appear
ance>Suffusion
Options>Skinning>
Theme Selection
Widget Areas
Diagram
Dashboard>Appear
ance>Suffusion
Options>Sidebars>
Sidebar Layout
3. Child Theme Support
Download Child Theme Pack from the aquoid
site:suffusion.googlecode.com/files/suffu-scion.zip
http://aquoid.com/news/2010/09/suffusion-child-
themes-tips-and-tricks/
Child Theme Pack
folder structure
4. Customizing Suffusion- 3 Examples
Integrated html/wp sites that use the Suffusion Theme
Customize look and feel with Suffusion
WordPress install brings added functionality to html site
5. 1. Suffusion Blog Customized To Match
html Site
WordPress Install:
http://osteopathicphysician.net/
blog/
Integrated into html site
Menus match
Logo returns to index.html
HTML Site:
http://osteopathicphysician.net
This is the site of an Osteopath
Multi purpose site:
Inform
Inspire
Office and doctor info.
Increase patient access
6. 2. Suffusion Used To Add Functionality
HTML Site for an RV
singles club:
http://lonersonwheels.com/
WordPress Install to
match:http://lonersonwheel
s.com/wp/
Menus Match in both sites
WP install has Tips&Tricks
Next WP projects: :
Membership management,
Member Login, MailChimp
integration, join page
integration.
7. 3 a. Suffusion All Widget Custom
Layout
HTML Site:
http://evelurie.c
om/
WordPress
Install:
http://evelurie.c
om/blog/
Custom layout
with all widget
areas
Query Posts
Widgets
10. 3c. Custom Styles
http://evelurie.com/blog
Custom Style Sheet support and the ability to add custom styles in
Dashboard
Dashboard>Appearance>Suffusion Options>Back End>Custom Includes
11. SUFFUSION Options & Features
Child Themes menus,
Child theme pack Featured sliders
suffusion.googlecode.com/files/ Tabbed sidebars
suffu-scion.zip
18 pre-defined color
Export options for easy schemes
back up, moving a site, or
RTL support built in
design versions.
Many Languages available
Typography- built in Google
fonts Custom Post Types and
custom Taxonomies are
Mega-Menus
integrated
Custom layout templates
BuddyPress support pack
Customizable drop-down
12. SUFFUSION Options & Features (cont.)
Magazine layout pack
Lots of enhanced Suffusion Commerce Pack. This plug in
aims to extend template support to
widgets for Twitter, Flickr, popular e-commerce plug ins for
Google etc Suffusion. The e-commerce plug ins
currently supported are: Jigoshop and
Prospress. Support for other plug ins
It has 19 widget areas such as WooCommerce or WP-
ecommerce will be added in the near
It has one-column, two- future
column and three-column
fixed-width and flexible- Custom Stylesheet
width layouts support and the ability to
add custom styles
8 pre-defined templates
Suffusion commerce
Editor's Notes
Customizable and great supportAquoid.com• 5 upgrades in the past year, 2 of them adding major upgrades.Active Forum where you can ask questions and read documentation.The Hook and Markup reference will help when you are putting in your custom cssOpen pp.http://elurie.com/sandbox/04/http://elurie.com/sandbox/04/wp-admin/themes.php?page=suffusion-options-manager&tab=theme-options-intro.phphttp://elurie.com/sandbox/04/wp-admin/themes.php?page=suffusion-options-manager&tab=theme-options-theme-skinning.phphttp://elurie.com/sandbox/04/wp-admin/themes.php?page=suffusion-options-manager&tab=theme-options-sidebars-and-widgets.phphttp://osteopathicphysician.net/blog/http://lonersonwheels.com/http://evelurie.com/blog/http://evelurie.com/blog/wp-admin/widgets.phphttp://evelurie.com/blog/wp-admin/themes.php?page=suffusion-options-manager&tab=theme-options-templates.phphttp://evelurie.com/blog/wp-admin/themes.php?page=suffusion-options-manager&tab=theme-options-blog-features.php
Color schemes and Sidebars Layout
If have time open Transmit: elurie.com/sandbox/04/wp-content/themes/suffusion_child/style.css and explain @import and show instructions.
go to the blog first:• The links to it don’t say blog, but rather, the topics in the blog.• There are links in the WP install that go back to the html site so you can go between the two seamlessly.• Logo on the WP install goes to the index.html page for full integration and the menus are the same on both the html site and the wp site.Go to the html site: The client wanted to create an experience, to inform, and inspire as well as provide information about her practice. To provide the means for her patients to get Intake and Medical History forms, excercises, diets, reading lists
The WP install is a later phase of the web development project when it became clear that we were going to proceed with some new projects.The Tips and Tricks sections are in WPThe next project will be: Membership management, Member Login, MailChimp integration, and integration with the join page.Here again, the menus match those in the HTML site, and you can go freely between the html site and the wp install.
I have been playing around with Suffusion and what it can do with the blog part of my site.Again, The menus are the same as the HTML site and you can navigate back and forth between the HTML site and the WP install.I have the Blog and will put some future projects on the WP install. Those projects that would benefit from using a backend database. Compilation of a list of WP plug ins for various jobs, typography sites and sources.
There is a demo on aquoid.com showing how to develop your custom layout, and some directions in the dashboard as well.The "Custom Layout" template offers you 5 special widget areas that you can use to build pretty much any layout that you wish. Each widget area can be defined with a different number of columns. The heights of the widgets in each such widget area can be further controlled so as to maximize your look and feel effects. Define your defaults here, then use this template while creating a page.The following is an example layout using this template.Tip: If you want to use this template and override the defaults from this page, save a draft of your page. That will activate the Custom Layout optionsNote:This template will not display the post content - only the widget areas.To get different widgets on different pages, use this capability with a plugin like Widget Logic.You can pick a specific sidebar layout for a page with this template.
I made a magazine layout to show two specific categories, The description is showing
Using Espresso to easily see my custom styles before pasting them into the Custom Includes box