Documentation TabLoom
TabLoom Basics
The TabLoom edit view is divided into two panes. The upper pane is your tab list, the lower pain displays individual tab content. Use the + and - symbols between the two pages to add and remove tabs. To add a tab, enter a tab title in the box called "Title". By default, the tab content will be styled text. If you'd prefer to use HTML instead, enable the HTML checkbox. Then click on the + symbol. You'll see a new tab appear in the top pane. Repeat this process to add additional tabs. To add content to a tab, click on the tab title in the top pane, type or paste your content into the lower pane.
Appearance Options
You can modify TabLoom's appearance with several options available in the TabLoom Page Inspector
Page Inspector - General Tab
Transition FX
Enable this checkbox if you'd like tab content to fade in/out when selected/deselected.
Fixed Width
Enabling this option will force all tabs to be the same width and force any longer content to wrap. You can specify the desired tab width with the Tab Width pixel entry.
Collapse ( required )
By enabling this option, you are able to collapse a tabs content by clicking on it.
Mouseover
Enable this option to allow a mouseover on a tab name to display the tab's content. By default, users must click on the tab name to display tab content.
Sortable
Enable this option to allow users to rearrange the order of tabs in-browser via drag and drop.
Tab Panel Width
This number represents the total width (in pixels) of the tab content area with in your RapidWeaver page. Some themes may not accomodate wider widths.
Page Inspector - Theme
ThemeRoller Settings
TabLoom supports themes built with jQuery ThemeRoller ( http://jqueryui.com/themeroller/) It's easy to use ready-made ThemeRoller themes, or create one that matches or complements your RapidWeaver theme. To add ThemeRoller to your tab pag:
1. Click on the Visit ThemeRoller Web Site link in your Page Inspector. This will open the site in your default browser.
2. On the ThemeRoller site, browser the Gallery to see if there's any pre-built themes that meet your needs. You can also select "Roll Your Own" to define every element of your own custom theme.
3. Once you've selected or completed a theme, click the Download button.
4. On the Download page, click "Deselect All Components"
5. Select the 1.7 version of your theme and then click Download.
6. Go to your downloads folder and open the jQuery-ui folder. Open the CSS folder and look for your theme name.
7. Drag the folder with your theme name into the same folder containing your saved RapidWeaver site file.
8. Go back to RapidWeaver. In your page inspector, enable the "Use ThemeRoller Theme" box and click the "Choose" button. You need to choose the folder where your RapidWeaver site is saved - - this is where we moved the ThemeRoller theme to. Make the folder selection and click "Choose Theme Folder"
9. Preview your site, you should see your new ThemeRoller appearance applied.
0 Comments