Template:Howto: Difference between revisions

From Tygron Preview Support Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(41 intermediate revisions by 2 users not shown)
Line 1: Line 1:
<div class="editor_steps_box">
<includeonly><!--
{{#if:{{{1|}}}|:# {{{1}}}}}
-->{{#if:{{{file|}}}|<div class='editor_steps_box_wrapper'>}}<!--
{{#if:{{{2|}}}|:# {{{2}}}}}
--><div class='editor_steps_box'>
{{#if:{{{3|}}}|:# {{{3}}}}}
<div class='editor_steps_header'>
{{#if:{{{4|}}}|:# {{{4}}}}}
<div class='editor_steps_title'><span>'''{{{preamble|{{#if:{{{title|}}}|How to|{{PAGENAME}}}}}}}{{#if:{{{title|}}}|&nbsp;{{{title|}}}|}}:'''</span></div><!--
</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'><!--
 
-->{{#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>
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|}}}|&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++) {;
    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);
</pre>
 
</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);