Related Items in ZOO
To start, we need to add a position to our renderer for our related items. Open the full.php
that can be found in the renderer folder: media/zoo/applications/blog/templates/ptp/renderer/item
Add a new position where the related items need to be rendered. A position should look similar to this:
<?php if ($this->checkPosition('related')) : ?> <div class="pos-related"> <?php echo $this->renderPosition('related'); ?> </div> <?php endif; ?>
Next, we need to add this to our xml file - open positions.xml
and copy and paste one of the positions under full
and rename it to match the position you just created. In our case, it is related
- it should look like this:
<position name="related">This is the related item position</position>
Your positions for full should now look something like this:
<positions layout="full"> <position name="top">Top</position> <position name="title">Title</position> <position name="subtitle">Subtitle</position> <position name="meta">Meta</position> <position name="media">Media</position> <position name="content">Content</position> <position name="taxonomy">Taxonomy</position> <position name="bottom">Bottom</position> <position name="related">Related</position> </positions>
Next, we need to create the positions we want for our related layout. This is how the related items will look. As you can see in your positions.xml
, there are positions for all the other layouts you have - full
, teaser
, feed
and submission
. We need another one for related
. I want positions to include title
, media
, content
and links
, so mine will look like this:
<positions layout="related"> <position name="title">Title</position> <position name="media">Media</position> <position name="content">Content</position> <position name="links">Links</position> </positions>
Now that we have defined the positions for the new template, we need to do one more thing before we create the actual template. We need to add this information to our metadata.xml
so that we can add elements to it. Open this file and add the following in between or after any of the other positions:
<layout name="related" type="related"> <name>Related</name> <description>An item is rendered with the submission layout in the related view.</description> </layout>
Now we've set ourselves up to create the template. Create a new php file - or copy and paste one of the existing ones and name it related.php
. Inside this new renderer file, we need to make sure we have the right positions echoing out. If you have different positions in your positions.xml
, make sure they are all relative in the renderer. Eg. If you have a position defined as bottom
in the xml, make sure you have it in the renderer too. This is what your renderer should look like.
<?php /** * @package com_zoo * @author YOOtheme http://www.yootheme.com * @copyright Copyright (C) YOOtheme GmbH * @license http://www.gnu.org/licenses/gpl.html GNU/GPL */ // no direct access defined('_JEXEC') or die('Restricted access'); // init vars $params = $item->getParams('site'); /* set media alignment */ $align = ($this->checkPosition('media')) ? $params->get('template.items_media_alignment') : ''; if(!$align){ $align = ($this->checkPosition('media')) ? $params->get('template.teaseritem_media_alignment') : ''; } require_once(JPATH_THEMES .'/pixeltopaper/html/custom_helpers/ptphelpers.php'); ?> <?php if ($this->checkPosition('title')) : ?> <h3 class="title"><?php echo $this->renderPosition('title'); ?></h3><?php endif; ?> <?php if ($this->checkPosition('content') || $this->checkPosition('media')): ?> <?php if ($align == "left" || $align == "right") : ?> <div class="pos-media align-<?php echo $align;?>"><?php echo $this->renderPosition('media', array('style' => 'block')); ?></div> <?php endif; ?> <div class="pos-content"><?php echo $this->renderPosition('content', array('style' => 'block')); ?></div> <?php endif; ?> <?php if ($this->checkPosition('links')) : ?> <p class="links"><?php echo $this->renderPosition('links'); ?></p> <?php endif; ?>
A complete overview can be seen here.
You may be interested in...
Joomla Development
Joomla Development Development, tools, support...