Envision 2

Envision 2

Screenshots

Here are a few screenshots of Envision. You can also view the live preview.

  • Envision 2 Screenshot 1
  • Envision 2 Screenshot 2
  • Envision 2 Screenshot 3

Features

Hybrid Menu

Envision provides a hybrid horizontal menu with vertical dropdowns that provides 1 horizontal menu level with up to 7 vertical dropdowns. You can also control the menu dropdown opacities.

Body Background Images

Use up to 20 JPG and PNG header background images. Customize the background position and specify its repeat direction using Theme Variations in the Page Inspector.

Page Banners

Use up to 20 JPG and PNG page banner images. Banners can be shown or hidden on a per-page basis. You can also customize the banner height using Theme Variations.

Rounded Corners

Apply rounded corners to the layout corners and control the corner radii for using Theme Variations in the Page Inspector.

Sidebars

Place your sidebar on the left or the right side of the website page. You can also hide the sidebar, too, on a per-page basis.

Built-in jQuery Javascript

The jQuery Javascript library is built-in! Out-of-the-box, you immediately have access to the entire jQuery library, and it uses "No Conflict Mode" to safely avoid conflicts with other Javascript libraries.

Built-in RapidSearch Form

Use the built-in RapidSearch form to quickly and easily add site-wide Google search to your Envision website. RapidSearch is sold separately or in a bundle.

Built-in PrettyPhoto Lightbox

The PrettyPhoto Lightbox plugin is built-in! Out-of-the-box, you can quickly and easily create galleries and slideshows with photos, videos, Flash movies, and external websites. See an example gallery

Supports JS-Kit Echo Comments

Envision supports JS-Kit's Echo comment system out-of-the-box. Enjoy real-time conversation among various social graphs from your Envision website. Learn more about Echo

Color Pickers & Variations

Envision provides a ton of color pickers and theme variations for almost every layout element so you can quickly customize every aspect of your website.

Theme Styles

Envision provides 3 theme styles to help get you started. Use these Theme Styles as a jumping off point to quickly and easily customize your own Flex website.

Supports RapidWeaver 4

Envision works with RapidWeaver 4 and supports all of the latest RapidWeaver features.

Web Browser Support

  • Safari
  • Firefox
  • Chrome
  • Internet Explorer 8
  • Internet Explorer 7
  • Internet Explorer 6

***Rounded corners do not work in Internet Explorer. Transparent PNGs do not work in Internet Explorer 6.

Theme Variations

Layout - Width

  • 700px
  • 800px
  • 900px (Default)
  • 1000px
  • 1100px
  • 1200px

Layout - Font Family

  • HelveticaNeue-Light (Default)
  • HelveticaNeue
  • Helvetica
  • Georgia
  • Times
  • Lucida
  • Verdana
  • Trebuchet MS

Layout - Base Font Size

  • 11px
  • 12px (Default)
  • 13px
  • 14px

Layout - Corner Radius

  • 0px
  • 2px
  • 4px
  • 6px
  • 8px
  • 10px (Default)

Layout - Colors

  • Background

Layout - Background Image

  • None (Default)
  • Image 1 (JPG) ... Image 10 (JPG)
  • Image 11 (PNG) ... Image 20 (PNG)

Layout - Background Repeat

  • No Repeat (Default)
  • Repeat X
  • Repeat Y
  • Repeat X and Y

Layout - Background Position

  • Top Left
  • Top Center
  • Top Right
  • Bottom Right
  • Bottom Center
  • Bottom Left

Header - Title Font Size

  • 12px
  • 18px
  • 24px
  • 36px
  • 48px
  • 60px (Default)
  • 72px

Title - Font Family

  • HelveticaNeue-Light (Default)
  • HelveticaNeue
  • Helvetica
  • Georgia
  • Times
  • Lucida
  • Verdana
  • Trebuchet MS

Header - Slogan Font Size

  • 12px
  • 18px (Default)
  • 24px
  • 36px
  • 48px
  • 60px
  • 72px

Header - Height

  • Auto (Default)
  • 50px
  • 100px
  • 150px
  • 200px
  • 250px
  • 300px
  • 350px
  • 400px

Navigation - Tab Font Size

  • 12px
  • 14px (Default)
  • 16px
  • 18px
  • 20px

Navigation - Gradient

  • Show (Default)
  • Hide

Navigation - Dropdown Opacity

  • 100% (Default)
  • 95%
  • 90%
  • 85%
  • 80%
  • 75%
  • 70%

Header / Navigation - Colors

  • Title
  • Slogan
  • Tab Link
  • Tab Link (Hover)
  • Tab Link (Current)
  • Menu Background
  • Submenu Link
  • Submenu Link (Hover)
  • Submenu Link (Current)
  • Submenu Link Background
  • Submenu Link Background (Hover)
  • Submenu Link Border
  • Submenu Border

Page - Title

  • Show (Default)
  • Hide

Page - Banner Image

  • None (Default)
  • Image 1 (JPG) ... Image 10 (JPG)
  • Image 11 (PNG) ... Image 20 (PNG)

Page - Banner Height

  • 50px
  • 100px
  • 150px
  • 200px (Default)
  • 250px
  • 300px
  • 350px
  • 400px

Page - Colors

  • Title
  • Text
  • H1
  • H2
  • H3
  • H4
  • Link
  • Link (Hover)
  • Strong / Bold
  • Em / Italic
  • Code
  • Blockquote
  • Blockquote Border
  • Insertion
  • Deletion
  • Breadcrumb Link
  • Breadcrumb Link (Hover)
  • Section Top Border
  • Background

Sidebar - Position

  • Left
  • Right (Default)
  • Hide

Sidebar - Font Size

  • 11px
  • 12px (Default)
  • 13px
  • 14px

Sidebar - Colors

  • Title
  • Text
  • Link Text
  • Link Text (Hover)
  • Link Background
  • Link Background (Hover)
  • Link Border
  • Section Top Border
  • Background

Search Form - Visibility

  • Show (Default)
  • Hide

Search Form - Colors

  • Section Top Border
  • Text Field Border
  • Background

Footer - Colors

  • Text
  • Link
  • Link (Hover)
  • Background

Blog - Colors

  • Entry Title
  • Entry Title (Hover)
  • Entry Meta Text
  • Entry Meta Link
  • Entry Meta Link (Hover)
  • Read More Link
  • Read More Link (Hover)

Photo Album - Colors

  • Thumbnail Caption
  • Thumbnail Border
  • Fullsize Page Header Background
  • Fullsize Page Body Background
  • Fullsize Page Title
  • Fullsize Page Caption
  • Fullsize Page Text
  • Fullsize Page Link
  • Fullsize Page Link (Hover)
  • Fullsize Page Photo Border

Photo Album - Grid Spacing

  • 12px
  • 18px (Default)
  • 24px
  • 36px
  • 48px

File Sharing - Colors

  • Link
  • Link (Hover)
  • Description

Movie Album - Colors

  • Thumbnail Caption
  • Thumbnail Border
  • Popup Caption
  • Popup Background

Movie Album - Grid Spacing

  • 12px
  • 18px (Default)
  • 24px
  • 36px
  • 48px

Frequently Asked Questions

Why were several theme variations removed from version 2.0?

According to my recent tests, Internet Explorer only reads up to 31 external style sheets. Subsequent external style sheets are ignored. This feature/bug partially explains why many of you experienced rendering issues with Envision 1.0 in Internet Explorer. Envision's theme variations exceeded this threshold and therefore caused Internet Explorer to ignore subsequent style sheets. To resolve this issue, I removed the "Title - Font Weight" and "Page - H1…H4 Font Size" theme variations and replaced their functionality with free RWSnippets included with Envision 2.0. I do apologize for any inconvenience this change may cause, but there is nothing more I can do to resolve this inherent browser limitation.

Why do PNG images not work in Internet Explorer 6?

I will no longer support PNG image transparency in IE6. This browser is 8 years old, and there is no excuse for continuing to it. However, Envision will otherwise display as expected.

Why do rounded corners not work in Internet Explorer?

Internet Explorer does not support the border-radius CSS property. I use this CSS property with Envision to provide end users the ability to customize the theme layout using Theme Variations. There are Javascript libraries that enable rounded corners in Internet Explorer, but they provide too much overhead and are not as flexible or customizable for the end user.

Will I need RapidSeach to use the built-in search form?

Yes. You can purchase RapidSearch on my website for an additional USD $15.00. You can also purchase the Envision/RapdiSearch bundle at a discounted rate.

I am already using MooTools, Prototype, or Scriptaculous. Will Flex still work?

Yes. Envision comes bundled with jQuery 1.3.2 in "No Conflict" mode. This ensures it will play nice with any other Javascript libraries you may already be using.

Documentation

Installation

  1. Download your purchase to your computer. This will be a ZIP file.
  2. Double-click the downloaded ZIP file to expand its contents.
  3. Double-click the .rwtheme or .rwplugin file that was in the ZIP file.
  4. Restart RapidWeaver.

Table of Contents

System Requirements

  1. RapidWeaver 3.6+ (4.0+ recommended)
  2. Javascript-enabled web browser

How to use a custom body background image

You may use up to 20 header background images. Slots 1 - 10 accept JPG images and slots 11 - 20 accept PNG images.

  1. Create or find an image you want to use as your body background (repeatable images work best)
  2. In RapidWeaver, open your website file and view the Themes panel (View > Show Themes)
  3. Right-click on the "Envison" theme and select "Reveal Theme Contents in Finder"
  4. In the resultant Finder window, place your image into /Contents/images/editable_images/layout-background-images/
  5. Ensure your image is named "image1.jpg"..."image10.jpg" or "image11.png"..."image20.png". Capitalization is important. Ensure your file names use only lower-case letters.***
  6. In RapidWeaver, select "Image 1", "Image 2", "Image 3", etc from the "Layout - Background Image" Theme Variations set
  7. You may also select "Layout - Background Position" and "Layout - Background Repeat" settings

