BIONICLEsector01:Help/Advanced Wiki-Coding
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
MagicWord | Description | Preview |
---|---|---|
Page-Specific MagicWords | ||
{{PAGENAME}}
|
Inserts the page name including the subpage name without the namespace. | Help/Advanced Wiki-Coding |
{{FULLPAGENAME}}
|
Inserts the page name, namespace, and subpage name. | BIONICLEsector01:Help/Advanced Wiki-Coding |
{{BASEPAGENAME}}
|
Inserts only the page name without the namespace or the subpage name. | Help Please note that, in this instance, /Advanced Wiki-Coding is not a subpage, it is part of the page's name. |
{{NAMESPACE}}
|
Inserts the page's name space. | BIONICLEsector01 |
BS01-Specific Words/Numbers | ||
{{SERVER}}
|
Inserts the top level domain (TLD). | https://biosector01.com |
{{NUMBEROFPAGES}}
|
Inserts the total number of pages on BS01. | 21,694 |
{{NUMBEROFARTICLES}}
|
Inserts the total number of pages in the main namespace. | 1,494 |
{{NUMBEROFUSERS}}
|
Inserts the total number of BS01 members. | 1,745 |
Time-Specific Words | ||
{{CURRENTYEAR}}
|
Inserts the current year. | 2024 |
{{CURRENTMONTH}}
|
Inserts the number of the current month. | 09 |
{{CURRENTMONTHNAME}}
|
Inserts the name of the current month. | September |
{{CURRENTDAY}}
|
Inserts the number of the current day (with regards to the current month). | 10 |
{{CURRENTDOW}}
|
Inserts the number of the current day (with regards to the current week). 0=Sunday; 1=Monday; 2=Tuesday, etc. |
2 |
{{CURRENTDAYNAME}}
|
Inserts the name of the current day. | Tuesday |
{{CURRENTHOUR}}
|
Inserts the current hour (In 24-hour format) | 19 |
{{CURRENTTIME}}
|
Inserts the current hour with minutes (24-hour format) | 19:07 |
Table of Contents | ||
__TOC__
|
Inserts a table of contents wherever the code is placed (overrides __NOTOC__ ).
|
|
__NOTOC__
|
Hides the table of contents (if __TOC__ is used, __NOTOC__ is overridden).
|
{{PAGENAME}}, {{BASEPAGENAME}}, and {{FULLPAGENAME}}
, when used for links, must have a capital 'E' added to the end like this:
{{PAGENAMEE}}, {{BASEPAGENAMEE}}, and {{FULLPAGENAMEE}}
.
To use a MagicWord with a link, you must use an external link. Simply insert the magic word where the page name would be.
[{{SERVER}}/wiki/index.php/{{FULLPAGENAMEE}} A Link To This Page]
produces:
A Link To This Page
To use a MagicWord with a switch, it is not necessary to add a capital 'E.'
{{#switch: {{BASEPAGENAME}}| Help/Advanced Wiki-Coding=1| Sidorak=2| #default=3|}}
produces:
3
If you wanted to make a code to display a message every Friday, the coding would look something like this:
{{#switch: {{CURRENTDOW}}| 5=I love Fridays!| #default=It's not Friday yet.|}}
producing:
It's not Friday yet.
If you wanted it to count down to Friday, read on to learn how to use math with BS01.
Math (#expr Function)
The #expr function acts like a calculator, completing an equation and inserting the result before the page is parsed, meaning it can be used for links and switches like a MagicWord.
All basic operators will work in an equation, including (but not limited to) +, -, /, *, and ^ as well as <, >, and = .
If you wished to make a countdown until Friday, you would subtract the current day's number of the week from 5 (Friday's number):
{{#expr: 5-{{CURRENTDOW}}}}
producing:
3 (Since today is Tuesday and 5-2=3)
The problem is, if it's Saturday, the result will be -1 and Sunday will be -2, so you need to use a switch to change -1 to 6 and 2- to 5.
Now the coding looks like this:
{{#switch: {{#expr: 5-{{CURRENTDOW}}}} |-1=6 |-2=5 |#default={{#expr: 5-{{CURRENTDOW}}}} }}
producing:
3
Now, we wanted a message to be displayed on Friday and a countdown for every other day, so we need to add a value for 0 (5-5=0) and a message to -1 and -2 as well #default
{{#switch: {{#expr: 5-{{CURRENTDOW}}}} |-1=There's still 6 more day(s) until Friday. |-2=There's still 5 more day(s) until Friday. |0=Yay, it's Friday! |#default=There's still {{#expr: 5-{{CURRENTDOW}}}} more day(s) until Friday. }}
producing:
There's still 3 more day(s) until Friday.
If you wanted to put your age on your UP but don't want to edit it every year, you can use math and switches to automatically write your age. To start off, you would subtract your birthday from the current year. If you were born in 1993, it would look like this:
{{#expr: {{CURRENTYEAR}}-1993}}</nowiki>
That would produce this:
31 (Since 2024-1993=31)
Now, the problem is, that only works in the days after your birthday, not the days before. So to fix this, we use a switch to determine the current month. If you were born in July, you'd need a switch to detect what the current month is and change the result if it's after July. The switch would look something like this:
{{#switch: {{#expr: {{CURRENTMONTH}}>=7}} |1={{#expr: {{CURRENTYEAR}}-1993}} |0={{#expr: {{CURRENTYEAR}}-1994}} }}
The first line basically checks if the current month is after (greater than or equal to) July (7). If it is, the answer is true (1) and if it isn't, the answer is false (0). If the answer is false, the answer needs to be one number larger so we could either add one to the true (1) answer or just add one to our birthday (which is what we did). Since September occurs after July and 2024-1993=31, the code produces this:
31
Now, it will show your age and update itself without you having to do anything!
For those who are REALLY picky and want it to show their birthday exactly (according to the date, not the time) can use the code below which uses the same idea but adds to it. This code would be for someone who was born on August (8) 9th (9), 1993.
{{#switch: {{#expr: {{CURRENTMONTH}}<8}} |1={{#expr: {{CURRENTYEAR}}-1994}} |0={{#switch: {{CURRENTMONTH}} |#default={{#expr: {{CURRENTYEAR}}-1993}} |8={{#switch: {{#expr: {{CURRENTDAY}}>=9}} |1={{#expr: {{CURRENTYEAR}}-1993}} |0={{#expr: {{CURRENTYEAR}}-1994}} }} }} }}
Everything you need to know about DIV and SPAN
Probably the most useful HTML tag is <div>. "div" is short for divider though it's purpose is nothing of the sort. A <div> tag can be used to apply CSS (Cascading Style Sheets) to a specific section of a page. It can be as simple as a background color or text alignment to as complicated as an absolute position. <span> is pretty much the same thing, but less recommended. The most useful purpose of the <span> tag is to hide the icon next to external links.
style
An attribute is basically something inside of a tag that appears in this format: <tag attribute="stuff"></tag>. The style attribute is the most important. You are able to put any CSS inside of it. Below is a chart of CSS properties to place inside the style attribute.
Property | Usage | Example | |
---|---|---|---|
background-color | Applies a background color to the entire div. | <div style="background-color: #FFFFFF;"></div> | |
border | Applies a border to the entire div. Add the color, followed by the design, followed by the size. | <div style="border: black solid 1px;"></div> | |
color | Applies a color to the font. | <div style="color: blue;"></div> | |
height | The height of the div. Either use a pixel amount, or to make it auto-fit to the content, use auto. | <div style="height: 100px;"></div> | |
overflow | To hide anything that doesn't fit, use hidden. To show anything that doesn't fit, use show. To use scrollbars to fit everything inside, use auto | <div style="overflow: auto;"></div> | |
width | The width of the div. Either use a pixel amount, or to make it auto=fit to the content, use auto. | <div style="width: 200px;"></div> | |
opacity & filter: alpha(opacity=) | Changes the opacity of the div or span. It is a numerical value ranging from 0.0 (transparent) to 1.0 (opaque). In order for opacity to work for IE users, the filter property must be used as well. It is a numerical value ranging from 0 (transparent) to 100 (opaque). To convert opacity values to filter values, multiply by 100. To convert filter values to opacity values, divide by 100. | <div style="opacity: 0.5; filter: alpha(opacity=50);"></div> | |
Position | |||
position | There are several options for this: relative, absolute, fixed, and static. Relative allows one to specify where to move the div from its current position. Absolute lets one specify where the div is to be placed no matter what. Fixed specifies a location on the screen that never changes, even if the visitor scrolls. Static is the default and it disables top/bottom/left/right. Below is a comparison of top/bottom and left/right as they apply to relative positioning and absolute positioninf. | <div style="position: absolute;"></div> | |
top/bottom | Pixels can be used for definite positions. If you need it to change depending on screen resolutions, use a percentage instead of pixels. | <div style="position: foo; top: 5px;"></div> <div style="position: foo; top: 5%;"></div> | |
Absolute Dictates how far away from the top/bottom the div should be. |
Relative Dictates how much the div should move up/down. | ||
left/right | Pixels can be used for definite positions. If you need it to change depending on screen resolutions, use a percentage instead of pixels. | <div style="position: foo; left: 5px;"></div> <div style="position: foo; left: 5%;"></div> | |
Absolute Dictates how far away from the left/right the div should be. |
Relative Dictates how much the div should move left/right. | ||
z-index | How far above or below the div should be. -1 is below normal page content and 1 is above normal page content. From there, you make some divs above/below other ones by using higher/lower numbers. | <div style="z-index: 1;"></div> |
So if you wanted a message to appear at the top left of a page in a blue box, you might use the following:
<div style="background-color: blue; position: absolute; top: 10px; left: 10px;">Boo</div>
More about div and span
To align text using a div, simply use the align attribute like so: <div align="right"></div>.
To remove the icon next to an external link, use the following code: <span class="plainlinks"></span>.
And that's everything you need to know about div and span.
Further Assistance
Members with the following badges will be able to assist you. To see the list of members, simply click on the image and scroll down to the list at the bottom of the page.