Question regarding RollTemplates (newb)

Hello everyone,   I'm a programmer by trade, but most of my work is in SQL and .NET.  So HTML/CSS is totally new to me. So apologies if I'm getting confused on simple things... I have created (copied from other sheets/roll20 guide/added my own bits) the following rolltemplate :  <rolltemplate class="sheet-rolltemplate-blue"> <div class="sheet-template-container">     <caption>{{name}}</caption>     {{#allprops() }}         <div class="sheet-template-row">             <span>{{name}} roll: </span>{{value}}         </div>         <div class="sheet-template-row">             <span>Target#: </span>{{target}}         </div>         <!--         <div class="sheet-template-row">             {{#^rollGreater() target}}                 <span>SUCCESS!</span>             {{#^rollGreater() target}}             {{#rollGreater() target}}                 <span>FAILURE!</span>             {{/rollGreater() target}}         </div>         -->     {{/allprops() }} </div> </rolltemplate> However, not only does it not work, but if I uncomment the portion with the rollGreater logic, the game chat window gets completely borked up and won't display anything (just a white box, even chat entered in the client won't show up).  Commenting it out fixes that problem, but I have other problems, so I'm going to list them in order. 1) The display doesn't work correctly for the simple 'display roll and target number'. As you can see, I get what I would expect, I get 'Strength Check' as a heading (need to work on that), then I get Strength Check Roll: <value> (3 in this case, as that was what was rolled) Then I get Target#: <value> (50 in this case, as that is what I passed in) However, I get two extra copies of both, and both of them are using the target # (not sure HOW that is happening).  Anyone know what I did wrong? Button Call producing this :  <button type="roll" value="&{template:blue} {{name=Strength Check}} {{Roll=[[1d100]]}} {{target=[[@{str}]]}}" name="roll_STR" class="d10-dice-str rollmod-no" style="padding: 0px 0px;"></button> 2) The whole greater than thing wiping out my chat window.  I'd like it to look like this when I'm done :  Any help is appreciated. Matt EDIT: Fixed code style, and screenshots

Ok, found one issue. I should have been using {{Roll}} and not {{value}} on the Check span.           <div class="sheet-template-row">             <span>{{name}} roll: </span>{{Roll}}         </div>         <div class="sheet-template-row">             <span>Target#: </span>{{target}}         </div> This sort of fixed some of it.  Now I get two sets of Check Roll & Target #, but at least the Roll value is the same for both top and bottom set instead of target for everything. :)

Conidering the roll templates are custom things for roll20, it's possible html commenting doesn't work inside them, so I'd just stay clear form it as you've noticed that it doesn't seem to work. Regarding 2), did you use any CSS with your roll templates? Not sure if it's strictly necessary, but I've never seen a a roll template without any CSS , so you probably should try out using the CSS for the example as well, and see if it make any difference.

And of course, as soon as I post, i figure out #2. :) <rolltemplate class="sheet-rolltemplate-blue">  <div class="sheet-template-container">     <caption>{{name}}</caption>     {{#allprops() }}         <div class="sheet-template-row">             <span>{{name}} roll: </span>{{Roll}}         </div>         <div class="sheet-template-row">             <span>Target#: </span>{{target}}         </div>                  <div class="sheet-template-row">             {{#^rollGreater() Roll target}}                 <span>SUCCESS!</span>             {{/^rollGreater() Roll target}}             {{#rollGreater() Roll target}}                 <span>FAILURE!</span>             {{/rollGreater() Roll target}}         </div>                       {{/allprops() }} </div> </rolltemplate> Updated code above. I still can't figure out why it's displaying it twice... Matt

ᐰndreas J. said: Conidering the roll templates are custom things for roll20, it's possible html commenting doesn't work inside them, so I'd just stay clear form it as you've noticed that it doesn't seem to work. Regarding 2), did you use any CSS with your roll templates? Not sure if it's strictly necessary, but I've never seen a a roll template without any CSS , so you probably should try out using the CSS for the example as well, and see if it make any difference. .sheet-rolltemplate-blue table {  width:100%;  background-color:white;  border:1px solid rgba(51, 51, 255,1); } .sheet-rolltemplate-blue caption {  background-color:rgba(51, 51, 255,1);  color:white;  font-family:"Helvetica Neue",Helvetica,sans-serif;  font-weight:600;  text-align:center;  font-size:1.1em;  padding:5px; } .sheet-rolltemplate-blue td {  padding:5px;  line-height:1.4em;  vertical-align:top; } .sheet-rolltemplate-blue td:first-child {  font-weight:bold;  text-align:right;  min-width:50px;  padding-right:10px; } .sheet-rolltemplate-blue tr:nth-child(even) {  background-color:#eee; } I just didn't put it in originally.  The problem with the greater was I misread how to use it (the example only showed a single parameter, but looking into the text a bit further down on the page, it became clear it needed 2 parameters).  Should have figured that out easier. :) Basically, I'm down to just needing to figure out why it's doing doubles... Matt

Your roll table doesn't have any <td> elements, so don't know how that CSS would do anything anyway.

ᐰndreas J. said: Your roll table doesn't have any <td> elements, so don't know how that CSS would do anything anyway. DOH!  You are right, I forgot to put the tr/td elements back into the rolltemplate (I was trying to figure out why the chat broke, and took them out).   Now I'm wondering if the duplicate is coming from something in the CSS?  I can't see how it would from the HTML. <rolltemplate class="sheet-rolltemplate-blue"> <table> <caption>{{name}}</caption> {{#allprops() }} <tr><td><span>{{name}} roll: </span></td><td>{{Roll}}</td> <tr></tr> <tr><td><span>Target#: </span></td><td>{{target}}</td></tr> <tr></tr> {{#^rollGreater() Roll target}} <tr><td><span>SUCCESS!</span></td></tr> {{/^rollGreater() Roll target}} {{#rollGreater() Roll target}} <tr><td><span>FAILURE!</span></td></tr> {{/rollGreater() Roll target}} {{/allprops() }} </table> </rolltemplate> Part of the problem with using stuff you find in other sheets/one the web/in the guide is that you don't know for sure it works or if it does how it works. :) Thanks for the help so far! Matt

/*Configure the tab buttons*/ .sheet-stats, .sheet-skill1, .sheet-skill2, .sheet-skill3, .sheet-gear, .sheet-notes, .sheet-settings{ display: none; } /* show the selected tab */ .sheet-tabstoggle[value="stats"] ~ div.sheet-stats, .sheet-tabstoggle[value="skill1"] ~ div.sheet-skill1, .sheet-tabstoggle[value="skill2"] ~ div.sheet-skill2, .sheet-tabstoggle[value="skill3"] ~ div.sheet-skill3, .sheet-tabstoggle[value="gear"] ~ div.sheet-gear, .sheet-tabstoggle[value="notes"] ~ div.sheet-notes, .sheet-tabstoggle[value="settings"] ~ div.sheet-settings { display: block; } .sheet-stats { background-color: #ddd; min-width: 800px; } .sheet-skill1 { background-color: #ddd; min-width: 800px; } .sheet-skill2 { background-color: #ddd; min-width: 800px; } .sheet-skill3 { background-color: #ddd; min-width: 800px; } .sheet-gear { background-color: #ddd; min-width: 800px; } .subskill label { display: inline-block; padding-left: 20px; } h2 { font-size: 2em; margin-bottom: 10px; text-align: center; } label { display: inline; /*width: 30%;*/ } input { display: inline-block; /*width: 500px;*/ } textarea { resize: vertical; width: 95%; } .sheet-stats input { margin-right: 8%; } input.sheet-short { width: 40%; float: right; } input.sheet-wide { width: 60%; float: right; } input.sheet-med { width: 60%; float: right; } input.sheet-medss { width: 70%; } input.sheet-medl { width: 80%; float: left; } input.sheet-subskill { width: 80%; float: right; } label.lbl-inline-short { display: inline; width: 15%; } label.neat { display: inline; width: 20%; } input.sheet-skill { display: inline-block; float: right; } input.sheet-hidden { display: none; } input[type=number].sheet-pipnumber{ width:33px; } .subskill { margin-left: 30px; } /* BUTTONS */ button[type=roll].sheet-d10-dice-str::before { font-family: 'dicefontd10'; content: 'T '; font-size:18px; background-color:#00BFFF; border: none; text-align: center; text-decoration: none; margin: 0px 0px; padding: 0px 0px; border: 2px solid #00BFFF; /*border-radius: 50%;*/ } button[type=roll].sheet-d10-dice-avg::before { font-family: 'dicefontd10'; content: 't '; } /* TEMPLATES */ .sheet-rolltemplate-blue table { width:100%; background-color:white; border:1px solid rgba(51, 51, 255,1); } .sheet-rolltemplate-blue caption { background-color:rgba(51, 51, 255,1); color:white; font-family:"Helvetica Neue",Helvetica,sans-serif; font-weight:600; text-align:center; font-size:1.1em; padding:5px; } .sheet-rolltemplate-blue td { padding:5px; line-height:1.4em; vertical-align:top; } .sheet-rolltemplate-blue td:first-child { font-weight:bold; text-align:right; min-width:50px; padding-right:10px; } .sheet-rolltemplate-blue tr:nth-child(even) { background-color:#eee; } } My entire CSS file if it helps.  

From the roll template wiki page, it's smarter to use Jacob's Better Roll templat e than wherever you found this <table> based thing from.

ᐰndreas J. said: From the roll template wiki page, it's smarter to use Jacob's Better Roll templat e than wherever you found this <table> based thing from. Actually, looking at that one resulted in the fix to the duplicate data. ;) Silly me, I didn't realize that #allprops was basically a looper, so it was looping through and pasting it in multiple times.  All resolved now, thanks everyone!   And I did decide to merge Jakob's with mine, to get the success/failure messages I was looking for for the players.   <rolltemplate class="sheet-rolltemplate-custom"> <div class="sheet-container sheet-color-{{color}}"> <div class="sheet-header"> {{#title}}<div class="sheet-title">{{title}}</div>{{/title}} {{#subtitle}}<div class="sheet-subtitle">{{subtitle}}</div>{{/subtitle}} </div> <div class="sheet-content"> {{#allprops() title subtitle desc color}} <div class="sheet-key">{{key}}</div> <div class="sheet-value">{{value}}</div> {{/allprops() title subtitle desc color}} {{#desc}}<div class="sheet-desc">{{desc}}</div>{{/desc}} {{#target}} {{#^rollGreater() Roll target}} <div class="sheet-key-succ">SUCCESS!</div> {{/^rollGreater() Roll target}} {{#rollGreater() Roll target}} <div class="sheet-key-fail">FAILURE!</div> {{/rollGreater() Roll target}} {{/target}} </div> </div> </rolltemplate> Noice! :)  Thanks all Matt