[Skip to main content](#vessel-content)

#   Enable carousel in the Category and Product list view

##

- **[pagemaster](/forum/user/50033-pagemaster "View pagemaster's Profile")**
- [![pagemaster's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/50033-pagemaster "View pagemaster's Profile") Topic Author
- [ Offline](/forum/user/50033-pagemaster)

Less More

- Posts: 85
- Thank you received: 9
-
-

6 years 3 months ago -  6 years 1 hour ago [\#322666](#322666) by [pagemaster](/forum/user/50033-pagemaster "View pagemaster's Profile")  *[Enable carousel in the Category and Product list view](/forum/4-how-to/900534-enable-carousel-in-the-category-and-product-list-view#322666 "-- HikaShop version -- : 4.3.0 -- Joomla version -- : 3.9.20 -- PHP version -- : 7.2.26  Hello,  is it possible to enable the carousel view modality for the category and product list view?  Because I saw that there is a carousel file in the Hikashop files and that there is a Module for this, but me I need to enable it in the View Component if is possible.  I need this function because I want to see all the images uploaded of a category or of a product with the carousel effect.  If is not possible I try to add this function with the code  Thank you for your support")* was created by *[pagemaster](/forum/user/50033-pagemaster "View pagemaster's Profile")*

-- HikaShop version -- : 4.3.0
-- Joomla version -- : 3.9.20
-- PHP version -- : 7.2.26

Hello,

is it possible to enable the carousel view modality for the category and product list view?

Because I saw that there is a carousel file in the Hikashop files and that there is a Module for this, but me I need to enable it in the View Component if is possible.

I need this function because I want to see all the images uploaded of a category or of a product with the carousel effect.

If is not possible I try to add this function with the code

Thank you for your support

Last edit: 6 years 1 hour ago by [pagemaster](/forum/user/50033-pagemaster "View pagemaster's Profile").

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzkwMDUzNC1lbmFibGUtY2Fyb3VzZWwtaW4tdGhlLWNhdGVnb3J5LWFuZC1wcm9kdWN0LWxpc3Qtdmlldz90bXBsPW1hcmtkb3du) or [Create an account](/register) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png?1793428657)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86324
- Thank you received: 14286
-
-

6 years 3 months ago [\#322670](#322670) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Enable carousel in the Category and Product list view](/forum/4-how-to/900534-enable-carousel-in-the-category-and-product-list-view#322670 "-- HikaShop version -- : 4.3.0 -- Joomla version -- : 3.9.20 -- PHP version -- : 7.2.26  Hello,  is it possible to enable the carousel view modality for the category and product list view?  Because I saw that there is a carousel file in the Hikashop files and that there is a Module for this, but me I need to enable it in the View Component if is possible.  I need this function because I want to see all the images uploaded of a category or of a product with the carousel effect.  If is not possible I try to add this function with the code  Thank you for your support")*

Hi,

There is no option to do that.
However, it's possible by editing the product / listing_div.php and category / listing_div.php view files via the menu Display&gt;Views and changing a bit the code.
There, you'll find this line: Code:

$enableCarousel = (int)$this-&gt;params-&gt;get('enable_carousel', 0) &amp;&amp; $this-&gt;module;

This will activate the carousel if the "enable carousel" option of the menu item / module is activated and the listing is displayed by a module.
If you change it to : Code:

$enableCarousel = true;

it will activate the carousel for all the listings.
But then, you need to set the different parameters manually.
For example, you'll need such line: Code:

$this-&gt;params-&gt;set('item_by_slide', XX)

where XX is the number of items per slide of the carousel. So if the listing is set to display 20 items per page of the pagination, then you want that XX number to be smaller than 20. For example 4, so that it displays 4 items per slide of the carousel.
You can check the different parameters necessary in product / carousel.php

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzkwMDUzNC1lbmFibGUtY2Fyb3VzZWwtaW4tdGhlLWNhdGVnb3J5LWFuZC1wcm9kdWN0LWxpc3Qtdmlldz90bXBsPW1hcmtkb3du) or [Create an account](/register) to join the conversation.

- **[pagemaster](/forum/user/50033-pagemaster "View pagemaster's Profile")**
- [![pagemaster's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/50033-pagemaster "View pagemaster's Profile") Topic Author
- [ Offline](/forum/user/50033-pagemaster)

Less More

- Posts: 85
- Thank you received: 9
-
-

6 years 1 hour ago -  6 years 1 hour ago [\#325471](#325471) by [pagemaster](/forum/user/50033-pagemaster "View pagemaster's Profile")  Replied by *[pagemaster](/forum/user/50033-pagemaster "View pagemaster's Profile")* on topic *[Enable carousel in the Category and Product list view](/forum/4-how-to/900534-enable-carousel-in-the-category-and-product-list-view#325471 "-- HikaShop version -- : 4.3.0 -- Joomla version -- : 3.9.20 -- PHP version -- : 7.2.26  Hello,  is it possible to enable the carousel view modality for the category and product list view?  Because I saw that there is a carousel file in the Hikashop files and that there is a Module for this, but me I need to enable it in the View Component if is possible.  I need this function because I want to see all the images uploaded of a category or of a product with the carousel effect.  If is not possible I try to add this function with the code  Thank you for your support")*

This is the final custom code of the view (it works until 3 images) **HikaShop - product / listing\_img\_title.php**:
Code:

&lt;?php // Get a db connection. $db = JFactory::getDbo(); // Create a new query object. $query = $db-&gt;getQuery(true); $query-&gt;select('file_path'); $query-&gt;from($db-&gt;quoteName('tbuonapp_hikashop_file')); $query-&gt;where('file_ref_id = ' . '"' . $this-&gt;row-&gt;category_id . '"'); // Reset the query using our newly populated query object. $db-&gt;setQuery($query); $foto_1 = $db-&gt;loadResult(); // Get a db connection. $db = JFactory::getDbo(); // Create a new query object. $query = $db-&gt;getQuery(true); $query-&gt;select('foto_2'); $query-&gt;from($db-&gt;quoteName('tbuonapp_hikashop_category')); $query-&gt;where('category_id = ' . '"' . $this-&gt;row-&gt;category_id . '"'); // Reset the query using our newly populated query object. $db-&gt;setQuery($query); $foto_2 = $db-&gt;loadResult(); // Get a db connection. $db = JFactory::getDbo(); // Create a new query object. $query = $db-&gt;getQuery(true); $query-&gt;select('foto_3'); $query-&gt;from($db-&gt;quoteName('tbuonapp_hikashop_category')); $query-&gt;where('category_id = ' . '"' . $this-&gt;row-&gt;category_id . '"'); // Reset the query using our newly populated query object. $db-&gt;setQuery($query); $foto_3 = $db-&gt;loadResult(); $categoryImages[$this-&gt;row-&gt;category_id] .= $foto_1 . ","; if($foto_2){ $categoryImages[$this-&gt;row-&gt;category_id] .= $foto_2 . ","; } if($foto_3){ $categoryImages[$this-&gt;row-&gt;category_id] .= $foto_3; } ?&gt; &lt;div class="hikashop_category_image"&gt; &lt;a href="&lt;?php echo $this-&gt;row-&gt;link;?&gt;" title="&lt;?php echo $this-&gt;escape($this-&gt;row-&gt;category_name); ?&gt;"&gt; &lt;?php $image_options = array('default' =&gt; true,'forcesize'=&gt;$this-&gt;config-&gt;get('image_force_size',true),'scale'=&gt;$this-&gt;config-&gt;get('image_scale_mode','inside')); $img = $this-&gt;image-&gt;getThumbnail(@$this-&gt;row-&gt;file_path, array('width' =&gt; $this-&gt;image-&gt;main_thumbnail_x, 'height' =&gt; $this-&gt;image-&gt;main_thumbnail_y), $image_options); if($img-&gt;success) { $html = '&lt;img class="hikashop_product_listing_image" id="pics_' . $this-&gt;row-&gt;category_id . '" title="'.$this-&gt;escape(@$this-&gt;row-&gt;file_description).'" alt="'.$this-&gt;escape(@$this-&gt;row-&gt;file_name).'" src="'.$img-&gt;url.'"/&gt;'; if($this-&gt;config-&gt;get('add_webp_images', 1) &amp;&amp; function_exists('imagewebp') &amp;&amp; !empty($img-&gt;webpurl)) { $html = ' &lt;picture&gt; &lt;source srcset="'.$img-&gt;webpurl.'" type="image/webp"&gt; &lt;source srcset="'.$img-&gt;url.'" type="image/'.$img-&gt;ext.'"&gt; '.$html.' &lt;/picture&gt; '; } echo $html; } ?&gt; &lt;/a&gt; &lt;?php if($foto_2 OR $foto_3){ ?&gt; &lt;img src="/images/back.png" id="backbtn&lt;?php echo $this-&gt;row-&gt;category_id ?&gt;" class="btnBack" onclick="prevImage('&lt;?php echo $this-&gt;row-&gt;category_id ?&gt;', '&lt;?php echo $categoryImages[$this-&gt;row-&gt;category_id] ?&gt;')" width="30px" /&gt;&lt;img src="/images/next.png" class="btnNext" id="nextbtn&lt;?php echo $this-&gt;row-&gt;category_id ?&gt;" onclick="nextImage( '&lt;?php echo $this-&gt;row-&gt;category_id ?&gt;', '&lt;?php echo $categoryImages[$this-&gt;row-&gt;category_id] ?&gt;')" width="30px" /&gt; &lt;?php } ?&gt; &lt;/div&gt; &lt;script&gt; var index = 0; function nextImage(category_id_image, category_images) { var arrayImages = category_images.split(","); if(index &lt; arrayImages.length - 1){ index += 1; console.log(arrayImages[index]); document.getElementById('pics_' + category_id_image).src = "/media/com_hikashop/upload/safe/" + arrayImages[index]; if(index == arrayImages.length - 1){ document.getElementById("nextbtn" + category_id_image).style.display = "none"; document.getElementById("backbtn" + category_id_image).style.display = "block"; }else{ document.getElementById("nextbtn" + category_id_image).style.display = "block"; document.getElementById("backbtn" + category_id_image).style.display = "block"; } } } function prevImage(category_id_image, category_images) { var arrayImages = category_images.split(","); if(index &gt; 0){ index -= 1; if(index == 0){ document.getElementById('pics_' + category_id_image).src = "/images/com_hikashop/upload/thumbnails/174x310fsO/" + arrayImages[index]; }else{ document.getElementById('pics_' + category_id_image).src = "/media/com_hikashop/upload/safe/" + arrayImages[index]; } if(index == 0){ document.getElementById("backbtn" + category_id_image).style.display = "none"; document.getElementById("nextbtn" + category_id_image).style.display = "block"; }else{ document.getElementById("backbtn" + category_id_image).style.display = "block"; document.getElementById("nextbtn" + category_id_image).style.display = "block"; } } } &lt;/script&gt;

Last edit: 6 years 1 hour ago by [pagemaster](/forum/user/50033-pagemaster "View pagemaster's Profile").

The following user(s) said Thank You: [nicolas](/forum/user/63-nicolas "View nicolas's Profile")

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzkwMDUzNC1lbmFibGUtY2Fyb3VzZWwtaW4tdGhlLWNhdGVnb3J5LWFuZC1wcm9kdWN0LWxpc3Qtdmlldz90bXBsPW1hcmtkb3du) or [Create an account](/register) to join the conversation.

Board Categories HikaShop Install &amp; Update Product &amp; Category Display Content Creation Sales and Orders Orders management Reports &amp; Statistics Customers Checkout Payment Methods Shipping Methods Import &amp; Export (CSV, XLS…) Specific Features Affilation Taxes Wishlist Vote Carousel &amp; Slider Mass Actions Filters &amp; Search Discount &amp; Coupon Feature Request Integrations Showcase General Talk about HikaShop Development HikaShop 3.0 Beta Translation Commercial Jobs HikaShop Components HikaMarket Market: Feature requests Market: How to? Market: Bug Report HikaSerial General talk about HikaSerial Serial: Bug Report Serial: How to? Support en Français de HikaSerial (French Support) HikaSubscription HikaAuction Auction: Feature requests Auction: How to? Auction: Bug report Hikashop around the world Support en Français (French Support) Russian FAQ. Курс выживания с Hikashop. Частые вопросы и о Расширения Hikashop Наши сайты на Hikashop 日本語版サポート(Japanese Support) Thai German Archives Bug Report How to?

[](/forum/topics/feed/mode-topics?format=feed&type=rss)

Time to create page: 0.105 seconds

[Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org)
