Developer Guide

Template Cutin Guide

Overview Uploading a Template layouts sub-page template <$headerplugins> $logo1 <$menu> <$pagetitle> <$body> <$section> <$blog> <$sidebarcontrol> <$sidebarmenu> $single <$snippet> <$include> edittext label $viewlink <$cartitems> <$carttotal> <$domain> <$userfullname> <$userid> <isHomePage> <IsNotHomePage> <else> logic options <$copyright> <$trademark> <$date> <$year> File Versioning Social Media Links

<$section>

Macro<$section>
Purpose This macro is used to dynamically create a user editable section in the template using the Content Sections as a data source. Sections can range from a simple from a list of links to a more complete section of HTML
Special NotesThis macro is used in conjunction with the following tags to specify the parts of a section that an HTML tag should be assigned to, and are to be inserted into an HTML tag.Example: <p $title>Hello World</p>$desc-Description$desc2-Description 2$image1-Image 1$image2-Image 2$link1-Link 1$link2-Link 2$link3-Link 3$logo1-Logo 1$logo2-Logo 2$option1-Option 1$option2-Option 2$option3-Option 3$option4-Option 4$rich-Rich Text Field$title-Title[]-Gets substituted for the section record numberBy default, when you edit a content record, the label will default to the type of the field. So the default label for image 1 will be "Image 1". To specify your own label use the label property as follows:<p $title label="Welcome Message" >Hello World</p>
Attributes
  • category - Used to sepecify the category of the section
  • initrows - Used to automatically create X rows of the section of HTML code
  • tagid - Used to specify what ID the yellow edit tag should be attached to

 

Example UsageHTML CODE SEGMENT

BEFORE - ORIGINAL FOOTER CODE
Some simple links

<div id="footer">
     <a href="#">link 1</a> <a href="#">link 2</a> <a href="#">link 3</a> <a href="#">link 4</a>
</div>

AFTER

<div id="footer">
<$section category="Footer Links" initrows="4" tagid="footer">
     <a href="#" $link1 edittext="Y">link []</a>
</$section>
</div>

REPEATER - THE SECTION SHORTCUT

The section tag can also be used as follows. It repeats the contents of the element it is inserted into:

<div id="footer" $repeat category="Footer Links" initrows="4" tagid="footer">
     <a href="#" $link1 edittext="Y">link []</a>
</div>

SPECIAL NOTES

Consider the following HTML snippet:

<a href="flename.jpg"><img src="filename.jpg"></a>

Here, both the URL and the Image TAGs are referencing the same file name. We must use the $image tag as follows:

<a href="flename.jpg"><img src="filename.jpg" $image1></a>

but what about the URL? Here we can also use the $image TAG as follows:

<a href="$image1"><img src="filename.jpg" $image1></a>

What's actually happenig here is that when the compiler sees the $image1 TAG enclosed in double quotes, "$image1" it knows that you're wanting to use the value of the image_1 field, not set the value.

When it sees $image1 alone by itself, it knows you want to set the value of the image1 from the value of the <img tags's SRC parameter.

POUND SIGNS

Any element that is inside any type of section, for example, URL's require a pound sign as follows:

<a href="#">Text</a>

must be doubled as follows, or it will create an error:

<a href="##">Text</a>




A review of the parts of a content section

Cutting in a jQuery Slider

Another example of cutting in a template feature section