Hi,

I would like to change the behaviour of an item image when listing items in a category blog view. Instead of a link to the article I would like to open a modal popup when the image thumbnail is clicked.

In my override I replaced the

<a href="<?php echo $this->item->link; ?>" title="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>">

with:

<a class="modal" rel="{handler: 'image'}" href="<?php echo $this->item->imageXLarge; ?>" title="<?php echo JText::_('K2_CLICK_TO_PREVIEW_IMAGE'); ?>">

inside <span class="catItemImage"> in category_item.php, but that only resulted in the image opening in a new web browser tag, not in the nice modal popup that appears when you click a thumbnail in article view.

Obviously I miss something, but what?

Best regards

I checked the page source and found that two scripts are not loading in category view:

<script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
<script src="/media/system/js/modal.js" type="text/javascript"></script>

And there's also a missing window.addEvent.

I suppose these are required for modul popup. Can I add these in my override? Is it possible to change the behaviour from a link to the page into a modal popup of the fullsize photo?

Any help is very much appreciated.

Best regards

Hello Mats,
Try to add this JHTML::_('behavior.mootools'); on top of your category_item.php override.

Many thanks for your reply.

But I get the error message "JHtmlBehavior::mootools not found" when I put the code inside the first PHP statement:

So I must be doing something quite wrong. I am sorry to say that I am far from a PHP programmer...

Any suggestions?

Best regards

I'm sorry about that, it was my mistake. That one was used in older versions of joomla. Try this one

JHTML::_('behavior.modal');

Lovely! It works like a charm!

Thanks!

You are welcome.