separate slider for smartphones

Hi, I’m guessing you want two different aspect ratios for the slideshows, not just a scaled down mobile version of the full size slideshow?

Meteor Slides does support multiple slideshows, so you could create two slideshows of different sizes and use CSS to hide the mobile slideshow on desktop. But you will still be loading two slideshows on the page even if one is hidden, so I would recommend being careful with how many slides you include in each so that the over all file size of the page doesn’t slow down the load time.

Here is a tutorial on adding multiple slideshows with different sizes that might come in handy.

Hi Josh

I hope all is well.

May I ask when creating two slideshows as you have mentioned and coding them into a template how do you set the height and width?

I have tried using the metadata as mentioned but I am not sure how it should be coded..

This is what I want to work

<?php if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow( "front-mobile", "height:670 , width:500" ); } ?>

Any help will be greatly appreciated

Kind Regards
Brad

I have also tried this

<?php if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow( "front-mobile", "height: '670'", "width: '500'"  ); } ?>

Kind Regards
Brad

Hi, I now have this working and below is a working example.

I have two slideshow

• one for desktops slides are 1000px wide by 300px high
• one for mobiles slides are 500px wide by 600px high

1) In my Meteor setting I set my slideshow size (before uploading any images) to width: 1000px and height 600px .

2) In my case I was using the php template tag so these are my two code inserts

<?php if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow( "desktop", "height: '300'", "width: '1000'" ); } ?>

<?php if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow( "mobile", "height: '600'", "width: '500'" ); } ?>

This will of course work with the normal shortcode.

Hope this helps someone..
Brad