Categories

Featured templates

Joomla 3.x. How to change a default gallery layout

Lana Greene October 16, 2014
No votes yet.
Please wait...

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:

  1. Open templates\themeXXXX\html\com_content\category\gallery.php file.

  2. 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>

    Joomla_3.x.How_to_change_default_gallery_layout_1

  3. 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>

    Joomla_3.x.How_to_change_default_gallery_layout_2

  4. In script initialization, on line 222 change:

    layoutMode: 'grid' to  layoutMode: 'list' 

    Joomla_3.x.How_to_change_default_gallery_layout_3

  5. 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; ?>">

    Joomla_3.x.How_to_change_default_gallery_layout_4

Now default gallery layout is changed.

Joomla_3.x.How_to_change_default_gallery_layout_5

Feel free to check the detailed video tutorial below:

Joomla 3.x. How to change default gallery layout

Joomla Website Themes
This entry was posted in Joomla! Tutorials and tagged gallery, joomla, layout. Bookmark the permalink.

Submit a ticket

If you are still unable to find a sufficient tutorial regarding your issue please use the following link to submit a request to our technical support team. We'll provide you with our help and assistance within next 24 hours: Submit a ticket