Syntax Tags found in html template files will be replaced with actual content when the page is published or exported by RapidWeaver. The tags can be placed anywhere within the template html file. A RapidWeaver Syntax Tag looks like this:
For example, the %content% tag for the main content of the page anything in the main window in RapidWeaver will be inserted here.
The %sidebar% refers to the Sidebar area in the Page Inspector, again any text or images entered into the Sidebar in RapidWeaver will be converted to HTML and will replace this tag in the template html file.
The following is a list of supported template tags for RapidWeaver Classic. Most of these tags can be used anywhere inside of RapidWeaver.
%resource("")%
title
content
footer
site_title
email
mailto
site_slogan
toolbar
navigation
top_navigation
sub_navigation
breadcrumb
sidebar
sidebar_title
plugin_sidebar
ogTitle
ogDescription
ogURL
ogImage
header
plugin_header
style_variations
user_styles
user_javascript
user_header
last_published
alignment
footer_alignment
bgimage
base_url
website_address
page_path
banner_path
banner_alternate_text
banner_image
Header Syntax
%header%
This outputs the meta information for each page. It should be placed between the <head> tags in your template file.
%title%
Outputs the title of the current page.
%user_header%
Allows the user to place any custom code into the header of the page.
%style_variations%
Outputs a series of style sheets into the head of the page, as selected by the user via theme styles tab of the Page Inspector.
%user_styles%
Outputs the users custom CSS into the head of the users page.
%user_javascript%
Outputs the users custom javascript code into the head of the users page.
%plugin_header%
Outputs code generated by the selected page type into the header area. Typically it will be javascript and/or css.
Navigation Syntax
%navigation%
Outputs the site navigation as an unordered list. Replaced %toolbar% , which was deprecated in RapidWeaver 6.0.
%top_navigation%
Outputs an unordered list of just the top-level of the page hierarchy.
%sub_navigation%
Outputs an unordered list of the remaining sub-navigation of the hierarchy, and respects the RWAlwaysDisplayFullNavigation key.
Body Syntax
%site_title%
Outputs the site title
%site_slogan%
Outputs the site slogan entered in the Site Setup area.
%logo%
Outputs a user definable site wide image. This is set via the Site Setup area, and RapidWeaver does not pre-flight the images the customer may select for their size. Depending on how you’re using this tag, you may want to apply some sensible maximum size for the image via CSS.
%content%
Outputs the content of the current page.
%sidebar_title%
Outputs the sidebar title as entered in the Page Inspector.
%sidebar%
Outputs the sidebar content as entered in the Page Inspector.
%plugin_sidebar%
Outputs content specific to the current page style. For example, the blog archives.
%breadcrumb%
Generates an unordered list of links from the home page to the current page following the menu hierarchy in the Page List.
%footer%
Outputs the site’s footer as entered in the Site Setup area.
%pathto(file.extension)%
The %pathto()% syntax should be used to refer to any global assets in the theme. This will generate the appropriate relative, absolute or relative to DOCROOT link to the relevant file. Its primary use is to refer to stylesheets and javascript files that are used across the site.
%pathto()% can be used for any file (styles.css for example), however the file must be added to the RWCopyFiles array in the theme.plist file.
%base_url%
Outputs the web address of the website, as entered in the Site Setup area.
%last_published%
Outputs the last published date - this is not currently customisable in its appearance.
%email%
Outputs the user’s e-mail address.
Colourtags
Colourtags allow customers to customise a particular colour value in your theme using the OS X colour picker. The colour values from a colourtag must currently be set via a separate stylesheet (normally called colours.css or colourtags.css) This style sheet must be included in the RWColourTagCSSFiles array in the theme.plist, to indicate to RapidWeaver that the colours should be substituted.
%colour…%
Each tag (i.e. %colour_header_background%) used be replaced by a colour specified in the theme.plist There are no restrictions placed on the number of colour tags you can use, and you may also use the same tag multiple times. As noted above, all colourtags need to be placed in a specific stylesheet, and explicitly referenced in your theme’s PLIST.
Theme Styles: Colour Maths
Colour tags will be replaced by a colour specified in the theme.plist. This should be placed in an external style sheet. The style sheet should be included in the RWColourT- agCSSFiles array in the theme.plist. There is no restriction on how many colour tags you can use. You may also use the same tag multiple times. This tag also supports the Americanized spelling of colour, color.
Colour tags support the following mathematical operators: +, – and *.
- Example 1: %COLOUR1 + #112233%
- Example 2: %COLOUR1 * 0.3%
- Example 3: %COLOUR1 + #112233 * 0.3 + #445566%
- Example 4: %COLOUR1 + R(0.9) G(0.1) B(0.5)%
More information about the %pathto(…)% tag
All RapidWeaver Syntax Tags, with one exception, look exactly the same. The exception is the %pathto(file.extension)% tag. This tag is used for site consolidation, essentially meaning that RapidWeaver will automatically generate links to files located in the theme folder. When exporting a site RapidWeaver places all of the theme files in a folder called rw_common and gener- ates the links to the files in this folder. This should be used when linking to any file in your theme file including stylesheets, javascript files and images. Examples: Linking to the styles.css file in your theme directory.
%pathto(styles.css)%
the published code will look something like this:
../rw_common/themes/theme_name/styles.css
Folders can be included before the image name eg.
%pathto(images/image_name.jpg)%
The published code will look something like this:
../rw_common/themes/theme_name/images/image_name.jpg
More information about Banner Image tag
RapidWeaver 7 and newer supports the use of the new %banner_image% and %banner_path% keys. To enable the use of a banner image in your theme, you must set the RWThemeSupportsBannerImages boolean to YES in your theme’s Info.plist.
The Theme.PLIST file will not be used when determining whether to enable the Banner Image feature. With the PLIST key in your theme, and the %banner_path% key in either your index.html or stylesheets, you’ll get a path to the image that can be used as you wish. If you add %banner_path% either to your theme HTML or CSS, the following will be inserted:
In an HTML file
<img src="%banner_path%" />
becomes
<img src="rw_common/images/banner.png" />
and in a CSS file
#banner {
background-image: url('%banner_path%');
}
becomes
#banner {
background-image: url('../../images/banner.png');
}
If the user does not provide a banner image, you should provide a path to your own using the key RWThemeBannerFallbackImage in Info.plist. This is relative to your other theme files. You can suggest a height and width for the banner which will be displayed in the RW settings screen using the following keys:
RWThemeBannerImageRecommendedWidth
RWThemeBannerImageRecommendedHeight
All banner configuration keys must be within a RWBannerOptions dictionary plist
<key>RWBannerOptions</key>
<dict>
<key>RWThemeBannerFallbackImage</key>
<string>images/banners/banner_1.jpg</string>
<key>RWThemeBannerImageRecommendedWidth</key>
<integer>500</integer>
<key>RWThemeBannerImageRecommendedHeight</key>
<integer>150</integer>
</dict>
You can also use the %banner_image% macro to request an image element:
<img src="%banner_path%" id="rw-banner-image" height="" width=""/>
It’s important to note that height and width attributes will be those of the asset added by the user - not the recommended height-width integers you enter into the Theme‘s Info.plist. The alt attribute can also be placed with the %banner_alternate_text% token.