"ARI Smart Content - Repeater" plugin shows data from the selected data source according to defined template. The plugin can be enabled/disabled and configured on "Extensions → Plugin Manager" page on Joomla! backend. Common information how to use "ARI Smart Content" applications plugins is here. {repeater} plugin tag is used for the plugin. The following code shows titles and intro text of Joomla! articles in table view (in the sample code data source with ID equals to 7 is Joomla! articles data source):

{repeater source="7"}

       {template}

               {headertemplate}

                       <table class="article-list">

               {/headertemplate}

               {rowtemplate itemCount="2" rowClass="odd;even"}

                       <tr class="{$rowClass}">

                       {celltemplate}

                               <td>

                                       <div><a class="title" href="{$data:readmore_link}">{$data:title}</a>

                                       <div class="description">{$data:introtext}</div>

                               </td>

               {/celltemplate}

                       {emptycelltemplate}

                               <td>&nbsp;</td>

                       {/emptycelltemplate}

                       </tr>

               {/rowtemplate}

               {footertemplate}

                       </table>

               {/footertemplate}

               {emptytemplate}

                       No data available.

               {/emptytemplate}

       {/template}

       {styles}

               TABLE.article-list A.title {font-weight:bold;font-size:1.2em;}

       {/styles}

{/repeater}

The code above produces the following HTML code:

<table class="article-list">

       <tr class="odd">

               <td>

                       <div><a class="title" href="link_to_article1">Title 1</a></div>

                       <div class="description">Description 1<div>

               </td>

               <td>

                       <div><a class="title" href="link_to_article2">Title 2</a></div>

                       <div class="description">Description 2<div>

               </td>

       </tr>

       <tr class="even">

               <td>

                       <div><a class="title" href="link_to_article3">Title 3</a></div>

                       <div class="description">Description 3<div>

               </td>

               <td>

                       <div><a class="title" href="link_to_article4">Title 4</a></div>

                       <div class="description">Description 4<div>

               </td>

       </tr>

       ... end etc. ...

</table>

or the following plugin code can be used to show articles in DIV layout:

{repeater source="7"}

       {template}

               {headertemplate}

                       <div class="article-list">

               {/headertemplate}

               {rowtemplate}

                       {celltemplate}

                               <div class="article-item">

                                       <div><a class="title" href="{$data:readmore_link}">{$data:title}</a>

                                       <div class="description">{$data:introtext}</div>

                               </div>

               {/celltemplate}

               {/rowtemplate}

               {footertemplate}

                       </div>

               {/footertemplate}

               {emptytemplate}

                       No data available.

               {/emptytemplate}

       {/template}

       {styles}

               DIV.article-list A.title {font-weight:bold;font-size:1.2em;}

       {/styles}

{/repeater}

The code above produces the following HTML code:

<div class="article-list">

<div class="article-item">

<div><a class="title" href="link_to_article1">Title 1</a>

<div class="description">Description 1</div>

</div>

<div class="article-item">

<div><a class="title" href="link_to_article2">Title 2</a>

<div class="description">Description 2</div>

</div>

... and etc. ...

</div>

Plugin code syntax

The following attributes can be used for {repeater} tag:

• source is required attribute to select the data source which will be used to retrieve data. If a data source is not selected, the plugin will show nothing.

Possible to use {template} and {styles} tags inside {repeater} tag to define template how to format data and add custom styles.

The following tags can be placed inside {template} tag:

• {headertemplate} HTML code which is defined between {headertemplate} and {/headertemplate} tags will be shown before formatted data.

• {footertemplate} HTML code which is defined between {footertemplate} and {/footertemplate} tags will be shown after formatted data.

• {emptytemplate} text which is defined between {emptytemplate} and {/emptytemplate} tags will be shown if the selected data source doesn't contain data.

• {rowtemplate} tag is used to define row template. It is possible to show specify how many items should be shown per row. The following attributes can be used for {rowtemplate} tag:

• itemCount is used to specify number of items per row. Possible values: 1, 2, 3 and etc.

• rowClass is used to specify CSS class(es) which can be added to row element (for example it is possible to add one CSS classes for odd rows and another classes for odd rows).  These CSS classes will be applied to rows in cyclic order. For example if you want to add row_odd class for each odd rows and row_even class for each even rows, use row_odd;row_even value. Use {$rowClass} variable to add the CSS class(es).

The following tags can be used inside {rowtemplate} tag:

• {celltemplate} is used to format data item. It is possible to show values for current data item from the selected data source using {$data:VAR_NAME} variables. Where VAR_NAME is a name of parameter which you want to show. For example for articles possible to use {$data:title}, {$data:introtext} and etc. variables.

• {emptycelltemplate} code between {emptycelltemplate} and {/emptycelltemplate} tags is used when number of items is less than number of items per row. For each non-existing item will be used the code.

CSS rules which are defined between {styles} and {/styles} tags will be added to the page where plugin code is used.