How to click on image in bloglayout menu to open the article

Hi,

I use bog-layout menu to display article and insert an image into "intro image" as below:

blog layout copy.jpg

Can you help me to revise the code so that a user can click on the intro image to open the article:

blog layout.jpg

Thank you,

Hai

Hi

Edit file /html/com_content/category/blog_item.php and replace code:

Code: Select all

      <?php  if (isset($images->image_intro) and !empty($images->image_intro)) : ?>
      <div class="img-intro-<?php echo $images->float_intro ? $images->float_intro : $params->get('float_intro'); ?>">
         <img
            <?php if ($images->image_intro_caption):
               echo 'class="caption"'.' title="' .$images->image_intro_caption .'"';
            endif; ?>
            <?php if (!empty($images->image_intro)):?>
               style="float:<?php echo  $params->get('float_intro') ?>"
            <?php else: ?>
               style="float:<?php echo  $images->float_intro ?>"
            <?php endif; ?>
            src="<?php echo $images->image_intro; ?>" alt="<?php echo $images->image_intro_alt; ?>"/>
      </div>
      <?php endif; ?>


with

Code: Select all

      <?php  if (isset($images->image_intro) and !empty($images->image_intro)) : ?>
      <div class="img-intro-<?php echo $images->float_intro ? $images->float_intro : $params->get('float_intro'); ?>">
         <a href="<?php echo JRoute::_(ContentHelperRoute::getArticleRoute($this->item->slug, $this->item->catid)); ?>">
         <img
            <?php if ($images->image_intro_caption):
               echo 'class="caption"'.' title="' .$images->image_intro_caption .'"';
            endif; ?>
            <?php if (!empty($images->image_intro)):?>
               style="float:<?php echo  $params->get('float_intro') ?>"
            <?php else: ?>
               style="float:<?php echo  $images->float_intro ?>"
            <?php endif; ?>
            src="<?php echo $images->image_intro; ?>" alt="<?php echo $images->image_intro_alt; ?>"/>
         </a>
      </div>
      <?php endif; ?>


Hi Teitbite,

I changed the file but it does not work.

Before I make a change, the blog layout looks like below:

Untitled-1.jpg

After I change the file, the layout is as follows:

Untitled-2221.jpg

The intro-text move to the right of the image and there's no link in the intro image. I will send you a message with admin and FTP account.

Please review and help me.

Thank you,

Hai

Hi

it worked, but images were configured to be displayed on left. I have added this to css to force it occupy full space:

Code: Select all

.img-intro-left img {
  float: none !important;
}


Thank you Teitbite.

Hi
Glad I could help.
---
If You were satisfied with our support please let other users know on Twitter: http://twitter.com/gavickpro or Facebook: http://www.facebook.com/gavickpro