Use conditional content in common scenarios

Here are a few of the frequently asked questions and answers to them about using Output Tags.

How do I make elements that I can focus on by simply clicking inside, conditional?

Suppose you have simple content (no multiple paragraphs/images/other elements) inside a list item, table data, table header, and other elements. In that case, you can put a cursor inside such an element and press Make Including/Excluding.

How do I make elements that I can't focus on by clicking inside, conditional?

Click the corresponding tag in the Tag Inspector to select the desired element, such as ordered/unordered list, table row, table, etc., and then press Make Including/Excluding.

How do I make an image or a video conditional?

Click to select it and then click Make Including/Excluding.

How do I make several block elements conditional?

If they are <p> paragraphs, it's better to use the Insert Including/Excluding option. If it's something a list item <li> or a table row <tr>, you can either select them all and click Make Including/Excluding or focus them one by one and click Make Including/Excluding each time.

How do I make a single word conditional?

Go to the Source mode and use the <span> inline tag with the desired Output Tag specified. Like this:

<p>
  Black hole evaporation has <span ch:include="test1">several</span> significant consequences:
</p>

It is also possible to achieve the same result without going to Source each time you need to apply an Output Tag to a single word:

1. Add an empty .conditional CSS class to your project's style file — you need to do it just once.
2. Apply this class to a needed word.
3. Focus on this word by clicking on the <span> tag in the Tag Inspector.
4. Click Make Including/Excluding.