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.
[path=index.html]<span class="selected">Home</span>[/path=]
In the case of this conditional, if path (the relative path to the page Apricot's currently building) matches index.html, <span class="selected">Home</span> will appear on the built page. If path isn't 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 index.html.
[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.
You can also check whether an attribute is set with this syntax. Say you'd like to use an alternate stylesheet for backgrounds on some of your pages. You could check that this value is not empty, and it will render the stylesheet in that case:
[altbg!=]<link rel="stylesheet" href="altbg.css">[/altbg!=]
The page's value for the attribute checked in this case doesn't matter; you can set it to true, yes, 1, or any other value. All that matters is that the attribute is set. If it is, the alternate background stylesheet will be loaded.
Taken a bit further, if you wished to define an alternate stylesheet based on the "section" of the site the page is in, you could have the attribute you're checking for inside the conditional as well.
[section!=]<link rel="stylesheet" href="[#root#][#section#].css">[/section!=]
[#root#] is used here so from no matter which directory the page is in, it will link to the correct stylesheet - even when viewed locally, where / would otherwise route to the root of your C drive.
[#] 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.