<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40"><head><META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=us-ascii"><meta name=Generator content="Microsoft Word 14 (filtered medium)"><style><!--
/* Font Definitions */
@font-face
        {font-family:"Cambria Math";
        panose-1:2 4 5 3 5 4 6 3 2 4;}
@font-face
        {font-family:Calibri;
        panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
        {font-family:Tahoma;
        panose-1:2 11 6 4 3 5 4 4 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
        {margin:0cm;
        margin-bottom:.0001pt;
        font-size:12.0pt;
        font-family:"Times New Roman","serif";}
a:link, span.MsoHyperlink
        {mso-style-priority:99;
        color:blue;
        text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
        {mso-style-priority:99;
        color:purple;
        text-decoration:underline;}
p.MsoAcetate, li.MsoAcetate, div.MsoAcetate
        {mso-style-priority:99;
        mso-style-link:"Balloon Text Char";
        margin:0cm;
        margin-bottom:.0001pt;
        font-size:8.0pt;
        font-family:"Tahoma","sans-serif";}
span.EmailStyle17
        {mso-style-type:personal;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
span.EmailStyle18
        {mso-style-type:personal-reply;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
span.BalloonTextChar
        {mso-style-name:"Balloon Text Char";
        mso-style-priority:99;
        mso-style-link:"Balloon Text";
        font-family:"Tahoma","sans-serif";}
.MsoChpDefault
        {mso-style-type:export-only;
        font-size:10.0pt;}
@page WordSection1
        {size:612.0pt 792.0pt;
        margin:72.0pt 72.0pt 72.0pt 72.0pt;}
div.WordSection1
        {page:WordSection1;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]--></head><body lang=EN-GB link=blue vlink=purple><div class=WordSection1><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'>Question is the element’s id so if you use # it works…<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>h3#question {<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>  font-weight: normal;<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>}<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'><o:p> </o:p></span></p><div><div style='border:none;border-top:solid #B5C4DF 1.0pt;padding:3.0pt 0cm 0cm 0cm'><p class=MsoNormal><b><span lang=EN-US style='font-size:10.0pt;font-family:"Tahoma","sans-serif"'>From:</span></b><span lang=EN-US style='font-size:10.0pt;font-family:"Tahoma","sans-serif"'> xerte-dev-bounces@lists.nottingham.ac.uk [mailto:xerte-dev-bounces@lists.nottingham.ac.uk] <b>On Behalf Of </b>Julian Tenney<br><b>Sent:</b> 25 November 2014 09:26<br><b>To:</b> For Xerte technical developers<br><b>Subject:</b> [Xerte-dev] Re: Custom layout for questions?<o:p></o:p></span></p></div></div><p class=MsoNormal><o:p> </o:p></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'>A custom interface is a legacy from the old flash runtime, where you could use a swf as a custom interface: that swf could then call the navigation methods in the main engine.<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'>I’m not so close to the html5 runtime, Fay will give you a better answer tomorrow: try overriding with !important in css?<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'>Otherwise extend the code in the template to handle an optional property for layout?<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'><o:p> </o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'>J<o:p></o:p></span></p><p class=MsoNormal><span style='font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D'><o:p> </o:p></span></p><div><div style='border:none;border-top:solid #B5C4DF 1.0pt;padding:3.0pt 0cm 0cm 0cm'><p class=MsoNormal><b><span lang=EN-US style='font-size:10.0pt;font-family:"Tahoma","sans-serif"'>From:</span></b><span lang=EN-US style='font-size:10.0pt;font-family:"Tahoma","sans-serif"'> <a href="mailto:xerte-dev-bounces@lists.nottingham.ac.uk">xerte-dev-bounces@lists.nottingham.ac.uk</a> [<a href="mailto:xerte-dev-bounces@lists.nottingham.ac.uk">mailto:xerte-dev-bounces@lists.nottingham.ac.uk</a>] <b>On Behalf Of </b>Smith, Bradley<br><b>Sent:</b> 24 November 2014 23:15<br><b>To:</b> For Xerte technical developers<br><b>Subject:</b> [Xerte-dev] Custom layout for questions?<o:p></o:p></span></p></div></div><p class=MsoNormal><o:p> </o:p></p><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>Hello all,<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'><o:p> </o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>Not sure if this is better send to xerte or xerte-dev, but I’ll try the latter first.<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'><o:p> </o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>Personally, I’m not a fan of the two-column sort of layout that Xerte seems to prefer for questions. Often, both my questions and answers may include unix commands, screen shots, and other things that take up a lot of horizontal space. What I would like to have is a “vertical” layout that just shows the instruction/prompt (when you only have one question, I’m unclear why you would distinguish between these  anyway), followed by the answer options, each taking up 100% of the page’s width. <o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'><o:p> </o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>The closest I’ve gotten to this is to set the Panel Width setting to “full”, and put the instruction and prompt text both in the Prompt box . However, the prompt is rendered as an H3 tag, so the whole question appears bolded. This causes problems with text-heavy questions where I need more variety in the formatting. <o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'><o:p> </o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>I noticed an option to include a custom stylesheet with a learning object, so I uploaded one with:<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'><o:p> </o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>h3.question {<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>  font-weight: normal;<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>}<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'><o:p> </o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>When I load the preview, my browser’s dev tools show that the stylesheet is loaded by something, but there is no change to the formatting of the question.<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'><o:p> </o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>So my question is: what’s the best way to do what I want here? I see there’s also an option to upload a “custom interface”, but that only seems to be available at the the learning object level (as opposed to a specific component like a question), and I haven’t seen any docs that explain exactly how to make one anyway.<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'><o:p> </o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>Suggestions?<o:p></o:p></span></p></div><div><p class=MsoNormal><span style='font-size:10.5pt;font-family:"Calibri","sans-serif";color:black'>—Brad<o:p></o:p></span></p></div></div></body></html>