Welcome, Guest
Username Password: Remember me
Forgot your password? Forgot your username? Create an account
Hot Joomla Forum
Community Forum
Free Joomla Extensions
HOT Joomla Carousel

how to order images by name, using HOT Joomla Ca
(1 viewing) (1) Guest
Discussion about HOT Joomla Carousel free Joomla module.
Reply Topic
New Topic
  • Page:
  • 1

TOPIC: how to order images by name, using HOT Joomla Ca

how to order images by name, using HOT Joomla Ca 1 year, 11 months ago #778

Hi all,

I'm using the HOT Joomla Carousel AJAX Image Rotator and need the images to be rotated in sequence.

So, all images are names 10.jpg, 11.jpg, 12.jpg, 13.jpg, 14.jpg, etc. But, they are displayed in random sequence, and not in order, as can be seen here:

<script type="text/javascript" src="http://als.org.za/modules/mod_hot_joomla_carousel/js/jquery.carousel.js"></script>
<script type="text/javascript">
    jQuery(function(){
        jQuery("div.foo").carousel({
         direction: "horizontal",
         loop: 1,
         dispItems: 1,
         pagination: false,
         paginationPosition: "inside",
         autoSlide: 1,
         autoSlideInterval: 3000,
         delayAutoSlide: false,
         combinedClasses: false,
         effect: "slide",
         slideEasing: "swing",
         animSpeed: "slow",
         equalWidths: "true"
      });
    });
</script>
   
<div class="hotcarousel">
    <div class="foo">
         <ul style="margin:0; padding:0">
   
<li><img src="/images/stories/stasies/19a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/14b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/15b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/17b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/23a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/24a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/17a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/19b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/12b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/14a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/16b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/11b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/11a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/20a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/16a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/21a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/24b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/22b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/13a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/23b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/22a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/12a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/13b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/18a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/18b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/20b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/15a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/21b.jpg" alt="" width="340" height="400" /></li>

   
        </ul>
    </div>
</div>



Does anyone know how to "hack the code" in order to make it load the images as follows:


<li><img src="/images/stories/stasies/11a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/11b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/12a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/12b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/13a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/13b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/14a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/14b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/15a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/15b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/16a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/16b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/17a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/17b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/18a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/18b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/19a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/19b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/20a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/20b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/21a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/21b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/22a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/22b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/23a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/23b.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/24a.jpg" alt="" width="340" height="400" /></li>
<li><img src="/images/stories/stasies/24b.jpg" alt="" width="340" height="400" /></li>
Reply Quote

Re: how to order images by name, using HOT Joomla Ca 1 year, 11 months ago #784

  • milos
  • OFFLINE
  • Support Staff
  • Posts: 2823
It's not random order. It's order per date when files are last modified.
Reply Quote

Re: how to order images by name, using HOT Joomla Ca 1 year, 11 months ago #788

Is it possible to order the images by filename?
Reply Quote

Re: how to order images by name, using HOT Joomla Ca 1 year, 6 months ago #1788

  • fmoulton
  • OFFLINE
  • Fresh Boarder
  • Posts: 2
if you are having issues with ordering and your server. You can add this simple piece of code to make it sort alphabetically or numerically.

Go to modules/mod_hot_joomla/carousel/tmpl and open the file default.php

Around Line 159 you will see the beginning of the for loop
for ($loop = 0; $loop <= $infinite_pics_number; $loop += 1) {

add this line after it

//sort images
sort($infinite_pic);
//end sort

save the file and re-upload it to the server.

Now your images will sort like this:

a-image
b-image

or

1-image
2-image

Happy Coding!!!
Reply Quote

Re: how to order images by name, using HOT Joomla Ca 1 year, 6 months ago #1789

  • milos
  • OFFLINE
  • Support Staff
  • Posts: 2823
Thanks! It's a great contribution!
Reply Quote
Reply Topic
New Topic
  • Page:
  • 1
Hot Joomla Forum
Community Forum
Free Joomla Extensions
HOT Joomla Carousel
Powered by Kunena
Time to create page: 0.07 seconds