Flex

Overview

My Flex RapidWeaver theme provides a wide array of features and theme variations. Here's a brief taste of what Flex has to offer.

• HTML5-ready
• Includes four (4) ExtraContent containers
• Includes the jQuery Javascript framework from Google's CDN
• 2 horizontal menus with up to 6 drop-down and fly-out submenus
• Up to 20 custom background and banner images
• 6 built-in Theme Styles to help you start customizing your website

• Built-in RapidSearch form for site-wide Google search out-of-the-box
• Built-in PrettyPhoto Lightbox plugin for image and media galleries
• Built-in Modernizr Javascript library
• Color pickers and variations for almost every layout element
• The sidebar can be placed on the left or right side of your website

Purchase the Flex & RapidSearch Bundle for $27.45 USD

Purchase Flex with RapidSearch and save 50% off the price of RapidSearch

RapidWeaver Plugin Compatibility

My Flex RapidWeaver theme is compatible with many of the most popular 3rd party RapidWeaver plugins, including but not limited to:

System Requirements

• RapidWeaver 3.6+ (4.0+ recommended)
• Javascript-enabled web browser

By purchasing this product you agree to its license agreement.

Screenshots

Live Preview

View a real, live website that uses the Flex RapidWeaver theme.
Launch Preview Website

Theme Variations

Frequently Asked Questions

Does Flex support HTML5 elements?

Yes, Flex supports HTML5 elements.

Does Flex support ExtraContent?

Yes, Flex provides four ExtraContent containers. Please read the online documentation for more information.

Why do PNG images not work in Internet Explorer 6?

I no longer support PNG image transparency in IE6.

Why do rounded corners not work in Internet Explorer?

Internet Explorer 6/7/8 does not support the border-radius CSS property.

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/RapidSearch bundle at a discounted rate.

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

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

User Guide

ExtraContent

Flex  provides four ExtraContent containers. They are:

1. Above the page content
2. Below the page content
3. Below the page sidebar
4. In the footer, above the footer content

How to use a custom header background image

You may use up to 20 background images. Slots 1…10 accept JPG images and slots 11…20 accept PNG images; JPG images must have a .jpg extension and use slots 1…10; PNG images must have a .png extension and use slot 11…20.

1. Create or find an image you want to use as your body background.
2. In RapidWeaver, open your website file and view the Themes panel (View → Show Themes).
3. Right-click on the Flex theme and select Reveal Theme 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…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 Header - Background Image options in the Theme Variations panel.
7. You may also select Header - Background Position and Header - Background Repeat options in the Theme Variations panel.

How to use a custom page banner image

You may use up to twenty (20) banner images. Slots 1…10 accept JPG images and slots 11…20 accept PNG images; JPG images must have a .jpg extension and use slots 1…10; PNG images must have a .png extension and use slot 11…20.

1. Create or find an image you want to use as your page banner.
2. The banner image must be 200px tall and as wide as the selected Layout - Width.
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 options in the Theme Variations panel.

How to use the built-in RapidSearch form

You need my RapidSearch plugin for RapidWeaver to use the built-in search form.

1. Create a new RapidSearch page at the top level of your website's page hierarchy.
2. View the Page Inspector → General tab for the RapidSearch page.
3. Set the Filename to "index.html".
4. Set the Folder to "search".
5. For each page in your website that should display the RapidSearch form, view the
   Page Inspector → Styles tab and set Search Form - Visibility to "Show".