- Getting Started
- Sidebars and Widgets
- Content Formatting Tips
- Advanced Customization Hooks
Synapse may be used either as a standalone theme or as a child theme alongside of a parent theme. If you choose to use Synapse as a standalone theme, automatic updates will be disabled. This is to ensure that you do not lose any of your customizations.
To use Synapse as a child theme, install both the Synapse parent theme and the synapse-child theme (included in your download package) and activate the child theme. For developers, please see the accompanying functions.php file for advanced layout customizations.
When you first download Synapse you’ll have a zip file. named Synapse_WP_Unzip.zip. Extract this file locally. You’ll then see a few files and folders:
- Readme.html (technical documentation)
- Synapse_Sources.zip (Layered Adobe Fireworks and Photoshop Graphic Source Files)
- synapse.zip (the parent theme/framework)
Install both the synapse.zip and synapse-child.zip files into WordPress. Of course, you can just install the parent theme as a standalone theme, but remote updates will be disabled.
Once you’ve installed and activated Synapse, you’re ready to begin configuring the options. You can dind these options under Appearance → Theme Options. WordPress has several more options which Synapse will adapt to, so be sure to look over the main articles such as your initial home page and blog setup.Top
Sidebars and Widgets
Synapse has various locations you can display your content. Aside from the main content area, you can display content in your sidebars left, right, teaser, footer, etc. You can set up your widgets from Appearance → Widgets.
One of the current shortcomings of WordPress is the inability to assign specific Widgets to individual pages. For smaller sites, this is a non-issue. For larger sites using WordPress as a CMS, you’ll want a lot more control. This is where the 5-star rated Dynamic Widgets plugin comes in.
Once you’ve installed Dynamic Widgets, you’ll notice a little link at the bottom of each of your Widgets that will either read static or dynamic. Static means it is assigned to all pages (or posts) for that specific location. Dynamic means you have configured the widget to be displayed on specific pages. So click the static link to begin assigning your widgets across your sites.
Content Formatting Tips
WordPress has its fair share of quirks. If you find that WordPress auto paragraph formatting (wpautop) is getting in the way of your markup, simply add a custom field to your Page or Post named “wpautop” with a value of “false”.
Synapse has a Designer Page template which will hide the Page title and sidebar. If you want to just hide the title of a Page or Post, simply create a custom field (in the same manner as illustrated above) named “hidetitle” and set the value to “true”.Top
Synapse has several built in shortcodes. You can see them in action on the shortcodes demo page.
A callout is (by default) a rounded cornered styled inset box. It has two arguments:
- align - aligns the callout left, right, or center
- width - Only use this parameter if you must. Defined widths will not scale properly on all devices. Instead, consider embedding them in one of the column shortcodes.
[callout align="center" width="400"] This is a 400px centered callout box [/callout] [callout align="left" width="200"] This is a 200px left aligned callout box [/callout] [callout align="right" width="100"] This is a 100px right aligned callout box [/callout] [callout] This is a callout that will expand the entire width of its parent container. [/callout]
You’ve seen these before. The fractional shortcode combinations allow you to insert scalable columns into your content. The only rule here is, the last column must have a suffix of ‘_last’. See the example below.
// Three Columns Example [one_third] Column One - Add anything you want here [/one_third] [one_third] Column Two - Add anything you want here [/one_third] [one_third_last] Column Three - Add anything you want here [/one_third_last]
Available Options – Up to 6 columns
Cross-Browser CSS3 Buttons
Tested in IE7,IE8,IE9,Webkit, and Mozilla browsers. Preview all colors and sizes
[button align="center" color="white" size="small" link="http://www.simplethemes.com"]Small Button[/button]
You can create tabs content within your content as well. Each tab needs a unique id (identifier) in order to work.
[tabgroup] [tab title="Tab 1" id="t1"]Tab 1 content[/tab] [tab title="Tab 2" id="t2"]Tab 2 content[/tab] [tab title="Tab 3" id="t3"]Tab 3 content[/tab] [/tabgroup]
[toggle title="Button text One"] Toggle Content One [/toggle] [toggle title="Button Text Two"] Toggle Content Two [/toggle] [toggle title="Button Text Three"] Toggle Content Three [/toggle]
Insert a list of your latest posts from specified category(s) into any page with optional thumbnail and excerpt.
[latest excerpt="true" thumbs="true" width="50" height="50" num="5" cat="8,10,11"]
Insert a list of related (tagged) posts.
Sometimes the WordPress editor will strip out your more advanced markup. This can be a real drag. By wrapping your code in [raw] tags, you can eliminate this issue.
[raw] YOUR SAFE HTML CODE [/raw]
If you ever need to clear an element, you can use the “clear” shortcode below.
Clear with Horizontal line:
Similar to “clear”, this does the same thing but adds a horizontal line below.
Advanced Customization Hooks
You can find a list of these hookable actions and functions throughout functions.php:
- st_above_header // Hook to add content before header
- st_header_open // Opening header tags
- st_header_extras // Additional content to be added to the header
- st_logo // Override the theme logo function(s)
- st_header_close // Closing Header tags
- st_below_header // Hook to add content after header
- st_navbar // Opening navigation element and WP3 menus
- st_before_content // Hook to add content before content
- st_after_content // Hook to add content after the content
- st_before_comments // Hook to add content before comments
- st_after_comments // Hook to add content after comments
- st_before_footer // Hook to add content before the footer
- st_footer // The footer (includes sidebar-footer.php)
- st_footernav // Footer navigation menus
- st_after_footer // Hook to add content after the footer