*** If you are using a JPG image, be sure your image has a ".jpg" extension and uses slots 1 - 10. If you are using a PNG image, be sure your image has a ".png" extension and uses slot 11 - 20.

How to use a custom page banner image

You may use up to 20 banner images. Slots 1 - 10 accept JPG images and slots 11 - 20 accept PNG images.

  1. Create or find an image you want to use as your page banner
  2. Ensure the image is as tall as the "Page - Banner Height" variation setting and as wide as the "Layout - Width" variation setting
  3. In RapidWeaver, open your website file and view the Themes panel (View > Show Themes)
  4. Right-click on the "Envision" theme and select "Reveal Theme Contents in Finder"
  5. In the resultant Finder window, place your image into /Contents/images/editable_images/page-images/
  6. Ensure your image is named "image1.jpg"..."image10.jpg" or "image11.png"..."image20.png". Capitalization is important. Ensure your file names use only lower-case letters.***
  7. In RapidWeaver, select "Image 1", "Image 2", "Image 3", etc from the "Page - Banner Image" Theme Variations set

*** If you are using a JPG image, be sure your image has a ".jpg" extension and uses slot 1 - 10. If you are using a PNG image, be sure your image has a ".png" extension and uses slot 11 - 20.

How to use the built-in search form with RapidSearch

  1. You will need an activated copy of RapidSearch to use the built-in search form
  2. Create a new RapidSearch page at the top level of your website's page hierarchy
  3. View the "General" tab in the RapidSearch page's Page Inspector window
  4. Set the "Filename" text field to "index.html"
  5. Set the "Folder" text field to "search"
  6. In the "Styles" tab of the Page Inspector for any page, set the "Search Form - Visibility" variation to "Show"

How to use the built-in jQuery 1.3.2 Javascript library

Envsion includes a built-in and minified copy of jQuery 1.3.2 for your convenience. This copy of jQuery does not use the "$" namespace by default; I have enabled "No Conflict" mode so that it plays nice with other Javascript libraries you may already be using. Use the following Javascript snippet anywhere on your website to call your own jQuery Javascript code.

jQuery(document).ready(function($){
	alert('Insert your Javascript here. You may now safely use the $ namespace.');
});

If you paste this snippet into a Styled Text page or sidebar, be sure you also highlight the Javascript code and select "Format -> Ignore Formatting" from the "Format" menu. To include custom jQuery plugins, you can insert the necessary <script> tags like this:

  1. Open the "Page Inspector > Header > Header" tab in a page's Page Inspector
  2. Insert the necessary <script> tags and publish the page

How to use the built-in Pretty Photo lightbox gallery

For a Styled Text page

  1. Create a Styled Text page
  2. Open the Page Inspector for this page and view the "Header" tab
  3. Upload a page asset (an image file, a SWF file, or a MOV file)
  4. Enter and select some text on the Styled Text page
  5. With the text selected, click the "Add Link" icon (located at the bottom left of the Styled Text page in Edit Mode)
  6. Click on the drop-down box and select "Asset -> [Name of Asset]"
  7. Next, click "Custom Attributes" to reveal the advanced settings
  8. Click the "+" icon to add a new custom attribute
  9. Set the new attribute "key" to "rel"
  10. Set the new attribute "value" to "prettyPhoto"

For an HTML page

  1. Create an HTML page
  2. Open the Page Inspector for this page and view the "Header" tab
  3. Upload a page asset (an image file, a SWF file, or a MOV file)***
  4. Create a hyperlink and assign it an "rel" attribute, as shown immediately below
<a href="path/to/asset" title="Asset Title" rel="prettyPhoto">Link text or thumbnail</a>

***The "href" attribute does not need to be to an asset on the given page. It can be any relative or absolute URI to any asset available on the World Wide Web. You can learn more by watching my advanced Pretty Photo tutorial on my website. You can also learn more about Pretty Photo at the PrettyPhoto website.

Release Notes

Version 2 - Released on 04 Sep, 2009

  • + Added "Navigation - Height" theme variation
  • + Added "Navigation - Left and Right Padding" theme variation
  • + Added "Blog - Colors > Read More Link" color picker
  • + Added "Blog - Colors > Read More Link (Hover)" color picker
  • + Added 300px, 350px, 400px options to "Header - Height" theme variation
  • + Added 50px, 350px, 400px options to "Banner - Height" theme variation
  • + Added IE8 compatibility
  • + Fixed search icon positioning bug
  • - Removed "Title - Font Weight" theme variation (see theme FAQs)
  • - Removed "Page - H1 Font Size" theme variation (see theme FAQs)
  • - Removed "Page - H2 Font Size" theme variation (see theme FAQs)
  • - Removed "Page - H3 Font Size" theme variation (see theme FAQs)
  • - Removed "Page - H4 Font Size" theme variation (see theme FAQs)
  • + Added RWSnippets as substitutes for removed theme variations

Version 1 - Released on 25 Aug, 2009

Initial releaes

Flex 1

Flex 1

Screenshots

Here are a few screenshots of Flex. You can also view the live preview.

  • Flex 1 Screenshot 1
  • Flex 1 Screenshot 2
  • Flex 1 Screenshot 3

Features

Hybrid Menu

Flex provides a hybrid horizontal menu with vertical dropdowns that provides 2 horizontal menu levels with up to 6 vertical dropdowns. You can also control the menu tab and dropdown opacities.

Header Backgrounds

Use up to 20 JPG and PNG header background images in Flex. Customize the background position and specify its repeat direction using Theme Variations in the Page Inspector.

Page Banners

Use up to 20 JPG and PNG page banner images in Flex. Banners can be shown or hidden on a per-page basis. You can also apply rounded corners to your banner!

Rounded Corners

Apply rounded corners to menu tabs, the sidebar, and banner images. You can control the corner radii for each layout element using Theme Variations in the Page Inspector.

Sidebars

Flex allows you to place your sidebar on the left or right side of the page. You can also hide the sidebar, too, on a per-page basis.

Built-in jQuery Javascript

Flex provides the jQuery Javascript library built-in! You immediately have access to the entire jQuery library, and it uses "No Conflict Mode" to not conflict with other libraries.

Built-in RapidSearch Form

Flex provides a built-in RapidSearch form to quickly add site-wide Google search to your Flex website. RapidSearch sold separately or in a bundle. Learn more about RapidSearch

Built-in PrettyPhoto Lightbox

Flex provides the PrettyPhoto Lightbox built-in! You can quickly and easily create galleries and slideshows from photos, videos, Flash movies ,and external websites. See an example gallery

Supports JS-Kit Echo Comments

Flex supports JS-Kit's Echo comment system out-of-the-box. Enjoy real-time conversation among various social graphs from your Flex website. Learn more about Echo

Color Pickers & Variations

Flex provides a ton of color pickers and theme variations for almost every layout element. Flex is one of my most customizable themes to date.

Theme Styles

Flex provides 6 theme styles to help get you started. Use these Theme Styles as a jumping off point to quickly and easily customize your own Flex website.

Supports RapidWeaver 4

Flex was built for RapidWeaver 4 and supports all of the latest RapidWeaver features.

Built with web standards in mind

Flex was built with web standards in mind. Flex uses the XHTML 1.0 Strict DTD, and you can use color pickers to style a, p, em, i, strong, b, blockquote, cite, code, ins, del, and more!

Web Browser Support

  • Safari
  • Firefox
  • Chrome
  • Internet Explorer 8
  • Internet Explorer 7
  • Internet Explorer 6

***Rounded corners do not work in Internet Explorer. Transparent PNGs do not work in Internet Explorer 6.

Theme Variations

Layout - Width

  • 700px
  • 800px
  • 900px (Default)
  • 1000px
  • 1100px
  • 1200px

Layout - Font

  • HelveticaNeue-Light (Default)
  • HelveticaNeue
  • Helvetica
  • Georgia
  • Times
  • Lucida

Layout - Border Style

  • Solid (Default)
  • Dashed
  • Dotted

Header - Title Font Size

  • 12px
  • 18px
  • 24px
  • 36px
  • 48px
  • 60px (Default)
  • 72px

Header - Slogan Font Size

  • 12px
  • 18px (Default)
  • 24px
  • 36px
  • 48px
  • 60px
  • 72px

Header - Tab Font Size

  • 12px
  • 14px
  • 16px
  • 18px (Default)
  • 20px
  • 24px

Header - Tab Corner Radius

  • 0px
  • 2px
  • 4px (Default)
  • 6px
  • 8px
  • 10px

Header - Tab Gradient

  • Show (Default)
  • Hide

Header - Tab Opacity

  • 100% (Default)
  • 95%
  • 90%
  • 85%
  • 80%
  • 75%
  • 70%
  • 65%
  • 60%
  • 55%
  • 50%

Header - Dropdown Opacity

  • 100% (Default)
  • 95%
  • 90%
  • 85%
  • 80%
  • 75%
  • 70%

Header - Background Image

  • None (Default)
  • Image 1 (JPG) ... Image 10 (JPG)
  • Image 11 (PNG) ... Image 20 (PNG)

Header - Background Repeat

  • No Repeat (Default)
  • Repeat X
  • Repeat Y
  • Repeat X and Y

Header - Background Position

  • Top Left
  • Top Center
  • Top Right
  • Bottom Right
  • Bottom Center
  • Bottom Left

Header - Colors

  • Title
  • Slogan
  • Background
  • Bottom Border
  • Tab Link
  • Tab Link (Hover)
  • Tab Link (Current)
  • Tab Background
  • Tab Background (Hover)
  • Tab Background (Current)
  • Submenu Link
  • Submenu Link (Hover)
  • Submenu Link (Current)

Sidebar - Position

  • Left
  • Right (Default)
  • Hide

Sidebar - Corner Radius

  • 0px
  • 2px
  • 4px (Default)
  • 6px
  • 8px
  • 10px

