Advanced Wiki Formatting

Overview ¶ 

Below are some of the more specialized commands you'll need to make your wiki more dynamic.

Images ¶ 

Usable in: Category Pages, Guides (Only in the Introduction field), Item Pages, and Wikis.

Images can be clearer, quicker, and easier to use than a wiki with text only. You can add images to both Answers posts and wiki articles. Simply position the text cursor in the wiki text where you want the image tag to go, then drag the image from your Media Manager's library onto the wiki editing text box or Answers post. Doing so copies the image identifier automatically and inserts a basic image tag.

That's the easiest way to add images, but if you'd like to do it manually, follow these instructions instead: Drag an image from your library into the "Image Manager" box in the sidebar and hover over the image to get the image identifier. Once you have the identifier, you can manually add the tag (see format below) to the wiki text.

For Wiki Articles and Answers Posts ¶ 

You can use wiki syntax to alter many aspects of how pictures are displayed. To add more than one formatting element to a picture, simply add a pipe | between them.

Basic Image Tag ¶ 

To use wiki syntax to alter images, begin with the image tag.

[image|imageid]

In this tag, “imageid” is the number that our system assigns to an image when you upload it into the Media Manager.

This image tag is the only part of the wiki syntax required to make the image display. Any additional wiki syntax is used only to modify how the image is displayed.

Image Alignment ¶ 

You can use wiki syntax to change the alignment of an image on the page. If you do not specify an aligntment the image will automatically align to the right.

For example, to make a picture show up in the center of a wiki article, you would use the code:

[image|125525|align=center]

It would then appear as below:

Block Image
Image Size ¶ 

You can use wiki syntax to alter the size of an image. If you do not specify the size of the image, it will go to the default size.

For example, here is the code for a picture that is medium sized:

[image|125525|size=medium]
Image Captions ¶ 

Wiki syntax can be used to create a caption field below an image.

You can add captions to your images using the following wiki syntax:

[image|125525|caption=This is an example]

You can make images link to an internal or external site using the wiki syntax:

[image|125525|link=www.example.com]

If you would like to open image in a new window, use the following wiki syntax:

[image|125525|link=www.example.com|new_window=true]

The following wiki syntax includes all of the possible syntax that you can use to modify an image:

[image|<id>|size={standard,medium,original}|align={left,right,center}|caption=<text>|link=<url>]

Videos ¶ 

Usable in: Category Pages, Guides (Only in the Introduction field), Item Pages, and Wikis.

Currently, we support embedded videos from Vimeo, YouTube, and Screencast.

The only thing better than pictures are moving pictures. You can add videos to your wikis (but not guides, presently). The format for videos is similar to that for images; but rather than identifying videos by a numeric identifier specific to your site, you identify them by a link to the video on the service where the video is hosted (e.g. Vimeo). So to add a video to a wiki article, you just need to duplicate wiki syntax that looks like the following:

[video|<link to video>|size=small,large|align=left,right,center]

As with images, the size and align specifications are optional, but for videos they default to large and center respectively. You can add a caption to a video, but the formatting is different than that for images. Consequently, you can add wiki markup to the caption text. Here's an example use of the video tag, complete with caption text that includes a link:

