wiki:snippets/Template/ContentTemplate with image

Content Template

This is a "simple" Content Template which could be used for many content pages.

<corinis>
        <corinis-comment>Titel:</corinis-comment>
        <div class="title">
                <corinis-field name="title" type="text" />
        </div>
        <corinis-repeatable name="main">
                <corinis-comment>Untertitel:</corinis-comment>
                <div class="subtitle">
                        <corinis-field name="subtitle" type="text" />
                </div>
                <corinis-comment>
                        <corinis-field name="imageright" type="checkbox" /> Image right 
                </corinis-comment>
                <corinis-field maxwidth="600" name="image" type="image">
                        <corinis-attribute name="style">
                                <corinis-exist name="text">
                                        <corinis-exist name="imageright">
                                                <corinis-life>float:right;margin-left:15px;</corinis-life>
                                        </corinis-exist>
                                        <corinis-nonexist name="imageright">
                                                <corinis-life>float:left;margin-right:15px;</corinis-life>
                                        </corinis-nonexist>
                                </corinis-exist>
                        </corinis-attribute>
                </corinis-field>
                <div class="maintext">
                        <corinis-field name="text" type="richedit" />
                </div>
                <br />
        </corinis-repeatable>
</corinis>

What happens

  • First there is the title of the page (it is always good to have a pagetitle anyway - e.g. if you implement a site search, you could display the title in the search result list
  • Then there is the repeatable contentblock. A contentblock consits or can consist of a subtitle, an image, a text
  • The subtitle is handled the same way as the title
  • For the possible immage there are 3 possibilities - the editor wants an image left and the text right, the text left and the image right or the image takes the full contentwidth (ok the 4th possibility is that there isn't any image)
  • First we implemented a checkbox where the editor can define that the image should be right of the text (default is left) - this checkbox we put under -comment- because we don't want to see the checkbox in the life system
  • Next we check with corinis-exist if there exits a text (if not the image is meant to take the full contentwidth)
  • If a text exists we check if the checkbox was checked (again with corinis-exist)
  • If so we use the style "float:right" for the image to put it right of the text and we define a margin-left so that the text doesn't touch the picture
  • If not we do it the other way round with "float:right"
  • At the end of the content-block comes the text-field

Possibilities for the editor

  • Each page has a title and 0-n content blocks
  • Each content block could have a subtitle
  • A content block could further consist of
    • only text (only the text field is filled)
    • only an image (only the image is stated)
    • a text an an image where the text is left or right of the image