Sidebar - Colors

  • Title
  • Text
  • Link Text
  • Link Text (Hover)
  • Link Background
  • Link Background (Hover)
  • Link Border
  • Background

Search Form - Visibility

  • Show (Default)
  • Hide

Search Form - Colors

  • Background

Page - Title

  • Show (Default)
  • Hide

Header - Dropdown Opacity

  • 100% (Default)
  • 95%
  • 90%
  • 85%
  • 80%
  • 75%
  • 70%

Page - Banner Image

  • None (Default)
  • Image 1 (JPG) ... Image 10 (JPG)
  • Image 11 (PNG) ... Image 20 (PNG)

Page - Banner Corner Radius

  • 0px
  • 2px
  • 4px (Default)
  • 6px
  • 8px
  • 10px

Page - H1 Font Size

  • 12px
  • 18px
  • 24px
  • 36px (Default)
  • 48px
  • 60px
  • 72px

Page - H2 Font Size

  • 12px
  • 18px (Default)
  • 24px
  • 36px
  • 48px
  • 60px
  • 72px

Page - H3 Font Size

  • 12px (Default)
  • 18px
  • 24px
  • 36px
  • 48px
  • 60px
  • 72px

Page - H4 Font Size

  • 12px (Default)
  • 18px
  • 24px
  • 36px
  • 48px
  • 60px
  • 72px

Page - Colors

  • Title
  • Text
  • H1
  • H2
  • H3
  • H4
  • Link
  • Link (Hover)
  • Strong / Bold
  • Em / Italic
  • Code
  • Blockquote
  • Blockquote Border
  • Insertion
  • Deletion
  • Breadcrumb Link
  • Breadcrumb Link (Hover)
  • Breadcrumb Background
  • Background

Footer - Colors

  • Text
  • Link
  • Link (Hover)
  • Border
  • Background

Blog - Colors

  • Entry Title
  • Entry Title (Hover)
  • Entry Meta Text
  • Entry Meta Link
  • Entry Meta Link (Hover)

Photo Album - Colors

  • Thumbnail Caption
  • Thumbnail Border
  • Fullsize Page Header Background
  • Fullsize Page Body Background
  • Fullsize Page Caption

File Sharing - Colors

  • Link
  • Link (Hover)
  • Description
  • Background

Movie Album - Colors

  • Thumbnail Caption
  • Thumbnail Border
  • Popup Caption
  • Popup Background

Frequently Asked Questions

Why do PNG images not work in Internet Explorer 6?

I will no longer support PNG image transparency in IE6. This browser is 8 years old, and there is no excuse for continuing to it. However, Flex will otherwise display as expected.

Why do rounded corners not work in Internet Explorer?

Internet Explorer does not support the border-radius CSS property. I use this CSS property in Flex to provide end users the ability to customize the theme layout using Theme Variations. There are Javascript libraries that enable rounded corners in Internet Explorer, but they provide too much overhead and are not as flexible or customizable for the end user.

Will I need RapidSeach to use the built-in search form?

Yes. You can purchase RapidSearch on my website for an additional USD $15.00. You can also purchase the Flex/RapdiSearch bundle at a discounted rate.

I am already using MooTools, Prototype, or Scriptaculous. Will Flex still work?

Yes. Flex comes bundled with jQuery 1.3.2 in "No Conflict" mode. This ensures it will play nice with any other Javascript libraries you may already be using.

Documentation

Installation

  1. Download your purchase to your computer. This will be a ZIP file.
  2. Double-click the downloaded ZIP file to expand its contents.
  3. Double-click the .rwtheme or .rwplugin file that was in the ZIP file.
  4. Restart RapidWeaver.

Table of Contents

System Requirements

  1. RapidWeaver 3.6+ (4.0+ recommended)
  2. Javascript-enabled web browser

How to use a custom header image

You may use up to 20 header background images with Flex. There are 10 slots for JPG images and 10 slots for PNG images.

  1. Create or find an image you want to use as your header background (repeatable images work best)
  2. In RapidWeaver, open your website file and view the Theme Library panel
  3. Right-click on the "Flex" theme and select "Reveal Contents in Finder"
  4. In the resultant Finder window, place your image into /Contents/images/editable_images/header-background-images/
  5. Ensure your image is named "image1.jpg", "image2.jpg", "image3.jpg", etc***
  6. In RapidWeaver, select "Image 1", "Image 2", "Image 3", etc from the "Header - Background Image" Theme Variations set
  7. You may also select "Header - Background Position" and "Header - Background Repeat" settings

*** If you are using a JPG image, be sure your image has a ".jpg" extension and uses slot 1 - 10. If you are using a PNG image, be sure your image has a ".png" extension and uses slot 11 - 20.

How to use a custom page banner image

You may use up to 20 banners with Flex. There are 10 slots for JPG images and 10 slots for PNG images.

  1. Create or find an image you want to use as your page banner
  2. Ensure the image is 200px tall and as wide as the selected layout width
  3. In RapidWeaver, open your website file and view the Theme Library panel
  4. Right-click on the "Flex" theme and select "Reveal Contents in Finder"
  5. In the resultant Finder window, place your image into /Contents/images/editable_images/page-images/
  6. Ensure your image is named "image1.jpg", "image2.jpg", "image3.jpg", etc***
  7. In RapidWeaver, select "Image 1", "Image 2", "Image 3", etc from the "Page - Banner Image" Theme Variations set

*** If you are using a JPG image, be sure your image has a ".jpg" extension and uses slot 1 - 10. If you are using a PNG image, be sure your image has a ".png" extension and uses slot 11 - 20.

How to use the built-in search form with RapidSearch

  1. You will need an activated copy of RapidSearch to use the built-in search form
  2. Create a new RapidSearch page at the top level of your website's page hierarchy
  3. View the "General" tab in the RapidSearch page's Page Inspector window
  4. Set the "Filename" text field to "index.html"
  5. Set the "Folder" text field to "search"
  6. In the "Styles" tab of the Page Inspector for any page, set the "Search Form - Visibility" variation to "Show"

How to use the built-in jQuery 1.3.2 Javascript library

Flex includes a built-in and minified copy of jQuery 1.3.2 for your convenience. This copy of jQuery does not use the "$" namespace by default; I have enabled "No Conflict" mode so that it plays nice with other Javascript libraries you may already be using. To use jQuery with Flex, use the following Javascript snippet anywhere on your website.

jQuery(document).ready(function($){
	alert('Insert your Javascript here. You may now safely use the $ namespace.');
});

If you paste this snippet into a Styled Text page or sidebar, be sure you also highlight the Javascript and select "Format -> Ignore Formatting" from the "Format" menu. To include custom jQuery plugins, you can insert the necessary <script> tags like this:

  1. Open the "Header" tab in a page's Page Inspector
  2. On the "Header" tab, select the "Header" sub-tab
  3. Insert the necessary <script> tags and publish the page

How to use the built-in Pretty Photo lightbox gallery

For a Styled Text page

  1. Create a Styled Text page
  2. Open the Page Inspector for this page and view the "Header" tab
  3. Upload a page asset (an image file, a SWF file, or a MOV file)
  4. Enter and select some text on the Styled Text page
  5. With the text selected, click the "Add Link" icon (located at the bottom left of the Styled Text page in Edit Mode)
  6. Click on the drop-down box and select "Asset -> [Name of Asset]"
  7. Next, click "Custom Attributes" to reveal the advanced settings
  8. Click the "+" icon to add a new custom attribute
  9. Set the new attribute "key" to "rel"
  10. Set the new attribute "value" to "prettyPhoto"

For an HTML page

  1. Create an HTML page
  2. Open the Page Inspector for this page and view the "Header" tab
  3. Upload a page asset (an image file, a SWF file, or a MOV file)***
  4. Create a hyperlink and assign it an "rel" attribute, as shown immediately below
<a href="path/to/asset" title="Asset Title" rel="prettyPhoto">Link text or thumbnail</a>

***The "href" attribute does not need to be to an asset on the given page. It can be any relative or absolute URI to any asset available on the World Wide Web. You can learn more by watching my advanced Pretty Photo tutorial on my website. You can also learn more about Pretty Photo at the PrettyPhoto website.

Release Notes

None available

RapidSearch 4

RapidSearch 4

Screenshots

Here are a few screenshots of RapidSearch. You can also view the live preview.

  • RapidSearch 4 Screenshot 1
  • RapidSearch 4 Screenshot 2
  • RapidSearch 4 Screenshot 3

Introducing RapidSearch 4

RapidSearch 4 is the easiest way to add powerful Google search to any RapidWeaver website. Use RapidSearch 4 to search for websites, images, blog entries, and news articles. Unlike other search tools, RapidSearch 4 search results are displayed immediately on your own RapidWeaver website so you captivate your audience and control your own branding. You can purchase RapidSearch today for USD $15.00. RapidSearch 4 includes the following noteworthy features:

  • Immediate inline search results
  • Search images, blogs, & news
  • Custom search result colors
  • Custom search button text
  • Custom header and footer
  • Highlight search terms in results
  • Improved utf8 character support
  • Improved product activation

Powered by Google

RapidSearch 4 uses the Google search engine to provide the best search solution for your RapidWeaver website. Search results are displayed immediately on your own RapidWeaver website so you can control your own branding.

Search safely

The Internet can be a scary place! This is why RapidSearch 4 now comes with website and image safe search filters.

Advanced image search

RapidSearch 4 provides advanced tools to fine-tune your image search. You can filter search results by file type (JPG, PNG, GIF, and BMP), by image type (Photos, Faces, Clip Art, and Line Art), or by image resolution (Small, Medium, Large, and Extra Large).

Blog and news search

RapidSearch 4 can search blogs like Daring Fireball or news organizations and networks like The New York Times or CNN.

Minimum system requirements

  1. RapidWeaver 4.0+
  2. Mac OS X 10.5+
  3. Javascript-enabled web browser

