Template:Howto: Difference between revisions

From Tygron Preview Support Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(24 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{#if:{{{file|}}}|<div class="editor_steps_box_wrapper">}}<div class="editor_steps_box">
<includeonly><!--
<span class="editor_steps_title">'''How to{{#if:{{{title|}}}|&nbsp;{{{title}}}}}:'''</span>{{#if:{{{1|}}}|:# {{{1}}}}}{{#if:{{{2|}}}|:# {{{2}}}}}{{#if:{{{3|}}}|:# {{{3}}}}}{{#if:{{{4|}}}|:# {{{4}}}}}{{#if:{{{5|}}}|:# {{{5}}}}}{{#if:{{{6|}}}|:# {{{6}}}}}{{#if:{{{7|}}}|:# {{{7}}}}}{{#if:{{{8|}}}|:# {{{8}}}}}{{#if:{{{9|}}}|:# {{{9}}}}}{{#if:{{{10|}}}|:# {{{10}}}}}{{#if:{{{11|}}}|:# {{{11}}}}}{{#if:{{{12|}}}|:# {{{12}}}}}{{#if:{{{13|}}}|:# {{{13}}}}}{{#if:{{{14|}}}|:# {{{14}}}}}{{#if:{{{15|}}}|:# {{{15}}}}}{{#if:{{{16|}}}|:# {{{16}}}}}{{#if:{{{17|}}}|:# {{{17}}}}}{{#if:{{{18|}}}|:# {{{18}}}}}{{#if:{{{19|}}}|:# {{{19}}}}}{{#if:{{{20|}}}|:# {{{20}}}}}</div>{{#if:{{{file|}}}|<div class="editor_steps_image">{{{file}}}</div></div>}}<noinclude>
-->{{#if:{{{file|}}}|<div class='editor_steps_box_wrapper'>}}<!--
If more are needed, append:<br>
--><div class='editor_steps_box'>
<nowiki>{{#if:{{{8|}}}|:# {{{8}}}}}</nowiki>
<div class='editor_steps_header'>
<div class='editor_steps_title'><span>'''{{{preamble|{{#if:{{{title|}}}|How to|{{PAGENAME}}}}}}}{{#if:{{{title|}}}|&nbsp;{{{title|}}}|}}:'''</span></div><!--
-->{{#if:{{{video|}}}|<div class='howto_video'><span class='video_text'>Watch the video:&nbsp;</span>[[File:YoutubeLogo1.jpg|link={{{video|}}}|frameless|right|75px]]</div>|}}<!--
--></div><!--
--><div class='editor_steps_content'><!--


The template can be generated using javascript by executing the following function in javascript:
-->{{#if:{{{1|}}}|{{{form|:#}}} {{{1}}}}}<!--
-->{{#if:{{{2|}}}|{{{form|:#}}} {{{2}}}}}<!--
-->{{#if:{{{3|}}}|{{{form|:#}}} {{{3}}}}}<!--
-->{{#if:{{{4|}}}|{{{form|:#}}} {{{4}}}}}<!--
-->{{#if:{{{5|}}}|{{{form|:#}}} {{{5}}}}}<!--
-->{{#if:{{{6|}}}|{{{form|:#}}} {{{6}}}}}<!--
-->{{#if:{{{7|}}}|{{{form|:#}}} {{{7}}}}}<!--
-->{{#if:{{{8|}}}|{{{form|:#}}} {{{8}}}}}<!--
-->{{#if:{{{9|}}}|{{{form|:#}}} {{{9}}}}}<!--
-->{{#if:{{{10|}}}|{{{form|:#}}} {{{10}}}}}<!--
-->{{#if:{{{11|}}}|{{{form|:#}}} {{{11}}}}}<!--
-->{{#if:{{{12|}}}|{{{form|:#}}} {{{12}}}}}<!--
-->{{#if:{{{13|}}}|{{{form|:#}}} {{{13}}}}}<!--
-->{{#if:{{{14|}}}|{{{form|:#}}} {{{14}}}}}<!--
-->{{#if:{{{15|}}}|{{{form|:#}}} {{{15}}}}}<!--
-->{{#if:{{{16|}}}|{{{form|:#}}} {{{16}}}}}<!--
-->{{#if:{{{17|}}}|{{{form|:#}}} {{{17}}}}}<!--
-->{{#if:{{{18|}}}|{{{form|:#}}} {{{18}}}}}<!--
-->{{#if:{{{19|}}}|{{{form|:#}}} {{{19}}}}}<!--
-->{{#if:{{{20|}}}|{{{form|:#}}} {{{20}}}}}<!--
--></div><!--
--></div><!--
-->{{#if:{{{file|}}}|<div class='editor_steps_image'>{{{file|}}}</div></div>}}<!--
-->[[Category:How-to's]]</includeonly><noinclude>
 
If more are needed, add:<br>
<nowiki>-->{{#if:{{{20|}}}|{{{form|:#}}} {{{20}}}}}<!--</nowiki>
 
Example:
 
{{{{PAGENAME}}
| First include the template.
| Then write instructions.
| The title will automatically be the page name.
}}
 
 
{{{{PAGENAME}}
| title=add a custom title
 
| First include the template.
| Then add a "title" parameter, which will be prefixed with "How to".
| Finally, write instructions.
}}
 
 
{{{{PAGENAME}}
| preamble=Setting up
| title=other parameters
| form= ::*
 
| Include the template.
| Use a "preamble" parameter, which will replace the default "How to".
| Use a "title" parameter, which will be prefixed with the entered prefix.
| Use a "form" parameter to dictate the listing prefix (":#" is default, "::*" for indented unordered list.
 
| {{howtoblock|image=Demo-3-30-300.jpg
  | Use a "howtoblock" to:
  | Add multiline instructions
  | Use an "image" for those instructions.
  }}
 
| Finally, review the result.
}}
 
 
The template can be generated using javascript by executing the following function in javascript ((deprecated, needs to be updated):


<pre>
<pre>
var steps=20;
var steps=20;
var string="{{#if:{{{file|}}}|<div class=\"editor_steps_box_wrapper\">}}<div class=\"editor_steps_box\">\n<span class=\"editor_steps_title\">'''How to{{#if:{{{title|}}}|&nbsp;{{{title}}}}}:'''</span>";
var string="<!--";
string=string+"\n"+ "-->{{#if:{{{file|}}}|<div class='editor_steps_box_wrapper'>}}";
string=string+"\n"+ "<div class='editor_steps_box'>";
string=string+"\n"+ "<div class='editor_steps_header'>";
string=string+"\n"+ "<div class='editor_steps_title'><span>'''{{{preamble|{{#if:{{{title|}}}|How to|{{PAGENAME}}}}}}}{{#if:{{{title|}}}|&amp;nbsp;{{{title|}}}|}}:'''</span></div><!--";
string=string+"\n"+ "-->{{#if:{{{video|}}}|<div class='howto_video'><span class='video_text'>Watch the video:&amp;nbsp;</span>[[File:YoutubeLogo1.jpg|link={{{video|}}}|frameless|right|75px]]</div>|}}<!--";
string=string+"\n"+ "--></div><!--";
string=string+"\n"+ "--><div class='editor_steps_content'><!--";
string=string+"\n";
for(i=1;i<=steps;i++) {;
for(i=1;i<=steps;i++) {;
string+="{{#if:{{{"+i+"|}}}|:# {{{"+i+"}}}}}";
    string=string+"\n"+"-->{{#if:{{{"+i+"|}}}|{{{form|:#}}} {{{"+i+"}}}}}<!--";
}
}
string=string+"</div>{{#if:{{{file|}}}|<div class=\"editor_steps_image\">{{{file}}}</div></div>}}";
string=string+"\n"+ "--></div><!--";
string=string+"\n"+ "--></div><!--";
string=string+"\n"+ "-->{{#if:{{{file|}}}|<div class='editor_steps_image'>{{{file|}}}</div></div>}}<!--";
string=string+"\n"+ "-->";
 
console.log(string);
</pre>
</pre>
</noinclude>
</noinclude>

Latest revision as of 17:05, 30 January 2024


If more are needed, add:
-->{{#if:{{{20|}}}|{{{form|:#}}} {{{20}}}}}<!--

Example:

Howto:
  1. First include the template.
  2. Then write instructions.
  3. The title will automatically be the page name.


How to add a custom title:
  1. First include the template.
  2. Then add a "title" parameter, which will be prefixed with "How to".
  3. Finally, write instructions.


Setting up other parameters:
  • Include the template.
  • Use a "preamble" parameter, which will replace the default "How to".
  • Use a "title" parameter, which will be prefixed with the entered prefix.
  • Use a "form" parameter to dictate the listing prefix (":#" is default, "::*" for indented unordered list.
  • Demo-3-30-300.jpg
    Use a "howtoblock" to:
    Add multiline instructions
    Use an "image" for those instructions.
  • Finally, review the result.


The template can be generated using javascript by executing the following function in javascript ((deprecated, needs to be updated):

var steps=20;
var string="<!--";
string=string+"\n"+ "-->{{#if:{{{file|}}}|<div class='editor_steps_box_wrapper'>}}";
string=string+"\n"+ "<div class='editor_steps_box'>";
string=string+"\n"+ "<div class='editor_steps_header'>";
string=string+"\n"+ "<div class='editor_steps_title'><span>'''{{{preamble|{{#if:{{{title|}}}|How to|{{PAGENAME}}}}}}}{{#if:{{{title|}}}|&nbsp;{{{title|}}}|}}:'''</span></div><!--";
string=string+"\n"+ "-->{{#if:{{{video|}}}|<div class='howto_video'><span class='video_text'>Watch the video:&nbsp;</span>[[File:YoutubeLogo1.jpg|link={{{video|}}}|frameless|right|75px]]</div>|}}<!--";
string=string+"\n"+ "--></div><!--";
string=string+"\n"+ "--><div class='editor_steps_content'><!--";
string=string+"\n";
for(i=1;i<=steps;i++) {;
    string=string+"\n"+"-->{{#if:{{{"+i+"|}}}|{{{form|:#}}} {{{"+i+"}}}}}<!--";
}
string=string+"\n"+ "--></div><!--";
string=string+"\n"+ "--></div><!--";
string=string+"\n"+ "-->{{#if:{{{file|}}}|<div class='editor_steps_image'>{{{file|}}}</div></div>}}<!--";
string=string+"\n"+ "-->";

console.log(string);