Complex Design Examples
You can play with the built versions of these designs,
then download them to see how they were created in Photoshop.
Webinar "Compani" Sample
Earthy Stripes Sample
Feature Demo Examples
These examples are more spare in order to clearly show a small number of features each.
Hover over the white arrow after you click to see the built page. It will reveal a menu that will allow you to view other pages with different kinds of backgrounds.
Centercut vs Background Hints
This demo file illustrates the difference between the -centercut hint and the -background hint from a -column layer. Remember, -centercut will repeat only 1px and have a really small file size whereas -background can be larger than 1px but file size will slightly increase depending on your layer size.
Large Background Image
This example file demonstrates how to set up a Photoshop file with a large non-repeating (and unaffixed) background image.
"Outdoor Store" E-Commerce Example
Accompanies the "Ecommerce Integration" webinar recording here.
Hovershow with Movefrom Animation
Page Alignment (and footer)
This example shows two panel sheets.
The panel and sheet layers are duplicates of each other, but they have been given different settings in the Design Manager.
The upper panelsheet has been set to "sliding" so it takes up no more space than the rectangular area of it's panelsheet layer. It has been set to "feed" for its content, and the feed was set to the Yahoo RSS news headlines feed in the Content Manager. You can use the nextpanel/previouspanel and nextpanelset/previouspanelset buttons to navigate the sliding sheet, and it has also been set to self-play.
The lower panelsheet has been set to grow and its content is from gallery images.
"Poor Man's" Accordion
An easy-to-achieve layout effect using -clickshow layers stacked inside of a column.
If you look at the PSD file, notice that all the content appears at full height, with all the -clickshow layers visible. In other words, we design in Photoshop what the accordion would look like fully expanded. SiteGrinder will collapse the accordion when it builds, because the -clickshows will not be initially visible inside the column.
A simple page that shows the various types of form elements you can create, and the style you can apply using the Design Manager.