RapidSearch does not return any results. What is wrong?

Make sure you spelled the URL correctly when you added the website to the RapidSearch page (in Edit Mode). If RapidSearch still does not return results, try changing the first part of the URL to “http://your_website.com” or “http://www.your_website.com”; sometimes Google will index a website with the leading “www” and sometimes without the leading “www”. If RapidSearch still does not return results, your website may not be indexed by the Google search engine. You can submit your website to the Google search engine at http://www.google.com/addurl/.

RapidSearch will not activate. What is wrong?

Make sure you entered your serial number into the text field correctly before you activate RapidSearch. Also make sure you are not behind a firewall that prevents outgoing HTTP requests. If RapidSearch still will not activate, contact me for further assistance.

Do I need to purchase a new RapidSearch license for each computer I use?

A single RapidSearch serial number will work on two computers. If you install RapidSearch on three or more computers, you will need to purchase a new license for every additional two computers that you use. For example, if you have four computers, you need two licenses; the first license will work on the first and second computer, and the second license will work on the third and fourth computer.

Do I need a Google account to use RapidSearch?

No. You do not need a Google account to use RapidSearch.

Can RapidSearch search password-protected pages?

No. RapidSearch only sees what the Google search engine can index. If pages are inaccessible to the Google search engine, they are inaccessible to RapidSearch.

RapidSearch does not show every page on my website. Why not?

RapidSearch only knows about the pages that have been indexed by the Google search engine. Some pages on your website may not be indexed. If you recently added a new page, it may take several days for Google to index the new page. I encourage you to read my “Search Engine Optimization” guide to make sure your website is indexed as quickly and completely as possible.

Can RapidSearch search MP3s, PDFs, Word files, or other non-HTML files?

It depends. If the Google search engine can index these files, then RapidSearch will include them in search results. RapidSearch can search for website pages, blog entries, images (JPG,PNG,GIF,BMP), and news stories.

Table of contents

  1. Minimum system requirements
  2. How to upgrade RapidSearch
  3. How to install RapidSearch
  4. How to activate RapidSearch
  5. How to deactivate RapidSearch
  6. How to create a RapidSearch page
  7. How to search for different types of content
    1. Search for website pages
    2. Search for images
    3. Search for blog entries
    4. Search for news articles
  8. How to customize RapidSearch
    1. Customize search button text
    2. Customize search result colors
    3. Display search results in linear or tabbed style
    4. Highlight matching terms in search results
    5. Open links in same or new window
    6. Insert a custom header and footer

Minimum system requirements

  1. RapidWeaver 4.0+
  2. Mac OS X 10.5+
  3. Javascript-enabled web browser

Back to top

How to upgrade RapidSearch

RapidSearch 4 is not backwards-compatible with previous versions. You must remove existing RapidSearch pages from your projects and uninstall the old RapidSearch plugin before installing RapidSearch 4. After completing these steps, read “How to install RapidSearch” below. After you install RapidSearch 4, you should re-create the RapidSearch pages in your projects.

  1. Start the RapidWeaver application.
  2. Open your existing project.
  3. Remove all RapidSearch pages from your project.
  4. Select “File > Save” from the menu bar to save your project.
  5. Select “View > Show Themes” from the menu bar.
  6. Click on the “Folder” icon at the bottom left of the Themes panel that appears (see Figure A), and select “Reveal Third Party Themes in Finder…”.
  7. In the Mac OS X Finder window that appears, move the old “RapidSearch.rwplugin” file to the Trash.
  8. Quit RapidWeaver, and proceed to install RapidSearch 4.

Back to top

How to install RapidSearch

  1. Download “RapidSearch.zip” to your computer. The download link will be sent to you by email.
  2. Double-click “RapidSearch.zip” to expand the ZIP file. This will reveal a new folder named “RapidSearch”.
  3. Double-click “RapidSearch.rwplugin” located inside of the “RapidSearch” folder to install RapidSearch.
  4. Start the RapidWeaver application.

Back to top

How to activate RapidSearch

If you upgraded to RapidSearch 4 from a previous version, your previous serial number will remain valid, RapidSearch 4 will remain activated, and you may skip this section. If you purchased a new copy of RapidSearch 4, you will need to activate the plugin before you can use it for production. Your serial number will be sent to you by email after your purchase.

  1. Start the RapidWeaver application.
  2. Create a new project or open an existing project.
  3. Add a RapidSearch page to your project (see How to create a RapidSearch page… below).
  4. Select and view the RapidSearch page while in Edit Mode.
  5. Click the “Activate” button located in the bottom right corner of the RapidSearch interface.
  6. When the Page Inspector > Activation tab appears, enter your serial number into the text field and click “Activate”.
  7. If a green check mark appears, RapidSearch is activated. If a green check mark does not appear, RapidSearch is not activated.

If RapidSearch will not activate, please read the FAQs on the RapidSearch product web page before you contact me for assistance.

Back to top

How to deactivate RapidSearch

You should deactivate RapidSearch before re-installing Mac OS X or transferring RapidWeaver to a new computer. Deactivating your RapidSearch serial number allows you to transfer your existing RapidSearch license to another computer without purchasing a new license.

  1. Start the RapidWeaver application.
  2. Create a new project or open an existing project.
  3. Add a RapidSearch page to your project (see How to create a RapidSearch page… below).
  4. Select and view the RapidSearch page while in Edit Mode.
  5. Click the “Options” button located in the bottom right corner of the RapidSearch interface.
  6. When the Page Inspector > Options panel appears, click the “Activation” tab.
  7. Enter your serial number into the text field and click “Deactivate”.
  8. If a red “x” appears, RapidSearch is deactivated. If a red “x” does not appear, RapidSearch is still activated.

Back to top

How to create a RapidSearch page

  1. Start the RapidWeaver application.
  2. Create a new project or open an existing project.
  3. Click the “Add Page” button located at the top left of the RapidWeaver interface.
  4. Double-click the “RapidSearch” icon when prompted to “choose a page to add to your website”. You may need to scroll down to see the RapidSearch icon.
  5. After you create the RapidSearch page, click the ”+” icon located at the lower left corner of the RapidSearch interface to add a new website to search. You can search any website (not just your own).
  6. Assign a label and URL to the new website line-item shown in the website list.
  7. Select “Web”, “Image”, “News”, or “Blog” in the website line-item’s Search Type drop-down to define what content you want to search (See How to search different content below).
  8. Publish or preview your RapidSearch page.

Back to top

How to search for different types of content with RapidSearch

RapidSearch 4 allows you to search for more than just website pages. You can also search for images, blog entries, and news items. Each line-item in the RapidSearch website list has a Search Type drop-down where you can define what content you want to search.

Search for website pages

Like previous versions of RapidSearch, the “Web” Search Type will return search results for normal website pages. This is the default Search Type setting and will likely be used most of the time.

Website Safe Search

You can set the “Web Safe Search” setting (Page Inspector > Options > Advanced tab) to control what kind of website pages are returned by RapidSearch.

  1. Off will not filter explicit pages from search results.
  2. Moderate will filter explicit pages from search results.
  3. Strict will filter all potentially objectionable pages from search results.

Back to top

Search for images

The “Images” Search Type will return search results for images that are found on the searched website.

Image Safe Search

You can set the “Image Safe Search” setting (Page Inspector > Options > Advanced tab) to control the kind of images returned by RapidSearch.

  1. Off will not filter explicit images from search results.
  2. Moderate will filter explicit images from search results.
  3. Strict will filter all potentially objectionable images from search results.

Image File Type

You can set the “Image File Type” setting (Page Inspector > Options > Advanced tab) to control the image file types returned by RapidSearch.

  1. Any will return all images regardless of file type
  2. JPG will return only JPG images
  3. PNG will return only PNG images
  4. GIF will return only GIF images
  5. BMP will return only BMP images

Image Type

You can set the “Image Type” setting (Page Inspector > Options > Advanced tab) to control the kind of images returned by RapidSearch.

  1. Any will return all images
  2. Faces will return only images with faces
  3. Photos will return only images that are photos (ie. not faces, line art, or clip art)
  4. Clip Art will return only images that are clip art
  5. Line Art will return only images that are line art

Image Size

You can set the “Image Size” setting (Page Inspector > Options > Advanced tab) to filter search results by image resolution. The actual search results on the RapidSearch page will show a thumbnail image that will link to the full resolution image in context on the searched website.

  1. Any will return all images of any size
  2. Small will return only small-sized images
  3. Medium will return only medium-sized images
  4. Large will return only large-sized images
  5. Extra Large will return only extra-large-sized images

Back to top

Search for blog entries

