- Posts: 13684
- Thank you received: 2497
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Using pictures in ranking question
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
13 years 2 months ago - 13 years 2 months ago #57559
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic Using pictures in ranking question
tpartner : what do you think to replace actual ranking javascript by jquery-ui sortable .
If you'r OK, i put this in bug tracker/ feature request
If you'r OK, i put this in bug tracker/ feature request
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Last edit: 13 years 2 months ago by DenisChenu.
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10116
- Thank you received: 3597
13 years 2 months ago #57561
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Using pictures in ranking question
Well, I think it's a better interface but don't you think there may be too many people using the old format that may be messed up when updating?what do you think to replace actual ranking javascript by jquery-ui sortable
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
- paulfiner
- Offline
- Premium Member
Less
More
- Posts: 117
- Thank you received: 9
13 years 2 months ago - 13 years 2 months ago #57579
by paulfiner
Replied by paulfiner on topic Using pictures in ranking question
Hi Tony
Your picture example looks great and is exactly what I needed. However, when setting up the workaround I'm not getting the new drag and drop question.
I thought I'd try and get it working without pictures first but I just have the original ranking question showing.
The first javascript file has been copied to template.js and I have added the second smaller file to the actual ranking question.
Here's a link to my survey: finersurveys.limequery.com/19197/lang-en
Your picture example looks great and is exactly what I needed. However, when setting up the workaround I'm not getting the new drag and drop question.
I thought I'd try and get it working without pictures first but I just have the original ranking question showing.
The first javascript file has been copied to template.js and I have added the second smaller file to the actual ranking question.
Here's a link to my survey: finersurveys.limequery.com/19197/lang-en
Last edit: 13 years 2 months ago by paulfiner.
The topic has been locked.
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 13684
- Thank you received: 2497
13 years 2 months ago #57588
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic Using pictures in ranking question
paulfiner I don't see the template.js link in the source of your template.
The link have to be set in starpage.pstpl, you can found it in default template.
To tpartner you're right , but we already made some modification woth some problems with old template .
The link have to be set in starpage.pstpl, you can found it in default template.
To tpartner you're right , but we already made some modification woth some problems with old template .
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10116
- Thank you received: 3597
13 years 2 months ago - 13 years 2 months ago #57634
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Using pictures in ranking question
Did you figure this out Paul?
As Shnoulle says, you need to add the following just before the </head> tag in startpage.pstpl:
As Shnoulle says, you need to add the following just before the </head> tag in startpage.pstpl:
Code:
<script type="text/javascript" src="{TEMPLATEURL}template.js"></script>
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 13 years 2 months ago by tpartner.
The topic has been locked.
- paulfiner
- Offline
- Premium Member
Less
More
- Posts: 117
- Thank you received: 9
13 years 2 months ago #57716
by paulfiner
Replied by paulfiner on topic Using pictures in ranking question
Hi Tony
I finally got some time to try your workaround and managed to get the first part sorted.
However, the images part doesn't seem to work and the 3 images I have tried just appear in the question text.
My example survey is still live so you can see what I mean.
I finally got some time to try your workaround and managed to get the first part sorted.
However, the images part doesn't seem to work and the 3 images I have tried just appear in the question text.
My example survey is still live so you can see what I mean.
The topic has been locked.
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 13684
- Thank you received: 2497
13 years 2 months ago #57723
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic Using pictures in ranking question
Hello Paul,
For me it work ?
There are some disgracious but it's need some modification in template.css
Somethink like that
For me it work ?
There are some disgracious but it's need some modification in template.css
Code:
#question2505 .dragDropTable li { background: none repeat scroll 0 50% transparent; border: 0 none; height: 80px; width: 80px; } #question2505 .dragDropTable .dragDropChoiceList, #question2505 .dragDropTable .dragDropRankList { min-height: 80px; min-width: 80px; width: auto; }
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
The topic has been locked.
- paulfiner
- Offline
- Premium Member
Less
More
- Posts: 117
- Thank you received: 9
13 years 2 months ago #57725
by paulfiner
Replied by paulfiner on topic Using pictures in ranking question
Hi
It seems to be working now. I added in your extra bit of CSS and everything works.
Thanks for all you help (and Tony!)
Cheers
Paul
It seems to be working now. I added in your extra bit of CSS and everything works.
Thanks for all you help (and Tony!)
Cheers
Paul
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10116
- Thank you received: 3597
13 years 2 months ago #57730
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Using pictures in ranking question
Yep, thanks Shnoulle, you need to modify the CSS for the size of your images as stated in the workaround:but it's need some modification in template.css
These styles are for the default template using 50x50px images (as in the demo) and may need to be modified for other templates or image sizes.
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
- paulfiner
- Offline
- Premium Member
Less
More
- Posts: 117
- Thank you received: 9
13 years 2 months ago #57731
by paulfiner
Replied by paulfiner on topic Using pictures in ranking question
I have now added in all the images to complete the question and it looks good.
How difficult would it be to arrange the images into 2 or 3 columns?
In my actual question I have 24 brands on the left and the respondent must rate their top 12.
Having all 24 brands in a long list doesn't look too nice.
Cheers
Paul
How difficult would it be to arrange the images into 2 or 3 columns?
In my actual question I have 24 brands on the left and the respondent must rate their top 12.
Having all 24 brands in a long list doesn't look too nice.
Cheers
Paul
The topic has been locked.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10116
- Thank you received: 3597
13 years 2 months ago #57735
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Using pictures in ranking question
There is no real way to force an unordered list to wrap into columns but adding something like the following to template.css should wrap the lists into rows. I'm not sure this behaviour is very intuitive though.
Code:
#question2505 .dragDropTable .dragDropChoiceList, #question2505 .dragDropTable .dragDropRankList { width: 285px; } #question2505 .dragDropTable li { float: left; }
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
- mattias01
- Offline
- New Member
Less
More
- Posts: 3
- Thank you received: 0
12 years 11 months ago - 12 years 11 months ago #61066
by mattias01
Replied by mattias01 on topic Using pictures in ranking question
what kind of questions should I use to achieve that effect with drag and drop my images? libraries and documentation indicating where I add?
Last edit: 12 years 11 months ago by mattias01.
The topic has been locked.