Special

edit

MediaWiki markup

edit

I have also used my MediaWiki knowledge professionally by creating Wiki-content for a number of international companies, including BUPA, and SOPHOS based on the markup samples.

File templates

edit

Pseudo 'pre'

edit

{| style="margin:4px 0px 0px 0px; width:100%; background:none;"
| style="width:100%; border:1px solid #ddcef2; background:#faf5ff; vertical-align:top; color:#000;"|
{| cellpadding="2" cellspacing="5" style="vertical-align:top; background:#faf5ff; color:#000; width:100%"
! <h2 id="mp-tfp-h2" style="margin:0; background:#ddcef2; font-size:120%; font-weight:bold; border:1px solid #afa3bf; text-align:left; color:#000; padding:0.2em 0.4em">Knowledgebase Article Contributor of the month</h2>
|-
| style="color:#000;"| {{kac {{CURRENTYEAR}}-{{CURRENTMONTH}}}}
|}
|}

Tooltip

edit

This is the ...

After ...
stylesheet
Tooltip text 1 ...
... When ...
BOX
Tooltip text 2 ...
should appear showing additional text.
By Category
PSDV,
Platform, Storage, Database, and Virtualisation
CCCM,
Communication, Content Management, Collaboration, and Mobility

Go

Back

The following uses CCS hover to create hotspots with pop-up 'tool-tip' in an HTML page. The HTML can eaisily be converted to MediaWiki markup to get the same result.

<style>
.maptext
{
  font-family:arial;
  font-size:8pt;
  color:blue;
}
.maptext a:hover
{
  text-decoration:none;
  /*padding:0px 4px 0px 2px;*/
  /*background-color:#FFFF80;*/
}

/* hide 'maptext-info' text by default */
div.maptext div.maptext-info {
  display:none;
}

/* the attributes of the 'maptext-info' */
div.maptext:hover div.maptext-info {
  z-index:10;
  display:block;
  position:relative;

  top:-55px;
  left:10px;

  width:200px;
  height:50px;

  border:1px solid black;
  background-color:#FFFFAF;
  padding: 2px 4px;
} 


</style>


<div style="position:relative;"><img src="customise-this.png"></div>

<!-- Place0 -->
<div style="position:absolute; width:181px; height:27px; left:32px; top:166px; background-color:pink; border:1px solid black; opacity:.4;"></div>

<div class="maptext" style="position:absolute; width:177px; height:23px; left:34px; top:168px; border:1px dashed black;">
  <div class="maptext-info">Click and select a new 'Standard', or 'Custom' location for first-item on the <a href="the-placesbar.html"><b>PlacesBar</b></a></div> 
</div>

<!-- Place1 -->
<div style="position:absolute; width:181px; height:27px; left:32px; top:196px; background-color:pink; border:1px solid black; opacity:.4;"></div>

<div class="maptext" style="position:absolute; width:177px; height:23px; left:34px; top:198px; border:1px dashed black;">
  <div class="maptext-info">Click and select a new 'Standard', or 'Custom' location for second-item on the <a href="the-placesbar.html"><b>PlacesBar</b></a></div> 
</div>

<!-- Add Button -->
<div style="position:absolute; width:54px; height:26px; left:218px; top:197px; background-color:pink; border:1px solid black; opacity:.4;"></div>

<div class="maptext" style="position:absolute; width:50px; height:22px; left:220px; top:199px; border:1px dashed black;">
  <div class="maptext-info">When enabled - click the 'Add' button to add a Registry Key Value for the second-item on the <a href="the-placesbar.html"><b>PlacesBar</b></a></div> 
</div>

Maps

edit