Hi sirbal,
It seems that you applied your changed css with height: 450px in span.itemImage:
span.itemImage {
display: block;
height: 450px; /*Your height*/
overflow: hidden;
-webkit-transform: translateZ(0);
}
in <blockquote>templates/ja_fubix/css/k2.css</blockquote>
SO, I’ll guide you to change this based on your image height.
1. How to change the default images height in articles view and category view (Ja Fubix template)?
– Single K2 item
Open <blockquote>templatesja_fubixhtmlcom_k2ja_fubixitem.php</blockquote>, then find & replace (line 45th):
<img src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption);templatesja_fubixhtmlcom_k2ja_fubix else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:auto;" />
with
<img src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:450px;" />
– Category view
Open <blockquote>templatesja_fubixcssk2.css</blockquote>, then replace:
span.catItemImage {
display: block;
overflow: hidden;
height: 180px;
}
with
span.catItemImage {
display: block;
overflow: hidden;
height: 450px;
}
Then You need to open <blockquote>templatesja_fubixhtmlcom_k2ja_fubixcategory_item.php</blockquote>, find & replace (line 34th):
<img src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:auto;" />
with
<img src="<?php echo $this->item->image; ?>" alt="<?php if(!empty($this->item->image_caption)) echo K2HelperUtilities::cleanHtml($this->item->image_caption); else echo K2HelperUtilities::cleanHtml($this->item->title); ?>" style="width:<?php echo $this->item->imageWidth; ?>px; height:450;" />
2. My another question – what is the best way to work with images in Fubix?
Because our JA Fubix template integrates the K2 overrides layout in templates/ja_fubix/html/com_k2, you need to use K2 resizing feature to get your website layout like our demo. It’s the most effective method to work with images on JA Fubix.
Regards,
—
Leo
phong nam 10 years, 11 months ago.
