AutoSite's most advanced functionality comes in the form of conditionals—small bits of scripting used to check an attribute's value. If the value matches the one set in the conditional, AutoSite renders out the markup inside the conditional; otherwise, it won't appear on the built page.
Conditionals are used to make elements and text appear only on certain pages without the need to fall on using an additional template.
[#] Format of a Conditional
For clarity, let's again give an example of a conditional in use. Say we have a navbar with three items, and we want to grey out the current page in the navbar, but still link to the other two.
<nav> <a href="index.html">Home</a> <a href="about.html">About</a> <a href="contact.html">Contact</a> </nav>
Conditionals are written on a single line in HTML-like tags, with text or markup in between their start and end tags. The opening tag of the conditional specifies the attribute, the condition, either equals (
=) or not equals (
!=), and the value to check. The closing tag reiterates the attribute and the condition.
In the case of this conditional, if
path (the relative path to the page Apricot's currently building) matches
<span class="selected">Home</span> will appear on the built page. If
index.html, the line won't appear.
In this example, we'd need two conditionals for each link in the navbar: one to appear when we're on each page, and one to appear when we're on another page. For the latter's condition, we'll use
!=, or not equals, as it only appears when Apricot's building a page that isn't
[path=index.html]<span class="selected">Home</span>[/path=] [path!=index.html]<a href="index.html">Home</a>[/path!=]
Only one of these will appear on each page, depending on if the condition is met or not.
For another, quicker example, say you'd like to set an attribute (
altbg, perhaps) to use alternate backgrounds on some of your pages. As you're simply checking a "yes" or "no" value, you can omit the value in the opening tag of the conditional. If the attribute is set at all, the conditional will match:
[altbg=]<link rel="stylesheet" href="altbg.css">[/altbg=]
The value of the attribute in this case doesn't matter; you can set it to
1, or any other value. All that matters is that the attribute is set. If it is, the alternate background stylesheet will be loaded.
[#] The Insert Conditional Dialog
If remembering the format of a conditional proves difficult, AutoSite's GUI provides a more user-friendly way of making use of them: the Insert Conditional dialog. You can invoke this either from the Edit menu, the context menu of the Code Editor, or the Quick Insert menu.
From here, you'd simply set which attribute to check as normal, the condition (using the "NOT" checkbox), the value to compare against (check "Empty" if the value doesn't matter), and then the output of the conditional if the value matches. The conditional will be inserted into the text at the cursor position.
[#] Limitations of Conditionals
Despite their uses, conditionals are not without their caveats:
- Conditionals cannot be multi-line.
- Conditionals cannot be nested. This and the above are due to limitations with regular expressions.
- Conditionals will leave giant, blank spots in your page markup from where newlines are made, but no text fills them. Obviously, this won't affect the look of the rendered page. Run HTML Tidy on your markup after build if this bothers you.
Nevertheless, conditionals are incredibly powerful and can help give your AutoSite an extra bit of dynamicity. This manual used conditionals extensively for the sidebar navigation.