Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Change layout/design of multiple choice items

tobiashaug
Topic Author
Offline
New Member

More

7 years 3 months ago #185993 by tobiashaug

Change layout/design of multiple choice items was created by tobiashaug

I was wondering if anyone know how it is possible to change the layout/design of multiple-choice items? For a specific survey, I need the following layout:

left hand side: item/question (as video)
right hand side (not below the question): four answer choices (top left, top right, bottom left, bottom right).

Any feedback is welcome!

Tobias

The topic has been locked.

tpartner
Offline
LimeSurvey Community Team

More

7 years 3 months ago - 7 years 3 months ago #186000 by tpartner

Replied by tpartner on topic Change layout/design of multiple choice items

You could create a custom question theme for that but if this is just a requirement for a single question, adding something like this to the question source should do the trick.

Code:

<script type="text/javascript" charset="utf-8">

	$(document).on('ready pjax:scriptcomplete',function(){
 
		// Identify this question
		var thisQuestion = $('#question{QID}');
		
		// Move element(s)
		$('.question-title-container', thisQuestion).append($('.question-valid-container', thisQuestion));
	});
</script>

<style type="text/css">

	@media only screen and (min-width: 480px) {

		#question{QID} .question-title-container,
		#question{QID} .answer-container {
			width: 50%;
		}
		
		#question{QID} .question-valid-container {
			padding-left: 0;
		}
	}
</style>