[video|http://vimeo.com/6659283]A video about [http://ifixit.com|iFixit].[/video]

Note that without a caption, there's no closing [/video] tag, but that to provide a caption, a closing tag is added and the caption text is nested between the opening and closing tag.

Screencast Embedding ¶ 

You'll need to do a little extra work to embed videos from Screencast. You can't just copy and paste the URL for a Screencast video, because the URL to view a video on the Screencast site is very different from the URL to embed the same video. The URL you need is the last one in the big block of text you'll get if you copy and paste the Embed on your page HTML. It should look something like:

http://www.screencast.com/users/.../<long identifier>/embed

Copy that URL and paste it as the appropriate field of the wiki syntax below:

[video|http://www.screencast.com/users/.../<long identifier>/embed]

Escaping Wiki Formatting ¶ 

Usable in: Category Pages, Guides (Only in the Introduction field), Item Pages, and Wikis.

There are times when wiki syntax can get in the way of your explanations. It might happen when you are explaining code or if your particular text stylings include characters that our formatting interprets as a wiki syntax command.

Don't start pulling our your hair out just yet. You can escape wiki formatting. When you do, whatever you type into your editing page will appear "as is" on your wiki page. There are two primary methods for escaping wiki formatting: raw and code.

Raw ¶ 

In all likelihood, you'll rarely need [raw], but we like to prepare you for just about everything. [raw] is typically used to include text that would normally be treated as special wiki formatting.

So, let's say that you (for some ungodly reason) want to wrap a word or phrase in two plus signs: ++insert reason here++ . Normally, wiki formatting would translate those double plus signs as a command to underline the word. [raw] prevents the wiki from making those changes.

To use it, just wrap text with a [raw] tag, like so: [raw] "your text goes here" [/raw]. Now, your text won't be interpreted as part of any wiki markup.

As a note, [raw]text doesn't take on a monospace typeface, as it does in code formatting (explained below). The purpose of [raw] is merely to escape wiki formatting. Monospace formatted text looks cool, but technically does not escape wiki formatting. If you'd prefer monospace text to [raw], just wrap your text in backquotes in the following manner: ``...``.

Code ¶ 

You'll probably rely on [code] more frequently. Using[code]leaves your text untouched by wiki formatting, but it also displays text as monospace within a discrete block—that makes [code] especially useful for examples of actual code. Still, [code] has many different applications. We've used [code]throughout this page to enclose examples of wiki syntax in blocks.

To use [code], simply enclose your text in [code]...[/code]. Below is an example of how to add those tags:

[code]
At its heart, Automotive Right to Repair is about consumer choice. As an owner, you should have the right to repair your car wherever you want: at the manufacturer repair center, at the trusty corner mechanic, or in your driveway.
[/code]

Comments ¶ 

If you ever find the need to leave notes for your fellow editors, you can easily do so with the [comment] tag. For example:

Text that will be rendered
== Header that will be rendered ==

[comment]This is a note to my fellow editors, this will not be rendered on the page.[/comment]

Anything within the comment tags will not appear on rendered wikis, but will still appear on Edit pages.

Dynamic Lists ¶ 

Usable in: Category Pages, Item Pages, and Wikis.

Before we delve into creating dynamic lists, you must first understand what they are and how they function. A dynamic list is essentially an incomplete list; and because it's incomplete, you can keep adding items onto it. A dynamic list searches through material on the site looking for tags that are relevant to the list. It then groups all of the documents together in list form.

For example, let's say you've created guides of varying difficulty levels, but you want to display all the easy guides together on a category page. You can do that with a dynamic list. Simply add a tag on the guide's editing page. Type "easy" into the guide field and click add. Once all the related guides are tagged with the same identifying tag, you can create dynamic lists of step-by-step guides on any wiki page, like a category page.

You can add a title to both wikilists and guidelists by adding |title=Title of List to the tag.

You'll need the following information to create a dynamic list:

  • Tag
  • Item
  • Guide type

Use the example code below to create your own dynamic list. Simply insert your own information into the appropriate fields:

[guidelist|tag=easy|type=howto]       
[guidelist|item=iPhone 3GS|type=howto|title=iPhone 3GS Guides]

You can also create lists of wiki pages. Just add a comma-separated list of tags after the vertical bar, as in the following examples:

[wikilist|robotics]
[wikilist|robotics,technique]
[wikilist|robotics|namespace=Item]
[wikilist|robotics|title=Robotics]

You can see Dynamic Lists in action on our demo site Gunner Automotive.

Note: Wikis and guides must be public to show up in their respective lists.

Linking an Email Address ¶ 

If you need a mailto link to a specific email address, you can use the mailto wiki syntax. Mailto links will open with your computer's default email client.

[mailto|email@example.com]

Redirect a Page ¶ 

Use the Redirect tag to display information from one page to another page of the same type.

For example, if you would like to see the information from Category A displayed on Category B, you would put the following wiki syntax on Category B's page:

[redirect|Category A]

Go back to the Help Index

Was this article helpful to you?
Yes
No
Didn't find the answer you were looking for? Ask a Question