- Web templates
- E-commerce Templates
- CMS & Blog Templates
- Facebook Templates
- Website Builders
Joomla 3.x. How to change a default gallery layout
October 16, 2014
Hello, this tutorial shows how to change default gallery layout in Joomla templates..
Joomla 3.x. How to change default gallery layout
In some cases you may need to change default gallery layout on your website. In order to do this, you should follow these steps:
-
Open templates\themeXXXX\html\com_content\category\gallery.php file.
-
In “gallery.php” file you should find the following code:
<ul id="grid-list" class="btn-group"> <li><a class="btn btn-info toGrid active"><i class="fa fa-th-large"></i></a></li> <li><a class="btn btn-info toList"><i class="fa fa-bars"></i></a></li> </ul>
-
Swap <li> items around, move class active to the list item to get the following code:
<ul id="grid-list" class="btn-group"> <li><a class="btn btn-info toList active"><i class="fa fa-bars"></i></a></li> <li><a class="btn btn-info toGrid "><i class="fa fa-th-large"></i></a></li> </ul>
-
In script initialization, on line 222 change:
layoutMode: 'grid' to layoutMode: 'list'
-
On line 162 change:
<li class="gallery-item mix mix_all gallery-grid <?php echo $item_hover_style; ?> <?php echo special_chars_replace(mb_strtolower(str_replace(" ","",$item->category_title))); ?>" data-date="<?php echo JHtml::_('date', $this->item->publish_up, 'YmdHis'); ?>" data-name="<?php echo $this->item->title; ?>" data-popularity="<?php echo $this->item->hits; ?>">
to
<li class="gallery-item mix mix_all gallery-list <?php echo $item_hover_style; ?> <?php echo special_chars_replace(mb_strtolower(str_replace(" ","",$item->category_title))); ?>" data-date="<?php echo JHtml::_('date', $this->item->publish_up, 'YmdHis'); ?>" data-name="<?php echo $this->item->title; ?>" data-popularity="<?php echo $this->item->hits; ?>">
Now default gallery layout is changed.
Feel free to check the detailed video tutorial below: