Move h2 title under its image

For any k2 category I would the h2 title under its image.
If you have a look at www. solo-single .com/hotel
you will note that the titles are over their image.
Can you move the h2 title down under any image? (I would resize it to font-size: 16px)
Override.css is enabled on my website

Hi

Please edit file /html/com_k2/templates/default/category_item.php there You will find a code for image and header, simply swap their places.

To resize header font please add this to override.css:

Code: Select all

#k2Container .itemsContainerWrap article header h2 {
    font-size: 16px;
    line-height: 20px;
}


Thank you, the resize has worked.
I would avoid to edit php files because then everytime I upgrade the template/modules I will have to edit such files again.
No chance to move down the title by css?

Hi

You may try replicate K2 template, give it a new name and than link this categories to this new k2 template. Here is an instruction how to do that: https://getk2.org/documentation/tutoria ... -templates

Here https://demo.gavick.com/joomla25/univer ... ems-3-cols
you realized what I am looking for (pics up and title down).
Can you tell me how to do that for my categories?

Hi

Looks like You've figured it out already Am I correct or misunderstood You again ?

Misunderstood
https://demo.gavick.com/joomla25/univer ... ems-3-cols
displays 3 categories. I only have one category to display and when I use that solution I have 3 columns: the first column with the items of my category and on the right 2 blank empty columns.

Hi

Ok. I'm still not sure, but please try add this code to override.css:

Code: Select all

.latestView .itemsContainer {
width: 100% !important;
}


It does not work

Hi

Sorry, I've checked on wrong site. In Your case You need this code:

Code: Select all

.itemListView .itemContainer {
width: 100% !important;
}


The title goes up the image as I wish, but there is only one column. Here is the result:

title1
image

title2
image

title3
image


I have 3 columns for any row and I would keep 3 columns. Is that possible?

Hi

I'm afraid I'm lost here. My code is forcing to use one column. I thought it's what You are asking for. Please remind me the url to the exact page You need it. I think I keep working on wrong site.

www. solo-single .com/viaggi

Hi

Please edit file /html/com_k2/templates/default/category_item.php cut the code:

Code: Select all

                  <?php if($this->item->params->get('catItemTitle')): ?>
                  <h2>
                        <?php if ($this->item->params->get('catItemTitleLinked')): ?>
                        <a href="<?php echo $this->item->link; ?>"><?php echo $this->item->title; ?></a>
                        <?php else: ?>
                        <?php echo $this->item->title; ?>
                        <?php endif; ?>
                        <?php if($this->item->params->get('catItemFeaturedNotice') && $this->item->featured): ?>
                        <sup><?php echo JText::_('K2_FEATURED'); ?></sup>
                        <?php endif; ?>
                  </h2>
                  <?php endif; ?>


and paste it under:

Code: Select all

            <?php if($this->item->params->get('catItemImage') && !empty($this->item->image)): ?>
            <div class="itemImageBlock"> <a class="itemImage" 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); ?>"> <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;" /> </a> </div>
            <?php endif; ?>


I would avoid to edit php files because then everytime I upgrade the template/modules I will have to edit such files again.
No chance to move down the title by css?

Hi

No way to make it with css, sorry. You can make k2 subtemplate and move just this one file there. This way files will not be overwritten during update.

Can you change settings for the next update of the template with title under the image?
Look how horrible is my page:
www. solo - single. com/informazioni/
(the page will be well ordered and nice with the title under the image)

Hi

I'm sorry, but I have no control over that. This is how designers made it and noone else reported this as a problem, so we cannot change it for everyone.

Please do as I suggested to duplicate the K2 subtmplate, so changes will be save from being overwritten.