New to RapidWeaver? We've got some great tutorials to get you started with building your first site!

Previews

Slate Screenshot
Slate Screenshot Slate Screenshot Slate Screenshot Slate Screenshot Slate Screenshot Slate Screenshot

Overview


Clean and classy

With the Slate theme we continue to push the boundaries of what RapidWeaver can do. It has a popover ExtraContent area, as well as the option to present the blog page in a columnized form.

It also uses the RapidWeaver 5 Resources for both banner images and custom icons for the ExtraContent area popover.

In addition to all of this innovation, the Slate theme also has our Blog Entry Topper feature, as well as a built-in theme FAQ.

Make mine modern

imageWe’ve incorporated a series of new features in this theme that we think will be a huge benefit to you and your site’s visitors. These new features are designed for the modern browsers that your visitors are using, such as Safari, Chrome, FireFox and Internet Explorer 8 and 9.


Theme tutorials

imageHere are some tutorials and walk through videos to show you how to use some of the amazing features found in this theme.

I encourage you to take a few minutes to watch them, and be sure to bookmark this page so you can come back and reference them when you’re building your own sites.


Features

Header

The Slate theme uses a unique, new, easy method for incorporating banner images into your site design.

In the variations we provide 10 options to choose from: Banners 1-10. Each choice is associated with a filename. For instance choice one, Banner 1, is associated with banner1.jpg.

Simply create a banner image at the appropriate width and height, save it as a JPG named banner1.jpg and drag it into the RapidWeaver Resources. Then select Banner 1 from the variations and you’re all done. No code snippets or having to use RWmultitool!

The width of the banner image is whatever you’ve chosen for your site width. You can choose from several different banner height options from 150 - 400 px in size.

You’re also able to turn the shadow for the banner image on and off, on a page-by-page basis.

For more information on the banners in the Slate theme, please be sure to watch the Banners video in the Tutorials section above.

Sidebar

The sidebar in this theme is stylized and good looking and provides a great place to add your secondary information. You can turn the sidebar on and off on a page-by-page basis. It is hidden by default to give you optimal space for your content.

Background

The background for the Slate theme is controlled by picking a color using the RapidWeaver Color Picker. Once you pick a color the theme implements it and then overlays a subtle grain texture as well as inset graphics for the title bar and banner areas, as well as the horizontal navigation.

This provides you great flexibility in choosing a background color that matches your tastes. It can be different on each page of the site.

Width

The Slate theme has seven different width variations to choose from for your site design.

We’ve labeled three of these seven width variations as being Blog Page Optimized. What this means is that if you’re using the Slate theme’s Columnized Blog styling these are the three widths you’ll want to choose from for that blog page so that the columns fit just right. Using other widths in this particular situation will still work, but will not have precise alignment of columnized blog entries.

The widths you can choose from for your site are:

• 1,158 px - Blog Page Optimized
• 1,050 px
• 950 px
• 876 px - Blog Page Optimized
• 750 px
• 650 px
• 594 px - Blog Page Optimized - No Sidebar

When creating banner images you’ll make your image’s width the same as the width you’ve chosen for that particular page. For more information, see the Banners video in the Tutorials section above.

Color picker

The Slate theme’s color picker is pretty extensive. It allows you to set the tone and feel of you site with just a few simple clicks and appropriate style choices. Here’s a rundown of all of the color pickers available in this theme:

• Background
• Links
• Body font
• Site slogan
• Blog entry title
• Horizontal navigation text
• Horizontal navigation current item
• Horizontal navigation hover
• Vertical navigation hover
• ExtraContent area 1 font
• Footer text color
• Form button color (for contact form page style)

Fonts

The Slate theme’s Site Title and Slogan are quite configurable. You can choose from the following fonts for your site title:

• Museo Slab
• Museo Sans
• St. Marie Thin
• Mate
• Helvetica
• Verdana
• Georgia
• Georgia Italic

These fonts are available for your Slogan:

• Museo Slab
• Museo Sans
• Black Jack
• Helvetica
• Verdana

You can select from four font sizes for the Slogan: 24 px, 32 px, 48 px, and 56 px. The Slogan, when enabled, appears in the header area of the theme design. It is hidden by default.

