RSEvents! - How can i dynamically modify the default event listing ?

This tutorial will help you understand how you can modify (or create) the newly added event listing designs. These are available in the Components > RSEvents! > Settings > Events: Event Intro Layout area, and are marked with (xhtml) and (table) (as displayed below).

The new designs can be edited in the components/com_rsevents/designs/ folder, and are marked with the intro_ prefix. Table designs also have _table prefix.

Differences between XHTML and Table designs

1. XHTML, is focused on using specific tags, mainly DIVs.
2. Table designs are using TR, TD and TH tags.
3. Folder naming - table designs have "_table" suffix.
4. Table designs can incorporate a heading part. This is controlled separately, via the head.php file that resides in each design folder.

For a better understanding i will show you how you can edit the Blue (table) design. Given the naming specifications above, this would imply that all modifications will be carried out into the components/com_rsevents/designs/intro_blue_table. Here you will find the following:

blue_table.php

This file basically stores the HTML template. This can be adjusted in any way you like. The following placeholders can be used:

Rather often, you will need to use additional words. The great thing about customizing the PHP file, is that you can define your own language tags and load them. Example:

 
<tr>
  <td>{EventIcon}</td>
  <td>{EventStartDate} - {EventEndDate}</td>
  <td><a href="{EventLink}">{EventName}</a></td>
  <td><?php echo JText::_('RSE_MY_CUSTOM_LABEL'); ?> <a href="{LocationLink}">{LocationName}</a></td>
  <td>{CategoryName}</td>
</tr>
 

To get this working you will need to define the RSE_MY_CUSTOM_LABEL in the RSEvents! front-end language file (language/en-GB/en-GB.com_rsevents.ini). Example:

 
RSE_MY_CUSTOM_LABEL="My label here"
 

head.php

This file is used for customizing the header listing - this is basically the top part of the listing. This if often used as a general description, thus event specific palceholders can't be used. Note that you can execute any PHP code here. Just use a echo statement to display the result. Example:

 
<thead>  
  <tr>
    <td colspan="5">
      <?php $user = JFactory::getUser(); ?>
      Hello <strong><?php echo $user->name ?></strong>
    </td>
  </tr>
  <tr>
    <th width="16%"> </th>
    <th width="30%"><span class="rse_eventdate"><?php echo JText::_('RSE_DATE'); ?></span></th>
    <th width="15%"><span class="rse_event"><?php echo JText::_('RSE_EVENTNAME'); ?></span></th>
    <th width="23%"><span class="rse_eventlocation"><?php echo JText::_('RSE_LOCATION_NAME'); ?></span></th>
    <th width="16%"><span class="rse_eventcategory"><?php echo JText::_('RSE_CATEGORY_NAME'); ?></span></th>
  </tr>
</thead>
 

The top part, will simply display the name of the current logged in user.

blue_table.xml

This file is required so that RSEvents! can detect a new design. This has the following (fixed) format:

 
<?xml version="1.0" encoding="utf-8"?>
<document name="Blue" type="table">
</document>
 

The name attribute stores the name that will be displayed in the RSEvents! Settings area. The type attribute allows you to specify if this is a table or a xhtml layout type.

The style.css is used to define design specific classes. You can add any standard CSS definitions into it. The images folder is simply used to store icons and backgrounds that are used by the style.css file.