RapidSearch 4 can also search for blog entries that are indexed and available through Google Blog Search. If you need RapidSearch to search your own blog, be sure you submit your website to Google Blog Search at “http://blogsearch.google.com/ping/”.

  1. Create a new RapidSearch page.
  2. After you create the RapidSearch page, click the ”+” icon located at the lower left corner of the RapidSearch interface to add a new website to search.
  3. Assign a label (ie. “Daring Fireball”) and URL (ie. “http://daringfireball.net”) to the new website line-item shown in the website list.
  4. Select “Blog” in the website line-item’s Search Type drop-down.
  5. Publish or preview your RapidSearch page.

Back to top

Search for news articles

RapidSearch 4 can also search for news articles released by news websites and networks. To search for news articles:

  1. Create a new RapidSearch page.
  2. After you create the RapidSearch page, click the ”+” icon located at the lower left corner of the RapidSearch interface to add a new website to search.
  3. Assign a label (ie. “New York Times”) and URL (ie. “http://www.nytimes.com” or “New York Times”) to the new website line-item shown in the website list.
  4. Select “News” in the website line-item’s Search Type drop-down.
  5. Publish or preview your RapidSearch page.

Back to top

How to customize RapidSearch

You can customize the layout style, colors, and more of search results returned by RapidSearch 4.

Customize the search button text

To customize the text in the Search form button (ie. “Search”, “Go”, “Find”), open the Page Inspector > Options > General tab. Enter your custom text in the “Search Button Text” text field. If no text is specified, “Search” will be used as the default text.

Back to top

Customize search result colors

Open the Page Inspector > Options > Colors tab. Click the appropriate color picker to select a color.

Back to top

Customize search results presentation

You can display search results for different websites in a linear style (search results for different websites appear vertically, one on top of the other) or in a tabbed style (search results for different websites appear in separate tabs). Open the Page Inspector > Options > Advanced tab. Select “Linear” or “Tabbed” beneath “Search Results Presentation”.

Back to top

Hightlight search results

You can optionally highlight matching terms in search results with a custom text and background color. Open the Page Inspector > Options > Advanced tab. Beneath “Search Result Highlighting”, check “Highlight matching terms…” to enable highlighting. You may also choose a custom text and bakground color for highlighted terms.

Back to top

You can optionally have search result links open in the same window or in a new window. Open the Page Inspector > Options > General tab. Choose either “Open in new window” or “Open in same window” beneath “Search Result Links”.

Back to top

You can optionally insert custom text above and below the RapidSearch form. Open the Page Inspector > Options > General tab. Insert your custom text or HTML markup into the “Header Text” and “Footer Text” fields.

Back to top

Release Notes

Version 4 - Released on November 22, 2009

  1. Added Web, Image, Blog, and News search types
  2. Added custom colors
  3. Added web and image safe search filter
  4. Added advanced image search filters
  5. Redesigned user interface
  6. Improved utf8 character support
  7. Improved activation process

Version 3 - Released on June 24, 2009

  1. Added support for UTF8 and URL-encoded characters
  2. Added ability to customize Search button text
  3. Added ability to deactivate a serial number

Version 2.0

RapidSearch 2.0 is wildly different from version 1.0. These are the differences between version 1.0 and version 2.0.

  1. RapidSearch 2.0 uses the Google™ search engine — not Yahoo™.
  2. RapidSearch 2.0 can search an unlimited number of websites.
  3. RapidSearch 2.0 provides customizable search results highlighting.
  4. RapidSearch 2.0 only requires a javascript-enabled web browser.
  5. You do not need PHP or Curl for RapidSearch 2.0 to work.

How to upgrade from version 1.0

You must remove the old RapidSearch 1.0 plugin and delete your existing RapidSearch pages from both your RapidWeaver file and your web server. You must complete these steps before you install RapidSearch 2.0.

  1. Backup all relevant files.
  2. Delete your RapidSearch 1.0 page, and save your RapidWeaver file.
  3. Remove the old RapidSearch.rwplugin file from the directory "~/Library/Application Support/RapidWeaver/".
  4. Ensure the published RapidSearch 1.0 PHP file is removed from your web server.
  5. Follow the installation instructions located on the Getting Started page.

Search Engine Optimization Guide

My RapidSearch plugin for RapidWeaver relies on the Google search engine to index your RapidWeaver website. RapidSearch will only return search results for pages that have been indexed. Therefore, it is in your best interest to use good search engine optimization practices. This is a beginner’s guide to help you learn and use search engine optimization in your RapidWeaver website.

  1. The Basics
    1. How to add a title
    2. How to add a description
  2. Submit your website to Google
  3. Ensure timely updates to the Google search index
    1. What is a sitemap.xml file?
    2. Setup a Google Webmasters account
    3. Automatically create and submit sitemap.xml during Publish

The basics

Search Engine Optimization is a fancy name for several basic tasks.

  1. Assign a unique and meaningful title to every page in your website (69 characters or less).
  2. Assign a unique and meaningful description to every page in your website (156 characters or less)
  3. Add unique and meaningful content to every page in your website. Include keywords in the content.

In step 3, I encourage you to include keywords in the page’s content. These keywords will further enforce the meaning and value of the page when the page is indexed. But it is also important to write content for your users — not for Google. Use your best judgment when inserting keywords into the page’s content. For example, this page is about “RapidWeaver”, “Google”, and “Search Engine Optimization”. Notice how I use these keywords on this page.

Many customers may ask, “what about meta keywords?” Google does not use meta keywords to index and rank your website. Yahoo and Bing still index meta keywords although meta keywords have little to no effect on your PageRank.

Back to top

How to assign a title to a page in your RapidWeaver project

  1. Start the RapidWeaver application.
  2. Open your RapidWeaver project.
  3. Select a page while in Edit Mode.
  4. Open the Page Inspector > Options > General tab for the seleted page.
  5. Enter a unique title into the “Title” and “Browser Title” text fields.

Back to top

How to assign a description to a page in your RapidWeaver project

  1. Start the RapidWeaver application.
  2. Open your RapidWeaver project.
  3. Select a page while in Edit Mode.
  4. Open the Page Inspector > Options > Header tab for the seleted page.
  5. Click the ”+” icon to add a new Meta Tag.
  6. Enter “description” as the meta tag name.
  7. Enter a unique description of the selected page as the meta tag content.

Back to top

Submit your website to the Google search engine

If your website is not automatically indexed by the Google search engine, go to http://www.google.com/addurl/ and enter your website’s URL.

Back to top

Ensure comprehensive and timely upates to Google’s search index

When you add new content to your RapidWeaver website, it may take several days for Google to automatically find and index the new content. You can expedite this process by submitting a sitemap.xml file when you publish new content to your RapidWeaver website.

What is a sitemap.xml file?

A sitemap.xml file is an XML document that lists every URL in your website. The Google search engine will reference your sitemap.xml file when it indexes or re-indexes your RapidWeaver website. You don’t need to know how to write a sitemap.xml file. It is only important that you know what a sitemap.xml file is, that it improves search engine optimization, and that it helps the Google search engine learn about new content on your RapidWeaver website. Below you will learn how to automatically create and submit a sitemap.xml file when you publish your RapidWeaver website.

Back to top

Setup a Google Webmasters account

A Google Webmasters account allows you to carefully control how your website is indexed by the Google search engine. You can review which pages have been indexed and which pages have not been indexed. You can also review problems that occur while the Google search engine indexes your RapidWeaver website (ie. missing pages, duplicate meta tags, etc). You can also manually submit a sitemap.xml file via your Google Webmasters account. But there is an easier way to submit a sitemap.xml file, which I will cover next.

Back to top

How to automatically create and submit a sitemap.xml file when you publish your RapidWeaver website

LogHound provides a brilliant RapidWeaver plugin called SiteMap. SiteMap helps you easily add unique titles and descriptions to every page in your RapidWeaver website. SiteMap also automatically creates a sitemap.xml file when you publish your RapidWeaver website; SiteMap submits the sitemap.xml file to the Google search engine to notify Google about new content added to your website. LogHound’s SiteMap plugin is the easiest way to optimize your RapidWeaver website for modern search engines.

Back to top

Silk 5

Silk 5

Screenshots

Here are a few screenshots of Silk. You can also view the live preview.

  • Silk 5 Screenshot 1
  • Silk 5 Screenshot 2
  • Silk 5 Screenshot 3

Features

Silk is my best-selling RapidWeaver theme. Here are a few features from Silk:

  • Left or right sidebar
  • 48 color pickers
  • 138 theme variations
  • 8 layout widths
  • 6 font families
  • Align tabs left, center, or right
  • Align logo left, center, or right
  • Up to 20 banner images

Theme Variations

Layout Colors

  • Body Background
  • Content Background
  • Content Border

Header Colors

  • Site Title
  • Site Slogan
  • Toolbar Links
  • Toolbar Links (Hover)
  • Toolbar Links (Current)
  • Toolbar Links (Ancestor)
  • Breadcrumb Links
  • Breadcrumb Links (Hover)
  • Breadcrumb Background

Content Colors

  • Content Headers
  • Content Text
  • Content Links
  • Content Links (Hover)
  • Code Text
  • Code Background
  • Blockquote Text
  • Blockquote Background

Sidebar Colors

  • Sidebar Title
  • Sidebar Content Text
  • Sidebar Divider
  • Sidebar Content Links
  • Sidebar Content Links (Hover)
  • Sidebar Menu Links
  • Sidebar Menu Links (Hover)
  • Sidebar Menu Links (Current)
  • Sidebar Menu Links (Ancestor)

Footer Colors

  • Footer Text
  • Footer Links
  • Footer Links (Hover)

Blog Colors

  • Blog Entry Title
  • Blog Entry Date
  • Blog Entry Tags
  • Blog Archive Month

Photo Album Colors

  • Photo Album Title
  • Photo Page Title
  • Photo Page Caption
  • Photo Page Links
  • Photo Page Background
  • Photo Page EXIF Text

File Sharing Colors

  • File Sharing Links
  • File Sharing Links (Hover)
  • File Sharing Descriptions

Movie Album Colors

  • Movie Album Title
  • Movie Album Captions
  • Movie Popup Background
  • Movie Popup Title

Header Shine

  • Hide
  • Show

Layout Width

  • 440px
  • 540px
  • 640px
  • 740px
  • 840px
  • 940px
  • 1040px
  • 1140px

Fonts

  • Arial
  • Helvetica
  • Lucida
  • Trebuchet
  • Georgia
  • Verdana

Content Font Size

  • 11px
  • 12px
  • 13px
  • 14px

Sidebar Font Size

  • 11px
  • 12px
  • 13px
  • 14px

Footer Font Size

  • 11px
  • 12px
  • 13px
  • 14px

Toolbar Tabs Font Size

  • 10px
  • 11px
  • 12px
  • 13px
  • 14px
  • 15px
  • 16px
  • 17px
  • 18px
  • 19px
  • 20px
  • 21px
  • 22px
  • 23px
  • 24px

Toolbar Tabs Alignment

  • Left
  • Center
  • Right

Toolbar Tabs Spacing

  • 1px
  • 2px
  • 3px
  • 4px
  • 5px
  • 6px
  • 7px
  • 8px
  • 9px
  • 10px

Logo Alignment

  • Left
  • Center
  • Right

Breadcrumbs Background Opacity

  • 0%
  • 10%
  • 20%
  • 30%
  • 40%
  • 50%
  • 60%
  • 70%
  • 80%
  • 90%
  • 100%

Sidebar Alignment

  • Left
  • Right
  • Hide

Sidebar Divider

  • Hide
  • Show

Banner Image

  • Image 1 ... Image 20
  • None

Banner Height

  • 100px
  • 125px
  • 150px
  • 175px
  • 200px
  • 225px
  • 250px
  • 275px
  • 300px

Frequently Asked Questions

  1. What is the Sidebar Divider? Why is it not working?

    The sidebar divider is a horizontal line that divides the sidebar menu from any sidebar content shown below the sidebar menu. The sidebar divider will NOT be shown if there is no sidebar menu on the given page. To display a sidebar divider on a RapidWeaver page using Silk 4.1, ensure you have a sidebar menu on the given page and that you have chosen to show the sidebar divider in the Theme Variations panel.

  2. Can I change the color of Silk’s main menu tabs?

    Due to technical difficulty, menu tab color pickers were not implemented into Silk. However, I do provide Photoshop templates with your Silk purchase. You can use these templates to create and install your own custom tabs. These templates are located in the Extras folder that came with your product download.

Documentation

Installation

  1. Download your purchase to your computer. This will be a ZIP file.
  2. Double-click the downloaded ZIP file to expand its contents.
  3. Double-click the .rwtheme or .rwplugin file that was in the ZIP file.
  4. Restart RapidWeaver.

System Requirements

  1. Mac OS X 10.4+
  2. RapidWeaver 3.6+ (4.0+ recommended)
  3. Javascript-enabled web browser

How to use a custom page banner

You may use up to 20 banners with Silk. Follow these directions to create a custom banner image for Silk.

  1. Create an image that is 200px tall and 40px less wide than your layout width (ie. if your layout is 740px wide, your image should be 700px wide).
  2. Save your image as a JPEG using the “.jpg” extension into the directory silk.rwtheme/Contents/images/editable_images/.
  3. Right-click “silk.rwtheme” and choose “Show Package Contents” to access the contents of the Silk theme.
  4. Name your image “image#.jpg”, where “#” is 1, 2, 3, ... or 20. For example, you might name an image “image15.jpg”.
  5. Restart RapidWeaver and select the appropriate banner image in the Theme Variations panel.

Release Notes

Version 5.0 - Released on May 18, 2009

+ Greatly reduced shifting of menu tabs on page load
+ Added META content-type and charset declaration in HEAD
+ Ensured compatibility with JS-Kit inline comments in RapidWeaver 4.2.2
+ Added jQuery 1.3.2 Javascript library into theme
+ Updated RapidWeaver specific Javascript
+ Updated styles.css LINK media attribute from “screen” to “all”
+ Updated colour_tags.css LINK media attribute from “screen” to “all”
+ Updated print.css (removed extraneous styles)
+ Fixed several CSS validation errors. CSS now validates as CSS Level 3
+ Ensured IE8 compatibility.
+ Renamed “Logo Alignment” variation to “Title/Slogan/Logo Alignment”
+ Added “Photo Album Colors > Photo Page Frame Border” color picker
+ Added “Title/Slogan Font Size” variations to adjust size of site title and slogan

Version 4.1

+ Fixed “jumping” in site header that occurred during page load
+ Re-implemented header “shine” as was present in Silk 3
+ HTML lists in sidebar now display as expected in IE6
+ Added new color picker to control breadcrumb bar background-color
+ Added new theme variation to control opacity of breadcrumb bar background-color
+ Added new theme variation to disable shadow in site header that overlays the main menu tabs
+ Added Verdana to font theme variation

Page banners are implemented differently in Silk 4 than in previous Silk versions. This is necessary to prevent AdBlock and other ad blocking software from hiding your page banner images. Please follow these steps to transfer your previous page banners into your new Silk 4 theme.

  1. To access the contents of the Silk theme, right-click on the .rwtheme file and choose “Show Package Contents”.
  2. Copy your existing page banner images from Silk 3 into Silk 4. Custom page banners should be placed into the “/Contents/images/editable_images/“ directory within the .rwtheme file.
  3. You must rename your page banner images from “banner_#.jpg” to “image#.jpg”, where # is 1, 2, 3, etc.

Version 4.0

+ Editable body background color w/ color picker
+ Editable content border color w/ color picker
+ Editable content background color w/ color picker
+ Fluid width menu tabs support 11px to 24px font sizes
+ Menu tabs align left, center, or right
+ Logo auto-linked to base url
+ Wider layout options
+ Clear demarcation between sidebar menu and sidebar content
+ Independent font size controls for sidebar, content, and footer
+ Now supports up to 20 page banner images
+ Banner height variations from 100px to 300px
+ Now supports up to 6 menu levels

Satin 3

Satin 3

Screenshots

Here are a few screenshots of Satin. You can also view the live preview.

  • Satin 3 Screenshot 1
  • Satin 3 Screenshot 2
  • Satin 3 Screenshot 3

Features

Satin was modeled after Silk but with a sharper aesthetic. Satin has a lot of features, including:

  • Up to 8 menu levels
  • Up to 20 banner images
  • Up to 10 background images
  • 4 Theme Styles
  • Left or right sidebar
  • 6 layout widths
  • Tab font size control
  • Movie/Photo album grid spacing

Theme Variations

Layout Widths

  • 500px
  • 600px
  • 700px
  • 800px
  • 900px
  • 1000px

Layout Fonts

  • Arial
  • Georgia
  • Times
  • Trebuchet
  • Lucida
  • Verdana

Layout Background Images

  • Background 1 ... Background 10
  • None

Layout Header Colors

  • Site Title
  • Site Slogan

Main Menu Colors

  • Tab Background
  • Tab Background (Hover)
  • Tab Background (Current)
  • Tab Background (Ancestor)
  • Tab Highlight
  • Tab Highlight (Hover)
  • Tab Highlight (Current)
  • Tab Highlight (Ancestor)
  • Tab Text
  • Tab Text (Hover)
  • Tab Text (Current)
  • Tab Text (Ancestor)

Main Menu Spacing

  • 1px
  • 2px
  • 3px
  • 4px

Main Menu Font Size

  • 11px
  • 12px
  • 13px
  • 14px

Banner Colors

  • Banner Title Background
  • Banner Title Text

Banner Opacity

  • 0%
  • 10%
  • 20%
  • 30%
  • 40%
  • 50%
  • 60%
  • 70%
  • 80%
  • 90%
  • 100%

Banner Image

  • Banner 1 ... Banner 20
  • Page Title Only
  • None

Banner Title Visibility

  • Show
  • Hide

Body Colors

  • Body Background
  • Content Background
  • Body Text
  • Headers (h1,h2,h3,h3,h5)
  • Body Links
  • Body Links (Hover)
  • Code / Blockquote Background
  • Code / Blockquote Text

Body / Sidebar Font Size

  • 11px
  • 12px
  • 13px
  • 14px

 

Sidebar Colors

  • Sidebar Title
  • Sidebar Text
  • Sidebar Links
  • Sidebar Links (Hover)
  • Sidebar Links (Current)
  • Sidebar Links (Ancestor)

Sidebar Position

  • Right
  • Left
  • None

Footer Colors

  • Footer Text
  • Footer Links
  • Footer Links (Hover)

Blog Colors

  • Blog Entry Title
  • Blog Entry Date Text
  • Blog Entry Date Links
  • Blog Entry Date Links (Hover)
  • Blog Entry Tags / Comments Text
  • Blog Entry Tags / Comments Links
  • Blog Entry Tags / Comments Links (Hover)
  • Blog Archive Header

Photo Album Colors

  • Photo Album Title
  • Photo Album Captions

Photo Album Spacing

  • Default
  • +1
  • +2
  • +3
  • +4

Photo Slide Colors

  • Photo Slide Background
  • Photo Title
  • Photo Caption
  • Photo Links
  • Photo Links (Hover)

File Sharing Page Colors

  • File Links
  • File Links (Hover)
  • File Descriptions

Movie Album Colors

  • Movie Album Title
  • Movie Album Captions

Movie Album Spacing

  • Default
  • +1
  • +2
  • +3
  • +4

Movie Popup Colors

  • Movie Popup Background
  • Movie Popup Title
  • Movie Popup Captions

Frequently Asked Questions

Can I disable the background images?

Yes. You can use the Theme Variations to disable the background image.

Will the background image work in Internet Explorer 6?

Not by default. The background images bundled with Satin are tiled transparent PNG images that will not work in Internet Explorer 6. However, I do provide a screencast video tutorial detailing how to customize your own body background images for Internet Explorer 6.

Documentation

Installation

  1. Download your purchase to your computer. This will be a ZIP file.
  2. Double-click the downloaded ZIP file to expand its contents.
  3. Double-click the .rwtheme or .rwplugin file that was in the ZIP file.
  4. Restart RapidWeaver.

System Requirements

  1. Mac OS X 10.4+
  2. RapidWeaver 3.6+ (4.0+ recommended)
  3. Javascript-enabled web browser

Custom Banner Images

You may use up to 20 custom page banners with Satin. Follow these instructions to create and install a custom banner with Satin.

  1. Create a banner image that is 200px tall and the same width as your layout (if your layout is 800px wide, your image should be 800px wide).
  2. Save your image as a JPEG image, with a “.jpg” extension, into the directory satin.rwtheme/Contents/images/editable_images/.
  3. Right-click “satin.rwtheme” and choose “Show Package Contents” to view the contents of the Satin theme.
  4. Save your image as “banner#.jpg”, where “#” is 1, 2, 3, ... or 20. For example, you might save an image called “banner15.jpg”.
  5. Restart RapidWeaver, and select the appropriate banner image in the Theme Variation panel.

If you wish to use an image that is not 200px tall, you must override the default banner height with the following custom CSS (adjusted to your preferences):

#banner { height: 250px; }

Release Notes

Satin v3 released on 15 May 2009

+ Added META content-type and charset declarations in HEAD
+ Added SEO friendly browser title in the form of “Page Title | Site Title”
+ Updated RapidWeaver specific Javascript file
+ Added jQuery 1.3.2 Javascript library into theme
+ Ensured compatibility with IE8
+ Ensured compatibility with RapidWeaver 4.2.2 JS-Kit comments
+ Change “Photo Slide Colors” to “Photo Album Enlarged Photo Colors” in Theme Variations inspector
+ Fixed movie album page bottom padding issue
+ Fixed left sidebar shadow issue in Internet Explorer 6

Modernity 4

Modernity 4

Screenshots

Here are a few screenshots of Modernity. You can also view the live preview.

  • Modernity 4 Screenshot 1
  • Modernity 4 Screenshot 2
  • Modernity 4 Screenshot 3

Features

Modernity is a modern and slick RapidWeaver theme that includes many features, including:

  • Left or right sidebar
  • Up to 8 menu levels
  • Up to 20 banner images
  • 35 color pickers
  • 3 theme styles
  • 6 layout widths
  • Left, center, or right align logo
  • Movie/Photo album grid spacing

Supports RapidWeaver 4.2.3+

Modernity now supports the latest and greatest features in RapidWeaver 4.2.3.

JS-Kit Comments

Modernity also supports JS-Kit comments introduced in RapidWeaver 4.2.2. Now you can enjoy full-featured social commenting directly from your Modernity RapidWeaver weblog.

Integrated jQuery

The best Javascript library now comes bundled with Modernity! You have access to the entire jQuery library within your RapidWeaver website. You can call jQuery with:

jQuery(document).ready(function($){
//insert jquery here using $ namespace
});

The jQuery library provided with Modernity will not conflict with other Javascript libraries that you may already be using.

Theme Variations

Layout Widths

  • 500px
  • 600px
  • 700px
  • 800px
  • 900px
  • 1000px

Layout Colors

  • Background
  • Top Layout Border

Layout Fonts

  • Arial
  • Helvetica
  • Verdana
  • Trebuchet
  • Lucida

Header Colors

  • Site Title
  • Site Slogan

Layout Headers Kerning

  • -1
  • 0
  • +1

Layout Text Colors

  • Headers (h1,h2,h3…)
  • Body Text
  • Links
  • Links (Hover)
  • Links (Visited)
  • Blockquote/Code Text
  • Blockqutoe/Code Background

Logo Alignment

  • Left
  • Center
  • Right

Page Banner

  • Image 1 ... Image 20
  • None

Main Menu Style

  • Curved Bottom Edge
  • Straightened Bottom Edge

Main Menu Links

  • Main Tab Links
  • Main Tab Links (Hover)
  • Main Tab Links (Active)
  • Main Tab Links (Current)

Sidebar Position

  • Right
  • Left
  • None

Sidebar Menu Links

  • Sidebar Menu Links
  • Sidebar Menu Links (Hover)
  • Sidebar Menu Links (Current)

Body Colors

  • Body Background
  • Content Background
  • Body Text
  • Headers (h1,h2,h3,h3,h5)
  • Body Links
  • Body Links (Hover)
  • Code / Blockquote Background
  • Code / Blockquote Text

Blog Spacing

  • 18px
  • 24px
  • 36px

Photo Album Colors

  • Photo Album Title
  • Photo Album Captions

Photo Album Spacing

  • Default
  • +1
  • +2
  • +3
  • +4

Photo Slide Colors

  • Photo Title
  • Photo Caption
  • Photo Links
  • Photo Links (Hover)

File Sharing Page Colors

  • File Links
  • File Links (Hover)
  • File Descriptions

Movie Album Colors

  • Movie Album Title
  • Movie Album Captions

Movie Album Spacing

  • Default
  • +1
  • +2
  • +3
  • +4

Movie Popup Colors

  • Movie Popup Title
  • Movie Popup Captions

Frequently Asked Questions

None available.

Documentation

Installation

  1. Download your purchase to your computer. This will be a ZIP file.
  2. Double-click the downloaded ZIP file to expand its contents.
  3. Double-click the .rwtheme or .rwplugin file that was in the ZIP file.
  4. Restart RapidWeaver.

System Requirements

  1. Mac OS X 10.4+
  2. RapidWeaver 3.6+ (4.0+ recommended)
  3. Javascript-enabled web browser

How to upgrade from v3.0 to v4.0

  1. Backup all current theme and site files
  2. Install modernity4.rwtheme
  3. In RapidWeaver, open the Theme library and select “Modernity 4”
  4. Save your site file and re-publish

How to replace v3.0 with v4.0

  1. Backup all current theme and site files
  2. Install modernity4.rwtheme
  3. Rename modernity4.rwtheme to modernity.rwtheme
  4. Right-click on modernity.rwtheme and choose “Show Package Contents”
  5. In resultant Finder, locate /Contents/Theme.plist
  6. Open Theme.plist in a plain text editor
  7. Scroll to the bottom of this text file
  8. Change the RWThemeName value to “Modernity”
  9. Change the RWThemeShortName to “modernity”
  10. Save Theme.plist and restart RapidWeaver

Custom Page Banners

You may have up to 20 banner images with Modernity. Follow these insturctions to create and install a custom banner image.

  1. Create a banner image that is 200px tall and the same width as your layout (if your layout is 800px wide, your image is 800px wide).
  2. Save your image as a JPEG image, with a “.jpg” extension, into the directory modernity.rwtheme/Contents/images/editable_images/.
  3. Right-click “modernity.rwtheme” and choose “Show Package Contents” to view the contents of the Modernity theme.
  4. Save your image as “image#.jpg”, where “#” is 1, 2, 3, ... or 20. For example, you might save an image called “image15.jpg”.
  5. Restart RapidWeaver, and select the appropriate banner image in the Theme Variation panel.

If you wish to use an image that is not 200px tall, you must override the default banner height with the following custom CSS (adjusted to your preferences):

#featureImage { height: 250px; }

Release Notes

Version 4.0 - Released on June 13, 2009

+ Rewrote and optimized theme markup
+ Fixed layout vertical shifting issue
+ Added support for JS-Kit comments
+ Renamed “Logo Alignment” Variation to “Logo, Title, and Slogan Alignment”
+ Added jQuery 1.3.2 Javascript library
+ Added IE8 compatibility
+ Added link to home page on logo image (requires Base URL to be set)

Version 3.0

+ Enabled page banner compatibility with Ad Block software in web browsers
+ Fixed main menu rendering issue in IE6 where menu corners would appear lower than the rest of the menu.
+ Added Verdana to avaiable font variations.

If you used custom banner images on your Modernity 2 website, you will need to copy your custom banner images into the Modernity 3 theme file and rename them. Please follow these instructions.

  1. Locate your original modernity.rwtheme at ~/Library/Application Support/RapidWeaver/
  2. Right-click on modernity.rwtheme and choose Show Package Contents
  3. In the resultant Finder, navigate to /Contents/images/editable_images/
  4. Copy all images into the same location in the new modernity.rwtheme v3.0 file
  5. Rename all images from banner#.jpg to image#.jpg, where # is 1, 2, 3, etc.
  6. You can now overwrite your original modernity.rwtheme file with the new modernity.rwtheme file
  7. Restart RapidWeaver and read the information below in the next section.

Emporium 3

Emporium 3

Screenshots

Here are a few screenshots of Emporium. You can also view the live preview.

  • Emporium 3 Screenshot 1
  • Emporium 3 Screenshot 2
  • Emporium 3 Screenshot 3

Features

Emporium works well for websites with a lot of content. Emporium features three menu levels: a horizontal primary menu, a horizontal secondary menu, and a vertical tertiary menu in the sidebar. Other Emporium features are:

  • Up to 8 menu levels
  • Up to 20 banner images
  • 118 theme variations
  • 3 theme styles
  • 6 layout widths
  • PSD banner template

Theme Variations

Layout Widths

  • 500px
  • 600px
  • 700px
  • 800px
  • 900px
  • 1000px

Layout Fonts

  • Arial
  • Georgia
  • Times
  • Trebuchet
  • Lucida

Layout Header Colors

  • Header Background
  • Site Title
  • Site Slogan

Menu One Colors

  • Menu Background
  • Menu Dividers
  • Menu Links
  • Menu Links (Hover)
  • Menu Links (Current)

Menu One Spacing

  • Default
  • +1
  • +2
  • +3

Menu One Upper/Lower Case

  • Uppercase
  • Lowercase

Menu Two Colors

  • Menu Background
  • Menu Links
  • Menu Links (Hover)
  • Menu Links (Current)

Menu Two Spacing

  • Default
  • +1
  • +2
  • +3

Menu Two Visibility

  • Show
  • Hide

Body Colors

  • Body Background
  • Body Text
  • Headers
  • Body Links
  • Body Links (Hover)
  • Blockquote/Code Text
  • Blockquote/Code Background

Sidebar Colors

  • Header Background
  • Header Text
  • Content Background
  • Text
  • Links
  • Links (Hover)
  • Links (Current)
  • Links (Ancestor)

Sidebar Position

  • Right
  • Left
  • None

Footer Colors

  • Background
  • Border
  • Text
  • Links
  • Links (Hover)

Page Banner

  • Banner 1 ... Banner 20
  • None

Logo Alignment

  • Left
  • Center
  • Right

Blog Colors

  • Entry Title
  • Entry Date Text
  • Entry Date Links
  • Entry Date Links (Hover)
  • Entry Tags/Comments Text
  • Entry Tags/Comments Links
  • Entry Tags/Comments Links (Hover)
  • Blog Archive Header

Blog Spacing

  • 18px
  • 24px
  • 36px

Photo Album Colors

  • Album Title
  • Album Captions

Photo Album Spacing

  • Default
  • +1
  • +2
  • +3
  • +4

Photo Slide Colors

  • Background
  • Title
  • Caption
  • Links
  • Links (Hover)

File Sharing Page Colors

  • Links
  • Links (Hover)
  • Descriptions

Movie Album Colors

  • Album Title
  • Album Captions

Movie Album Spacing

  • Default
  • +1
  • +2
  • +3
  • +4

Movie Popup Colors

  • Background
  • Title
  • Captions

Frequently Asked Questions

None available

Documentation

Installation

  1. Download your purchase to your computer. This will be a ZIP file.
  2. Double-click the downloaded ZIP file to expand its contents.
  3. Double-click the .rwtheme or .rwplugin file that was in the ZIP file.
  4. Restart RapidWeaver.

System Requirements

  1. Mac OS X 10.4+
  2. RapidWeaver 3.6+ (4.0+ recommended)
  3. Javascript-enabled web browser

Custom Page Banners

You may use up to 20 page banners with Emporium. Follow these instructions to create and install a custom page banner.

  1. Create an image that is 200px tall and as wide as your layout width (if your layout is 800px wide, your image is 800px wide).
  2. Save your image as a JPEG image, with a “.jpg” extension, into the directory emporium.rwtheme/Contents/images/editable_images/.
  3. Right-click “emporium.rwtheme” and choose “Show Package Contents” to view the contents of the Emporium theme.
  4. Save your image as “banner#.jpg”, where “#” is 1, 2, 3, ... or 20. For example, you might save an image called “banner15.jpg”.
  5. Restart RapidWeaver, and select the appropriate banner image in the Theme Variation panel.

If you wish to use an image that is not 200px tall, you must override the default banner height with the following custom CSS (adjusted to your preferences):

#featureimage { height: 250px; }

Release Notes

Version 3.0 - Released on 20 May, 2009

+ Ensured compatibility with JS-Kit inline comments in RapidWeaver 4.2.2

Version 2.1 - Releaesd on 4 January, 2009

+ Fixed issue where submenu’s height would double in Firefox 3

Sophisticate 3

Sophisticate 3

Screenshots

Here are a few screenshots of Sophisticate. You can also view the live preview.

  • Sophisticate 3 Screenshot 1
  • Sophisticate 3 Screenshot 2
  • Sophisticate 3 Screenshot 3

Features

Sophisticate is an ideal RapidWeaver theme for small and large organizations. Several Sophisticate features are:

  • 34 color pickers
  • 3 theme styles
  • Up to 10 banner images
  • Up to 4 menu levels
  • Left, right, or hidden sidebar
  • Global font size controls

Theme Variations

Colors

  • Background
  • Body Text
  • Headers
  • Links
  • Site Title
  • Site Slogan
  • Breadcrumb Bar Background
  • Breadcrumb Bar Links
  • Upper Sidebar Background
  • Upper Sidebar Links
  • Upper Sidebar Links (Hover)
  • Upper Sidebar Links (Current)
  • Upper Sidebar Links (Ancestor)
  • Lower Sidebar Background
  • Lower Sidebar Title
  • Lower Sidebar Text
  • Lower Sidebar Links
  • Lower Sidebar Links (Hover)
  • Footer Text
  • Footer Links
  • Footer Background
  • Code Element Text
  • Blockquote Element Text
  • Blog Entry Title
  • Blog Entry Date
  • Blog Entry Tags
  • Photo Album Title
  • Photo Individual Page Title
  • Photo Individual Page Background
  • Photo Individual Page Image Border
  • Movie Album Title
  • Movie Album Entry Text
  • Movie Popup Background
  • Movie Popup Text

Font Family

  • Trebuchet
  • Helvetica
  • Georgia
  • Times

Base Font Size

  • 11px
  • 12px
  • 13px
  • 14px

Title and Slogan

  • Show
  • Hide

Sidebar

  • Left
  • Right
  • Hide

Custom Page Banner

  • Banner Image 1 ... Banner Image 10
  • None

Blog Tag Icon Color

  • Blue
  • Green
  • Orange
  • Pink
  • Purple
  • Red
  • Yellow

Frequently Asked Questions

None available

Documentation

Installation

  1. Download your purchase to your computer. This will be a ZIP file.
  2. Double-click the downloaded ZIP file to expand its contents.
  3. Double-click the .rwtheme or .rwplugin file that was in the ZIP file.
  4. Restart RapidWeaver.

System Requirements

  1. Mac OS X 10.4+
  2. RapidWeaver 3.6+ (4.0+ recommended)
  3. Javascript-enabled web browser

Custom Page Banners

You may use up to 10 banners with Sophisticate. Follow these directions to create and install a custom banner image.

  1. Create a banner image that is 840px wide and 200px tall with an image editor.
  2. Save your image as a JPEG image, with a “.jpg” extension, into the directory sophisticate.rwtheme/Contents/images/editable_images/.
  3. Right-click “sophisticate.rwtheme” and choose “Show Package Contents” to view the contents of the Sophisticate theme.
  4. Save your image as “banner_#.jpg”, where “#” is 1, 2, 3, ... or 10. For example, you might save an image called “banner_8.jpg”.
  5. Restart RapidWeaver, and select the appropriate banner image in the Theme Variation panel.

If you wish to use an image that is not 200px tall, you must override the default banner height with the following custom CSS (adjusted to your preferences):

#banner{ height: 100px; }

Sophisticate 3 Upgrade Instructions

Upgrade Option 1: Clean install

  1. Download and double-click the theme update ZIP file to your computer
  2. Double-click the .rwtheme file that was inside of the ZIP file
  3. Re-start RapidWeaver and select “Sophisticate 3” from the Theme library in RapidWeaver

Upgrade Option 2: Replace existing theme

  1. Backup your existing Sophisticate .rwtheme file
  2. Download and double-click the theme update ZIP file to your computer
  3. Double-click the .rwtheme file that was inside of the ZIP file
  4. Locate “~/Library/Application Support/RapidWeaver/sophisticate3.rwtheme”
  5. Right-click on this file and choose “Show Package Contents”
  6. In the resultant Finder, open “/Contents/Theme.plist” in a plain text editor
  7. Scroll to the bottom of the file
  8. Change the “RWThemeName” key’s value to “Sophisticate”
  9. Change the “RWThemeShortName” key’s value to “sophisticate”
  10. Save the file and restart RapidWeaver

Release Notes

Version 3 - Released on June 1, 2009

+ Ensured compatibility with JS-Kit comments in RapidWeaver 4.2.2+

Milano 5

Milano 5

Screenshots

Here are a few screenshots of Milano. You can also view the live preview.

  • Milano 5 Screenshot 1
  • Milano 5 Screenshot 2
  • Milano 5 Screenshot 3

Features

Milano is one of my earlier RapidWeaver themes: simple, stylish, and modern. Some Milano features are:

  • Up to 1 menu level
  • Up to 15 banner images
  • RapidWeaver 4.0 compatible
  • 4 theme styles
  • 6 color pickers
  • 38 theme variations
  • Left, right, or hidden sidebar

Theme Variations

Colors

  • Top Border
  • Links
  • Headers
  • Photo Thumbnail Border (Hover)
  • Site Title
  • Blog Permalinks

Sidebar

  • Hide
  • Left
  • Right

Fonts

  • Trebuchet
  • Times
  • Lucida
  • Helvetica
  • Arial
  • Verdana

Custom Logos

  • Logo 1 ... Logo 15
  • None

Custom Logo Sizes

  • Hidden
  • 800px by 100px
  • 800px by 150px
  • 800px by 180px
  • 800px by 200px
  • 800px by 250px
  • 800px by 300px

Frequently Asked Questions

None available

Documentation

Installation

  1. Download your purchase to your computer. This will be a ZIP file.
  2. Double-click the downloaded ZIP file to expand its contents.
  3. Double-click the .rwtheme or .rwplugin file that was in the ZIP file.
  4. Restart RapidWeaver.

System Requirements

  1. Mac OS X 10.4+
  2. RapidWeaver 3.6+ (4.0+ recommended)

Custom Banner Images

You may use 15 custom banner images with Milano. Follow these directions to create and install a custom banner image.

  1. Create an image that is 800px wide and 180px tall.
  2. Save your image as a JPEG image, with a “.jpg” extension, into the directory milano.rwtheme/Contents/images/editable_images/.
  3. Right-click “milano.rwtheme” and choose “Show Package Contents” to view the contents of the Milano theme.
  4. Save your image as “logo#.jpg”, where “#” is 1, 2, 3, ... or 15. For example, you might save an image called “logo8.jpg”.
  5. Restart RapidWeaver, and select the appropriate banner image and size in the Theme Variations panel.

Milano 5 Upgrade Instructions

Upgrade Option 1: Clean install

  1. Download and double-click the theme update ZIP file to your computer
  2. Double-click the .rwtheme file that was inside of the ZIP file
  3. Re-start RapidWeaver and select “Milano 5” from the Theme library in RapidWeaver

Upgrade Option 2: Replace existing theme

  1. Backup your existing Milano .rwtheme file
  2. Download and double-click the theme update ZIP file to your computer
  3. Double-click the .rwtheme file that was inside of the ZIP file
  4. Locate “~/Library/Application Support/RapidWeaver/milano5.rwtheme”
  5. Right-click on this file and choose “Show Package Contents”
  6. In the resultant Finder, open “/Contents/Theme.plist” in a plain text editor
  7. Scroll to the bottom of the file
  8. Change the “RWThemeName” key’s value to “Milano”
  9. Change the “RWThemeShortName” key’s value to “milano”
  10. Save the file and restart RapidWeaver

Release Notes

Version 5 - Released on June 1, 2009

+ Ensured compatibility with JS-Kit comments in RapidWeaver 4.2.2

Sign up for my newsletter

Packed with news, promotions, tips, and more. You know you want to.