Sitesupport-url

From The Gemology Project
Revision as of 14:44, 26 March 2012 by Tim (talk | contribs) (Image link)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Editing

This page is designed to give you a quick 'go to' place whenever you need a bit of code to adapt to your own needs. If what you are looking for isn't listed here then please check this page out.

Header

In order to create headers like the one above, you place two equal signs around your title:

==Header==

Subheaders receive 3 equal signs

===Subheaders===

These headers will automatically result in a table of content (TOC) being displayed above the first header (like on this page). Keep in mind that this may be somewhere halfway down the page if this is where the first header is placed. If you don't want a table of content to be displayed you can add __NOTOC__ at the top of the page.

Widgets

In order to plug all kinds of external features such as youtube videos, google maps, vimeo videos etc etc into the wiki we use widgets. More information about widgets can be found here. Below are a few examples you will use a lot:

Iframe widget

With the iframe widget you can plug any other webpage into the wiki. Simply replace the url that is displayed here with that of the site you want to plug and adjust the parameters width, height and border to your liking.

{{#Widget:Iframe
|url=http://en.wikipedia.org/wiki/Diamond
|width=700
|height=400
|border=0
}}

Results in:

Book embedding Widgets

google books

This widget can be used to plug Google Books texts into the wiki. Here's how you do this:

1. Find a book you want to plug, let's say this book.
2. Copy the url: http://books.google.com/books?id=UmsDAAAAQAAJ
3. Then copy the bit behind 'id=': UmsDAAAAQAAJ
4. Paste that code in the widget shown below.
5. Define the width and height.

So that you get something that looks like this:
{{#widget:Google Books
|id=UmsDAAAAQAAJ
|height=750
|width=700}}

Results in:


archive.org

This widget is the the iframe widget mentioned above with its parameters adapted so that it makes full use of the width of our pages. It can be used to plug online books from archive.org into the wiki. Here's how to do this:

1. Find a book on archive.org. Let's say... this book.
2. On the book page on archive.org, click on 'read online' (top left). 3. Copy the url of the page that will pop up and paste it in the widget below:

{{#widget:Iframe
|url=http://www.archive.org/stream/historyofbigbona00wrigrich#page/2/mode/2up
|width=700
|height=700
|border=0
}}

This will result in:

Vimeo Video embedding

1. Go the to vimeo video you want to embed.

2. Copy the number behind vimeo.com/

3. Paste the number behind the 'id=' in the following widget:

{{#widget:Vimeo|id=20281170}}

Which results in:

Youtube video

Another widget is used for youtube videos. Here's how that works.

1. Copy the url of the youtube video you want to plug. This should look like this: http://www.youtube.com/watch?v=po19CNiUoI0.
2. Copy the bit behind the 'v=' which in this case is: 'po19CNiUoI0'
3. Paste that code behind the 'id=' in the following widget code:

{{#widget:YouTube|id=po19CNiUoI0}}

Which results in:

Links

Linking is one of the most important features of the wiki. There is two possible kinds of links: internal links that refer to other pages on the wiki, and external links which link to other pages on the web.

Here's the syntax for links in Mediawiki pages:

Normal internal link: [[Sapphire]], resulting in this: Sapphire

Internal link with alternative text: [[Sapphire|Alt Text]], resulting in this: Alt Text

Plain external link: http://www.external_links.com, resulting in this: http://www.external_links.com

External Link with alternative text: [http://www.external_links.com External link with alternative text], resulting in this: External link with alternative text

Image syntax

In order to display an image on a page you will first need to upload the image to the wiki. After that is done you can enclose the file name in the proper syntax. Here's an example of the normal image syntax:

[[File:Name|thumb|center|500px|Normal Image syntax]]

Let's look at each parameter:

[[File:Name.jpg|thumb|center|500px|Normal Image syntax]]

Adding '|thumb|' to the line of coding results in an image that is enclosed in a frame with the option of adding a description beneath the image.

[[File:Name.jpg|thumb|center|500px|Normal Image syntax]]

The second parameter determines the position of the image on the page. There is 3 possibilities: 'left', 'center' and 'right'.

[[File:Name.jpg|thumb|center|500px|Normal Image syntax]]

This number determines the size of the image. Our pages are 700px wide to give you a reference.

[[File:Name.jpg|thumb|center|500px|Normal Image syntax]]

The last parameter is the description text which will be displayed beneath the image when you use the thumb tag.

Here's an example of a thumb image:

[[Image:Tourm101.jpg|thumb|center|500px|Our logo]]

Which results in:

Our logo

Apart from thumbs you can also display images without a subscript:

[[Image:Tourm101.jpg|left|100px]]
[[Image:Tourm101.jpg|right|100px]]
[[Image:Tourm101.jpg|center|100px]]

Results in:

Tourm101.jpg
Tourm101.jpg
Tourm101.jpg


Image link

You can also turn an image into a link by adding the link=Page Name tag to the syntax:

[[Image:Tourm101.jpg|center|link=Tourmaline|200px]]

Which results in:

Tourm101.jpg

Whitespace & enter

Whenever you need a whitespace because you think things are too packed together you can use several <br /> tags. Each <br /> tag will equal one 'enter'.

Tables

For more information on tables, click here.

Here's some basic tables:

{|class="wikitable"
|-
!header
|-
|text
|text
|-
|text
|text
|}

Which results in:

header
text text
text text

A table with a header:

{|class="wikitable"
|-
!colspan="2"|header
|-
|text
|text
|-
|text
|text
|}

Which results in:

header
text text
text text

A table with width defined:

{|class="wikitable" width=80%
|-
|text
|text
|-
|text
|text
|}

Which results in:

text text
text text

Centering bits of text

You can center tables, text, widgets etc by enclosing it in between center tags: <center>text</center>
Resulting in:

text