I have an array of 10 images I want to display on a Qualtrics question. Howevr, I like them be presented on a random order (i.e. shuffled for each survey taker). How can I do that? Is there a way to change the html code or something similar to that?
I would appreciate your help
Are you trying to:
1. Display the 10 images in random order to each participant?
2. Display 1 of 10 images at random to each participant?
Either way, you could use Choice Randomization to display all or a subset of your images as answer choices that require no response. Or Question Randomization to randomize Descriptive text blocks that contain your image.
If you have the same set of follow up questions for each image, you might consider Block Randomizer or Loop and Merge logic.
1. Display the 10 images in random order to each participant?
2. Display 1 of 10 images at random to each participant?
Either way, you could use Choice Randomization to display all or a subset of your images as answer choices that require no response. Or Question Randomization to randomize Descriptive text blocks that contain your image.
If you have the same set of follow up questions for each image, you might consider Block Randomizer or Loop and Merge logic.
Thank you KoalaTricks for the response.
I want to Display the 10 images in random order to each participant. The issue is I want to make the images look like an Instagram feed. I have 10 made up images and I inserted them in one questions. I am familiar with Block Randomizer, but one limitation with it is it will create blank spaces between each image/question.
DOes that make sense?
I want to Display the 10 images in random order to each participant. The issue is I want to make the images look like an Instagram feed. I have 10 made up images and I inserted them in one questions. I am familiar with Block Randomizer, but one limitation with it is it will create blank spaces between each image/question.
DOes that make sense?
You can use some CSS to re-style/un-style that divider. e.g. in the question HTML editor: `<style>.QuestionBody{display:none}</style>` removes the bulk of the space. Looks like there is also some `padding-bottom` depending on what theme you're using, which you can override as well.
Alternatively you could try formatting them as multiple choice entries and then hide the radio buttons using CSS.
Alternatively you could try formatting them as multiple choice entries and then hide the radio buttons using CSS.
+2
Expanding on the 1st answer, you could use random choices for a single/multi choice column, graphic question. Making them look more like instagram will fall to you to preview the survey with your theme and then probably iteratively experiment with custom CSS to remove margins, padding, or add other styling created by the Qualtrics theme, and to implement your own. But a default 3 columns get's you pretty close IMO. You can do some experimenting in chrome using the developer tools /inspector via F12.
To remove the selected radio (probably inadvisable) you'd have to hide it and then add some custom JS/CSS to highlight the selected image, and your theme would have to be one that wraps labels around questions so that an image click activates the choice, rather than just a click to the radio button, itself.
Another possible hack is to just embeded your images into the rich text editor of a standard text input question, and order via JavaScript. Stackoveflow has tons of related answers. This fiddle, probably gets you part of the way to where you want to go, though I'd highly advise making better markup choices: Depending on your needs, like if you need the respondent to select an image, you could put onclick handlers on the images (in the fiddle) and report the ID or title or some attribute of the images into a text input (which you could hide with CSS). YMMV on selectors in my example.
To remove the selected radio (probably inadvisable) you'd have to hide it and then add some custom JS/CSS to highlight the selected image, and your theme would have to be one that wraps labels around questions so that an image click activates the choice, rather than just a click to the radio button, itself.
Another possible hack is to just embeded your images into the rich text editor of a standard text input question, and order via JavaScript. Stackoveflow has tons of related answers. This fiddle, probably gets you part of the way to where you want to go, though I'd highly advise making better markup choices: Depending on your needs, like if you need the respondent to select an image, you could put onclick handlers on the images (in the fiddle) and report the ID or title or some attribute of the images into a text input (which you could hide with CSS). YMMV on selectors in my example.
Thank you whicks1. Have you tried though to create a mock-up Instagram feed on Qualtrics? What CSS resources I need to use?
+2
This should save you a couple of clicks to search: You'd obviously have to modify a lot to fit it to the qualtrics markup; but since it can do a 3xN Grid, honestly why bother with all the extra bells and whistles. It's just usually not that important.
> @KoalaTricks said:
> You can use some CSS to re-style/un-style that divider. e.g. in the question HTML editor: `<style>.QuestionBody{display:none}</style>` removes the bulk of the space. Looks like there is also some `padding-bottom` depending on what theme you're using, which you can override as well.
>
> Alternatively you could try formatting them as multiple choice entries and then hide the radio buttons using CSS.
How to make the list randomized then?
> You can use some CSS to re-style/un-style that divider. e.g. in the question HTML editor: `<style>.QuestionBody{display:none}</style>` removes the bulk of the space. Looks like there is also some `padding-bottom` depending on what theme you're using, which you can override as well.
>
> Alternatively you could try formatting them as multiple choice entries and then hide the radio buttons using CSS.
How to make the list randomized then?
@amuqaddam You'd randomize using the UI randomization settings.
https://www.qualtrics.com/support/survey-platform/survey-module/question-options/choice-randomization/
https://www.qualtrics.com/support/survey-platform/survey-module/question-options/choice-randomization/
Leave a Reply
Enter your username or e-mail address. We'll send you an e-mail with instructions to reset your password.