Responsive Slider with "srcset"-Attribute …

[Aeneon]

Hi,

I want to add Support for responsive Images on my Agama Slider, but I don’t understand how can I add the “srcset”-Attribute to “img” in “class-agama-sliders.php”.

// SSL Support
if( is_ssl() ) {
	$slide['1']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_1', false ) ) );
	$slide['2']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_2', false ) ) );
	$slide['3']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_3', false ) ) );
	$slide['4']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_4', false ) ) );
	$slide['5']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_5', false ) ) );
	$slide['6']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_6', false ) ) );
	$slide['7']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_7', false ) ) );
	$slide['8']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_8', false ) ) );
	$slide['9']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_9', false ) ) );
	$slide['10']['img'] = str_replace( 'http://', 'https://', esc_url( get_theme_mod( 'agama_slider_image_10', false ) ) );
} else {
	$slide['1']['img'] = esc_url( get_theme_mod( 'agama_slider_image_1', false ) );
	$slide['2']['img'] = esc_url( get_theme_mod( 'agama_slider_image_2', false ) );
	$slide['3']['img'] = esc_url( get_theme_mod( 'agama_slider_image_3', false ) );
	$slide['4']['img'] = esc_url( get_theme_mod( 'agama_slider_image_4', false ) );
	$slide['5']['img'] = esc_url( get_theme_mod( 'agama_slider_image_5', false ) );
	$slide['6']['img'] = esc_url( get_theme_mod( 'agama_slider_image_6', false ) );
	$slide['7']['img'] = esc_url( get_theme_mod( 'agama_slider_image_7', false ) );
	$slide['8']['img'] = esc_url( get_theme_mod( 'agama_slider_image_8', false ) );
	$slide['9']['img'] = esc_url( get_theme_mod( 'agama_slider_image_9', false ) );
	$slide['10']['img'] = esc_url( get_theme_mod( 'agama_slider_image_10', false ) );
}

My Goal is to use different Sources for Retina- and non-Retina-Screens. I’m also thinking about different Images for Desktop and Mobile, so I think “srcset”-Attribute will be the best Option for this …

Can you help me with this ?

Greetings,
Aeneon

[Jerry]

Hello Aeneon,

You cannot do that with Agama Slider right now.

We will consider adding this feature into Agama Slider.

Regards

[Aeneon]

Hi Jerry,

is there any Chance to add some Code here as temporary Fix ? I think the only Thing I need is to add the “srcset”-Attribute to “img” and then I can work with static Filenames.

Greetings,
Aeneon

[Author]

Posts