Single Question
Use these to create single non-graded questions inside the print.php documents for LC template based lessons.
Multiple Choice (Radio Type)
<div class="panel panel-default interaction-question">
<div class="panel-body">
<div class="question-wrap radio">
<h4>Question</h4>
<p>INSERT QUESTION TEXT HERE</p>
<form action="#">
<fieldset>
<div class="response-group-item"><input id="q01a" name="q01" value="a" type="radio"><label for="q01a"> <strong>a) </strong>Option 1 Incorrect</label></div>
<div class="response-group-item correct"><input id="q01b" name="q01" value="b" type="radio"><label for="q01b"> <strong>b) </strong>Option 2 Correct</label></div>
<div class="response-group-item"><input id="q01c" name="q01" value="c" type="radio"><label for="q01c"> <strong>c) </strong>Option 3 Incorrect</label></div>
<div class="response-group-item"><input id="q01d" name="q01" value="d" type="radio"><label for="q01d"> <strong>d) </strong>Option 4 Incorrect</label></div>
<input class="submit-button btn btn-primary" name="submit-button" value="Done" type="button">
</fieldset>
</form>
<div class="answer">
<p class="response">The correct answer is b.</p>
<p class="explanation">INSERT YOUR FEEDBACK HERE.</p>
</div>
<div class="message">Please make a selection.</div>
</div>
</div>
</div>Multiple Select (Checkbox Type)
<div class="panel panel-default interaction-question">
<div class="panel-body">
<div class="question-wrap checkboxes">
<h4>Question</h4>
<p>INSERT QUESTION TEXT HERE</p>
<form action="#">
<fieldset>
<div class="response-group-item correct"><input id="q02a" name="q02" value="a" type="checkbox"><label for="q02a"> <strong>a) </strong>Option 1 Correct</label></div>
<div class="response-group-item correct"><input id="q02b" name="q02" value="b" type="checkbox"><label for="q02b"> <strong>b) </strong>Option 2 Correct</label></div>
<div class="response-group-item"><input id="q02c" name="q02" value="c" type="checkbox"><label for="q02c"> <strong>c) </strong>Option 3 Incorrect</label></div>
<div class="response-group-item"><input id="q02d" name="q02" value="d" type="checkbox"><label for="q02d"> <strong>d) </strong>Option 4 Incorrect</label></div>
<input class="submit-button btn btn-primary" name="submit-button" value="Done" type="button">
</fieldset>
</form>
<div class="answer">
<p class="response">The correct answers are a and b.</p>
<p class="explanation">INSERT YOUR FEEDBACK HERE.</p>
</div>
<div class="message">Please make a selection.</div>
</div>
</div>
</div>Text Entry (Textarea Type)
<div class="panel panel-default interaction-question">
<div class="panel-body">
<div class="question-wrap textentry">
<h4>Question</h4>
<p class="question">INSERT QUESTION TEXT HERE</p>
<form action="#">
<fieldset>
<textarea class="textbox" name="textarea01" cols="60" rows="5" id="textarea01"></textarea>
<br>
<input class="submit-button btn btn-primary" name="submit-button" value="Done" type="button">
</fieldset>
</form>
<div class="answer">
<p class="explanation">INSERT YOUR FEEDBACK HERE.</p>
</div>
</div>
</div>
</div>Drop Down List (Select Type)
<div class="panel panel-default interaction-question">
<div class="panel-body">
<div class="question-wrap inlinedropdowns">
<h4>Question</h4>
<p class="question">INSERT QUESTION TEXT HERE</p>
<form action="#">
<fieldset>
<div class="response-group-item"> <strong>a) </strong>MAKE AN ORDERED OR UNORDERED LIST HERE LEAVING 5 UNDERSCORES
<select name="q04a">
<option>--</option>
<option>answer option1</option>
<option>answer option2 correct</option>
<option>answer option3</option>
</select> FOLLOWED BY A PARENTHETICAL LIST OF ANSWER OPTIONS HIGHLIGHTING THE CORRECT ANSWER IN BOLD.
</div>
<div class="correct response-group-item dropdown_correct answer">answer option2 correct</div>
<div class="response-group-item"><strong> b) </strong>MAKE AN ORDERED OR UNORDERED LIST HERE LEAVING 5 UNDERSCORES
<select name="q04b">
<option>--</option>
<option>answer option1</option>
<option> answer option2</option>
<option> answer option3 correct</option>
</select> FOLLOWED BY A PARENTHETICAL LIST OF ANSWER OPTIONS HIGHLIGHTING THE CORRECT ANSWER IN BOLD.
</div>
<div class="correct response-group-item dropdown_correct answer">answer option3 correct</div>
<input class="submit-button btn btn-primary" name="submit-button" value="Done" type="button">
</fieldset>
</form>
<div class="answer">
<p class="explanation">Feedback here.</p>
</div>
<div class="message">Please make a selection.</div>
</div>
</div>
</div>Draw Tool Exercise
Note: Drawing questions inside tabs or hidden content do not persist drawn data!
<div class="drawing-question panel-body" data-image="SAMPLE_IMAGE_NAME.jpg" data-colors="red, green, black" data-labels="Red, Green, Black">
<h4>Question</h4>
<p>INSERT QUESTION TEXT HERE</p>
</div>Drag and Drop Exercise
<div class="panel panel-default interaction-question">
<div class="panel-body">
<div class="question-wrap-drag">
<h4>Exercise</h4>
<p>QUESTION_TEXT</p>
<div class="drag-container" title="media/graphics/SAMPLE_IMAGE.jpg">
<div class="image_holder"></div>
<p class="drag_directions"></p>
<div class="drag_controls_holder">
<div class="drag_controls">
<div class="draggable ui-widget-content ui-draggable drag_item ui-draggable-handle"> <span class="glyphicon glyphicon-th"></span>DRAGGABLE_1</div>
<div class="draggable ui-widget-content ui-draggable drag_item ui-draggable-handle"> <span class="glyphicon glyphicon-th"></span>DRAGGABLE_2</div>
<div class="draggable ui-widget-content ui-draggable drag_item ui-draggable-handle"> <span class="glyphicon glyphicon-th"></span>DRAGGABLE_3</div>
<div class="draggable ui-widget-content ui-draggable drag_item ui-draggable-handle"> <span class="glyphicon glyphicon-th"></span>DRAGGABLE_4</div>
</div>
<input class="done_drag btn btn-primary" value="Done" type="button">
<input class="reset_drag btn btn-default" value="Reset" type="button">
</div>
</div>
<div class="answer">
<p>FEEDBACK_TEXT</p>
</div>
</div>
</div>
</div>Reordering List Exercise
<div class="panel panel-default interaction-question">
<div class="panel-body">
<div class="question-wrap reordering">
<h4>Question</h4>
<p>INSERT QUESTION TEXT HERE</p>
<form action="#">
<fieldset>
<div class="response-group-item">
<ol class="sortable sortIt ui-sortable" start="1">
<li class="ui-state-default ui-sortable-handle"><span class="glyphicon glyphicon-th"></span> INSERT ORDERED LIST ITEMS HERE FOR REORDERING.<span class="glyphicon glyphicon-sort"></span></li>
<li class="ui-state-default ui-sortable-handle"><span class="glyphicon glyphicon-th"></span> INSERT ORDERED LIST ITEMS HERE FOR REORDERING.<span class="glyphicon glyphicon-sort"></span></li>
<li class="ui-state-default ui-sortable-handle"><span class="glyphicon glyphicon-th"></span> INSERT ORDERED LIST ITEMS HERE FOR REORDERING.<span class="glyphicon glyphicon-sort"></span></li>
</ol>
</div>
<input class="submit-button btn btn-primary" name="submit-button" value="Done" type="button">
</fieldset>
</form>
<div class="answer response-group-item correct">
<p class="explanation">INSER YOUR FEEDBACK HERE.</p>
</div>
<div class="message">Please make a selection.</div>
</div>
</div>
</div>Last updated