Team:DTU-Denmark/How to customize an iGEM wiki

From 2011.igem.org

Revision as of 01:36, 19 September 2011 by Helge (Talk | contribs)

How to customize an iGEM wiki

Contents

Intoduction

  • WHY I MADE THIS PAGE
  • ADD YOUR OWN iGEM WIKI KNOWLEDGE

What are the challanges?

  • CENTRALIZING THE LAYOUT
  • STILL BEING EASY TO USE BY YOUR TEAMMATES

Using templates

  • THE TOOL FITS THE CHALLANGE
  • HOW DOES IT WORK

Styling the wiki

  • HOW TO ADD A STYLESHEET
  • TRICKS (GENERAL STYLING TIPS LIKE REDESIGNING THE TOP BAR AND REMOVING THE OGLY WIKI STUFF)

jQuery hacks

Remove all empty "<p></p>" tags

Annoyed of all those "<p></p>" and "<p> </p>" emerging everywere in your markup, distroying your layout by adding a bit of vertical space here and there?

They easily emerge when using templates or "<html></html>" tags. But fortunately they are just as easy to remove. All you need to do, is to paste in this code bit:

<!-- Remove all empty <p> tags -->
<script type="text/javascript">
    $(document).ready(function() {
        $("p").filter( function() {
            return $.trim($(this).html()) == '';
        }).remove()
    });
</script>

LaTeX equations

It is possible to enabled TeX in a MediaWiki ([http://www.mediawiki.org/wiki/Manual:Math Manual:Math]), but unfortunately it doesn't seem like iGEM has done that..

Another way to enable your wiki to display LaTeX equations, is to use [http://www.mathjax.org/ MathJax]. MathJax is a JavaScript file located at http://cdn.mathjax.org/mathjax/latest/MathJax.js, which reads your document after it has been loaded, and then changes the content of the document according to the notation. That is, it removes everything between any of the following delimiters...

\(...\)
$...$ (if configured)
\[...\]
$$...$$
\begin{?} ... \end{?}

...and replace them with equations. All you need to do is to add the following to your wiki tekst:

<!-- MathJax (LaTeX for the web) -->
<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

And if you want to use $...$ delimiters:

<!-- MathJax (LaTeX for the web) -->

<!-- This part is only if you want to use $...$ delimiters -->
<script type="text/x-mathjax-config">
    MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
</script>
<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

See [http://www.mathjax.org/docs/1.1/tex.html|MathJax documentation here]

I never managed to make "\label" and "\ref" work, but a non-tested version of the code, that enables the "\label" and "\ref" commands, can be found on GitHub. The issue is discussed here.