You can toggle the Title and / or Slogan on and off on a per page basis.

Blog

Slate features the famous Elixir Blog Entry Topper feature. With this feature you can to place large images above the title of your blog posts quite easily with this great feature, which is similar to that found in many other platforms like WordPress, ExpressionEngine and Tumblr. This also works in columnized mode.

Speaking of columnized mode—Slate allows you to choose whether you’d like to display entries as regular size, or in columns on your main blog page. In columnized mode the most recent entry is displayed at the top of the content area with the other entries in columns underneath it.  It is highly recommended that you use one of the Blog Optimized widths with a blog page if you’re using the columnized styling.

We’ve also included the ability to have nice blog badges with your blog entries, which it turned on in the Special section of the theme variations.

For more information on the columnized styling as well as how to use the Blog Entry Topper, please be sure to watch out Blog video in the Tutorials section above.

On top of all of this, we made the normally bland, and un-styled tags section of the blog’s sidebar look quite nice by dressing up each individual tag. Be sure to checkout the blog demo page on our live preview site to see them in action.

I’ve setup a great demo page featuring the blog page style on the Slate theme’s live preview site.

Site Navigation

This theme features a beautiful drop down menu. The navigation system support 3 levels of navigation.

Some drop down menu systems don’t work quite right on the iPad and iPhone, but Slate’s navigation is setup to work nicely on these iOS devices.

ExtraContent

Slate has four different ExtraContent areas that offer you the flexibility to expand the way in which RapidWeaver works.

If you’re new to using ExtraContent areas, I encourage you to watch the ExtraContent video in the Tutorials section above.

The first of the ExtraContent areas is located in the header area.

The second ExtraContent area is placed at the top of the content container and has a nice, shadowed divider between it and the content. The third ExtraContent area is quite similar, but is placed at the bottom of the content container.

The fourth, and most special of the four ExtraContent areas, is a popover. This is something we’ve not seen in any other themes to date. When you add content to the ExtraContent 4 area a button will appear in the Title Bar on the right-hand side. When your visitors click this button a popover container appears with your ExtraContent area 4’s content.

You can configure both the width of the ExtraContent 4 popover, as well as what icon appears in the button. We’ve gone as far as allowing you to use custom icons for this button as well. As stated earlier, be sure you watch the ExtraContent video in the Tutorials section above, as I explain about each of the ExtraContent areas as well as using custom icons for the button.

Plug-in compatibility

We have tested this theme with a number of different 3rd-party plug-ins. This does not mean other plug-ins will or will not work with it, just that we’ve not tested them.

YourHead Software
Stacks, Collage, Columns, Kwix, Accordion and Carousel

LogHound Software
SiteMap, FAQ Maker, RapidFlickr

Josh Lockhart Software
RapidSearch

Barchard
WeaverPix

Misc

As with the last few themes I’ve included a built-in Theme FAQ, or Frequently Asked Questions, option in the Special section of the theme’s variations. This allows you to get answers to your questions quickly and easily without having to file a support ticket and wait to hear back.

Also included in the Special section of the Slate theme’s variations is the ability to enable a Lightbox style gallery for the RapidWeaver photo album page. To learn about this feature watch the video above in the tutorials section. You can see the Lightbox at work on the live demo site of the Slate theme as well.

Misc

You can choose what sort of footer information you want on your site, on a page-by-page basis.

The footer can consist of the normal Copyright and Contact information, the site title and a small version of your site logo.

Supported browsers

Our themes support a wide variety of web browsers. We test each theme in these modern browsers to make sure that your sites will look good, and function properly. We highly suggest Safari on the Mac and PC as it is one of the most standards compliant browsers on the market today.


Safari
Safari
FireFox
FireFox
Chrome
Chrome
Opera
Opera 10+
Internet Explorer
IE 8+

Send us an E-mail

Haven't been able to find an answer to your question in our Help Desk section? The FAQ? RapidWeaver forums? RapidWeaver Classroom? Looking for custom work to be done? Drop us a line with the contact form. But if you've not tried those areas, do so before hitting that send button.


Please enter the word you see in the image below: