Avatar anes.porobic asked

Use SRCSET in Widgetkit

Hi,

From documentation it is not clear how I can use srcset to have differently sized versions of the same image for different resolutions.
It would be great if I could use something simmilar to this: <img src="small.jpg" srcset="medium.jpg 1000w, large.jpg 2000w" alt="yah">

I have tried the documentation istruction of addin -2x but it does not seem to work and is too limited for me.

I use widgetkit 2.4.2 and jooma 3.4.1 and PHP 5.3.29

Any advice is appreciated

Anes

  • Widgetkit

3 Answers

0

Avatar paulmcrobb answered

I have been trying to do the same but am struggling also, my sites are being penalised for slow loading timessage because of the images. Did you manage to resolve this?

0

Avatar yoosh answered

hi there,
i hope you are more experienced than me.
as the following will help, maybe you can allow to join your success.
.
i just remembered the stage theme.
there was at ( joomla > module manager: Module Custom HTML ):
position: top-a
title: Home Mobile First
the following code:

<div data-uk-scrollspy="{cls:'uk-animation-slide-top', delay: 200}">
<h1 class="tm-heading-main">Mobile first</h1>
<p class="uk-article-lead tm-margin-bottom-large">We always use the latest web technologies to provide a consistent<br class="uk-hidden-small"> experience from phones and tablets to desktops.</p>
</div>
<img data-uk-scrollspy="{cls:'uk-animation-slide-bottom', delay: 300}"
src="images/yootheme/demo/default/home_mobile_m.png"
srcset="images/yootheme/demo/default/home_mobile_l.png 1960w,
images/yootheme/demo/default/home_mobile_m.png 1140w,
images/yootheme/demo/default/home_mobile_s.png 980w"
sizes="100vw"
alt="Demo">

once, a while ago, i replaced the different sizes (1960w,1140w,980w) with different pictures - and i got the different pictures depending on the resolution.
but as i said ... - this was just with the yootheme given example of stage theme.
maybe you can digger deeper into the stage-demo-install and find a nice way to use it.
i guess a nice documentation of your solution would be appreciated in this community.
.
enjoy the easter weekend.
good luck.

0

Avatar owgu Online answered

remove the starting slash from the image path.... so it reads images/yootheme/myimage.jpg
or if you are using Microsoft make sure you remove the path so that all you see is the directory starting from images\yootheme\myimage.jpg
also make sure that the templates/yootheme/cache is writable

Know someone who can answer? Share a link to this question via email or twitter.