Hi all,
I have a script

Code: Select all

<script>
// ----------------------------------------------------  SUPER SIZED SLIDER
$(function($){
   "use strict";
   
   $.supersized({
      slide_interval:5000,// Length between transitions
      transition:1,// 0-None,1-Fade,2-Slide-Top,3-Slide-Right,4-Slide-Bottom,5-Slide-Left,6-Carousel-Right,7-Carousel Left
      transition_speed:800,                                                
      slide_links:'false',//Individual links for each slide (Options: false, 'num', 'name', 'blank')
      slides:[{image:'img/9.jpg'},
            {image:'img/3.jpg'},
            {image:'img/7.jpg',},  
            {image:'img/8.jpg',},
            {image:'img/10.jpg',}]   
   });
});
</script>

Now I want to show repeatable tag here...

Code: Select all

slides:[{image:'img/9.jpg'},
            {image:'img/3.jpg'},
            {image:'img/7.jpg',},  
            {image:'img/8.jpg',},
            {image:'img/10.jpg',}]

Code: Select all

<cms:show_repeatable 'my_multiple_images' >
<img src="<cms:show my_image />" /> 
</cms:show_repeatable>

Is this possible in couch? if please guide me
Thanks

Hello Subhamoy,

What you are asking for is really possible. I have achieved that for many script based Image Sliders. The only thing is that you need to ignore the warning of your text editor and execute the code. With that said I will point out the code to you that you need to use.

Step 1:
You need to create a repeatable region (which I suppose you already have).

Code: Select all

<cms:repeatable name='my_multiple_images' label='Banner Images' >
     <cms:editable name='my_image' label='My Images' type='image' show_preview='1' preview_width='150' />
</cms:repeatable>

Step 2: In your code:

Code: Select all

<script>
$(function($){
   "use strict";
   
         ...

          slides:[<cms:show_repeatable 'my_multiple_images>
               {image:'<cms:show my_image />'},
                    </cms:show_repeatable>
         ]   
   });
});
</script>

Remember not to drop the comma (,) also, as it is a requirement of the script. This comma is used by the script to differentiate the multiple images.

Step 3: Now this is your HTML code, I guess, to display the images.

Code: Select all

<cms:show_repeatable 'my_multiple_images' >
<img src="<cms:show my_image />" /> 
</cms:show_repeatable>

With the above steps followed, you can directly use this code in Step 3, as it is, to achieve your desired result.

If you are using a text editor like Adobe Dreamweaver, You might see an error. Ignore it, save the file and RUN the code.

Step4: Once you have refershed/reloaded the front end, go to the back end and the repeatable region will be available for you to use. Upload your images, Save, navigate to frontend and refresh again... Voila!!! That's the magic of couch...

Hope you find this helpful. If there is any problem, please feel free to post here, again.

Regards,
GenXCoders

Hi genxcoders,

Thank you for your support, it's work fine..

In step 2

Code: Select all

slides:[<cms:show_repeatable 'my_multiple_images>
               ...,
                    .....

Need to close a ' single inverted comma after _images.
'my_multiple_images' to run the script

Thanks again and again,
Subhamoy

Yup the single inverted comma is required. That was a typo from my end...

But good to know that it si working fine and the way that you wanted it to.