Wiki contribution guide/Advanced: Difference between revisions

From RetroMC
Jump to navigation Jump to search
(Initial page creation)
 
(Added the first and partial 2nd examples)
Line 3: Line 3:


== HTML and CSS ==
== HTML and CSS ==
<code><nowiki><span style="">text</span></nowiki></code> (inline/single-line) and <code><nowiki><div style="">text</div></nowiki></code> (block/multiline) is the primary method for advanced styling.<br>
<code><nowiki><span style="">text</span></nowiki></code> (inline/single-line) and <code><nowiki><div style="">text</div></nowiki></code> (block/multiline) is the primary method for advanced styling; for an in-depth look, see [https://www.mediawiki.org/wiki/Manual:CSS Manual:CSS on MediaWiki].
 
=== Large center title ===
As a potentially nonsensical example, suppose you want to make a large title for a fictional anime adaptation of [[RetroMC (server)|RetroMC]] airing on OVH TV and MediaWiki. From the source of the [[fer]] page:
<nowiki><div width=100% style="font-size: 45px;text-align: center;"><span style="color:#55FF55;">'''Retro'''<span style="color:#55FFFF;">'''MC'''</span></span>: The Legacy Community Adventures</div>
<div width=100% style="font-size: 20px;text-align: center;">''Airing 24/7, on OVH® TV and streaming on MediaWiki®''</div></nowiki>
 
In the first div, the width is set to 100% to make the text properly centered.<br>
The text encased in triple-apostrophes are '''bolded'''.<br>
The rest of the parameters should be self-explanatory; here's the result:
 
<div width=100% style="font-size: 45px;text-align: center;"><span style="color:#55FF55;">'''Retro'''<span style="color:#55FFFF;">'''MC'''</span></span>: The Legacy Community Adventures</div>
<div width=100% style="font-size: 20px;text-align: center;">''Airing 24/7, on OVH® TV and streaming on MediaWiki®''</div>
 
Now to get some animators, composers and we'll have the best anime—
 
And we went over budget.. nevermind.
 
=== Bordered title box ===
Suppose one of the memebers of the [[U.I.P]] contacted you to spread the word of the [[UIP Warehouse]] via a rectangular box, like an advert.
 
Explainatiom TBA
 
<div style="border: solid #737680; border-width: 10px 0px 10px 0px; background-color: #DCDCDC; margin: 10px 0; padding: 10px; border-radius: 10px;">
<div style="font-size: 1em; text-align: left;">
[[File:Warehouselargeview.png|150px|right]]
Need a consistent supply of materials?<br>
<b>The [[UIP Warehouse]] has you covered!</div>
</div>

Revision as of 11:28, 20 August 2024

It's recommended that you familiarise yourself with the wiki contribution guide before you read this subesection.
This page documents various tools that can be used to improve and decorate articles on this very wiki and other sites using MediaWiki.

HTML and CSS

<span style="">text</span> (inline/single-line) and <div style="">text</div> (block/multiline) is the primary method for advanced styling; for an in-depth look, see Manual:CSS on MediaWiki.

Large center title

As a potentially nonsensical example, suppose you want to make a large title for a fictional anime adaptation of RetroMC airing on OVH TV and MediaWiki. From the source of the fer page:

<div width=100% style="font-size: 45px;text-align: center;"><span style="color:#55FF55;">'''Retro'''<span style="color:#55FFFF;">'''MC'''</span></span>: The Legacy Community Adventures</div>
 <div width=100% style="font-size: 20px;text-align: center;">''Airing 24/7, on OVH® TV and streaming on MediaWiki®''</div>

In the first div, the width is set to 100% to make the text properly centered.
The text encased in triple-apostrophes are bolded.
The rest of the parameters should be self-explanatory; here's the result:

RetroMC: The Legacy Community Adventures
Airing 24/7, on OVH® TV and streaming on MediaWiki®

Now to get some animators, composers and we'll have the best anime—

And we went over budget.. nevermind.

Bordered title box

Suppose one of the memebers of the U.I.P contacted you to spread the word of the UIP Warehouse via a rectangular box, like an advert.

Explainatiom TBA

Need a consistent supply of materials?

The UIP Warehouse has you covered!