Help:Formatting

redirected from Help:HTML tags

Contents

Frequently asked questions

Basic formatting commands

How do I create a header?

Put the text of the header between two or more equals signs.

What it looks like What you type

New section

Subsection

Sub-subsection

==New section==
===Subsection===
====Sub-subsection====
  • Start with a second-level heading (==); don't use first-level headings (=).
  • Don't skip levels (for example, second-level followed by fourth-level).
  • A Table of Contents will automatically be added to an article that has four or more sections.
  • Clicking the at the top of the edit page will create a second level or Headline Text tag: ==Headline text== for you to use.

How do I start a new paragraph?

Just leave a blank line to start a new paragraph.

What it looks like What you type

This is paragraph 1.

This is paragraph 2.

This is paragraph 1.

This is paragraph 2.

How do I use bold, italics, or indentation?

To italicize a word, put it between 2 apostrophes (Note: although they appear similar, quotation marks do not italicize.). To make a word bold, put it between 3 apostrophes. To indent a paragraph, use a colon as the first character on the line. See table below for examples:

What it looks like What you type

italicized word

''italicized'' word

bolded word

'''bolded''' word
Indented paragraph.
:Indented paragraph.
  • You can also create Bold and Italic text by using the and the tabs at the top of any edit page.
  • Highlight the word or phrase you wish to change and click either of the tabs
  • To change text to BOTH Bold and Italic: Highlight the text and press the Bold tab and then with the text still highlighted press the Italic tab.
    • The result of using both would be: This text is Bold and Italic

How do I Center text?

What it looks like What you type
Center this Text
<center>Center this Text</center>

How do I Underline text?

What it looks like What you type

Underline

<u>Underline</u>

How do I Strike Through Text (Strikeout)?

What it looks like What you type

Strikeout

<s>Strikeout</s>


How do I change the Font Color and Size?

What it looks like What you type

Normal Font

Font Size

Font Color

Font Color and Size

Normal Font
<font size="+2">Font Size</font> 
<font color="red">Font Color</font>
<font color="red" size="+2">Font Color and Size</font>

Table of Contents?

Can I include a table of contents?
  • Any page with at least four headers of the same level triggers the table of contents (TOC) to appear just under any text before the first header.
  • If you want the table of contents to appear in a different place, type __TOC__ where you want it to be. You can also force it to the right or left of the page by typing {{TOCright}} or {{TOCleft}}. wikipedia page on formatting.

I don't want a table of contents. How do I remove it?

If you type __NOTOC__ anywhere on the page removes the table of contents. That's a double underline on either side of "NOTOC".

Organizing your page

Is there a maximum page length?

No. But the longer the page, the longer it takes to load. If you have a lot of data, you may think of dividing it up in sections and creating subpages. To create subpage, simply add a page in the chosen namespace using the name of the parent page followed by a slash followed by the name of the subpage. For instance, WeRelate talk:Watercooler/Archive 2007 is the subpage of WeRelate talk:Watercooler, note that there is a link at the top of the subpage to the parent page. However, you will then need to add a link on the parent page to the subpage.

Can I create subpages of my person and family pages?

Person and Family pages cannot have subpages in the same namespace. You can create and link to other types of pages to move content off of the Person or Family page. Some possibilities are: an Article page, a User subpage or a MySource page. Your choice may depend on the type of material.


What can I do to make my person and family pages more orderly?

If you have a lot of text, use headers and subheaders. See [discussion].

Can I control where the images appear on the page?

  • When you put an image in the text box, the system will arrange them in as efficient display as possible. This means that smaller images are often interspersed in the text. You can force the next line of text to appear below your image by typing
  • <br clear=all>

on a separate line under the image tag.

  • You can also position the image on the right, left or center by placing a bar after the image title followed by the position word. For instance: [[Image:title of image|left, right or center]].

How do I use Superscripts?

Type <sup> item </sup>

What it looks like What you type

This statement is attributed to1

This statement is attributed to<sup>1</sup>

How do I create a break (extra line)?

If you have a line of text you would like to force to the next line, use the <br> tag

What it looks like What you type

I want to force this text to the next line here
and let it begin on the next line.

I want to force this text to the next line here<br>and let it begin on the next line.

How do I include text without formatting (nowiki Tag)?

  • If you wish to include some text that includes WeRelate or HTML tags in your text use the <nowiki></nowiki> tag
    • You Type: If you use the <nowiki>[[Image:xxxx.jpg]]</nowiki> tag you can place an image on your page.
    • Result: If you use the [[Image:xxxx.jpg]] tag you can place an image on your page.
  • At the top of the editing page is an icon that will produce the nowiki tag for you: <nowiki>Insert non-formatted text here</nowiki>
    • Replace the text in the center with the text that you do not want to be formatted by WeRelate.

How Do I create References and Footnotes?

Method 1. [Preferred] Create Sources and Notes using the fields provided. Refer directly to Source Citations and Notes that you have already entered by using the ref tag: <ref name="S1"/> or <ref name="N3"/>.

Note that the Template:Cite method is now replaced by the ref tag, but you will still find it used on many existing pages.

{{cite|S1}}

Ref tag versus cite template: The ref tag is now preferred. Using the ref tag causes a link to be added next to the source or note in the references section that points back to the place in the text from which the reference is made. That is, next to the source in the "References" section a link would link back to the point in the text where you inserted the ref tag. The cite template does not do this. At present, both will renumber if a source or note number is changed due to removal of an earlier source or note. There is no guarantee that the template will continue to function this way in future redesigns.

Method 2. [advanced] Create individual footnotes within the note text by using <ref> tags. Sources or notes added in this manner become part of the list of sources and notes described above. This method can be used when one or all of a page's references refer to non-standard or multiple sources that do not easily lend themselves (or do not have) a Source page. Take a look at Person:Francis Cooke (2) for an example of this method if you wish to use it.

If you want to refer to multiple parts or pages of a source (defined using either method), use the format <ref>[[#n|name of source]], page(s)</ref> where n is the number of the source you wish to refer to. This method can be mixed with notes formatted using method 1.

Regardless of which method you use, you can control where your footnotes (as well as the Sources and Notes) will appear on the page using the <references/> tag.

  • You Type:

SomeText<ref name="headstones">According to headstones in Balou Cemetery</ref>
SomeMoreText<ref name="headstones"/>
DifferentText<ref name="obit">Obituary in Colorado City newspaper</ref>
=====Footnotes=====
<references/>

  • The Results:

SomeText[1] SomeMoreText[1] DifferentText[2]

Footnotes

  1. 1.0 1.1 According to headstones in Balou Cemetery
  2. Obituary in Colorado City newspaper

How do I sign my name to a comment in a talk page?

  • Put --~~~~ after your comment.
  • You can also press the icon at the top of the edit box.
What it looks like What you type

--Dallan 14:42, 24 March 2006 (MST)

--~~~~

How can I create Special Characters?

Lists, tables and templates

How do I create a list?

You can create either bulleted or numbered lists. To create a bulleted list, put a * as the first character on each line; to create a numbered list, put a # as the first character on each line.

What it looks like What you type
  • Item 1
  • Item 2
    • Item 2.2
  • Item 3
* Item 1
* Item 2
** Item 2.2
* Item 3
  1. Item 1
  2. Item 2
    1. Item 2.2
  3. Item 3
# Item 1
# Item 2
## Item 2.2
# Item 3

How do I create a table?

If you enter {| class="wikitable" |- ! header 1 ! header 2 ! header 3 |- | row 1, cell 1 | row 1, cell 2 | row 1, cell 3 |- | row 2, cell 1 | row 2, cell 2 | row 2, cell 3 |} You get:

header 1 header 2 header 3
row 1, cell 1 row 1, cell 2 row 1, cell 3
row 2, cell 1 row 2, cell 2 row 2, cell 3

For details see the excellent discussion on Wikipedia

How do I use a Template?

A template is a special wiki page used to copy text and images to multiple pages. You can use a template by typing {{the name of the template}} on your page. For instance, {{Welcome1}} is our welcome message to new users.


Links

How do I create a link to another WeRelate page?

  • To create a link to another WeRelate page, place the title of the wiki page within double brackets. You can follow the title with a | and some text if you want different text displayed in place of the title.
  • You can also click the tab at the top of the edit page to set up the internal link
What it looks like What you type

Place:Chicago, Illinois

Chicago

Colorado Research Guide

[[Place:Chicago, Illinois]]
[[Place:Chicago, Illinois|Chicago]]
[[Colorado Research Guide]]

How do I create a link to a location on the same page?

  • Wiki software automatically creates anchors for each title in a document, and each may be linked to by adding '#' before the text of the title in the link.
  • For Example: If you wanted to refer to the article above "How do I create a link to another WeRelate Page?" you would enter:
    • [[#How do I create a link to another WeRelate page?|Linking to another WeRelate page?]]
  • The result: Linking to another WeRelate page?
  • Anchor elements may also be created by using the id attribute in accepted HTML elements (eg. FONT, SPAN, etc.). The A element is not one of the accepted elements. The name assigned using the id attribute must be unique and not used by any other anchors in the document.
  • For Example: If you wanted to create an anchor at the beginning of the previous sentence, you could enter:
    • *<span id="myAnchor">Anchor</span> elements may also be created by using ...

How do I create a link to an external web page?

  • To create a link to an external web page, place the URL of the web page, followed by the text of the link, within single brackets. Don't forget the http://!
  • You can also click on the icon at the top of the edit page to set up an external link
What it looks like What you type

FamilySearch

[http://www.familysearch.org FamilySearch]

How do I create a link to Wikipedia?

To create a link to Wikipedia, type [[wikipedia:Title of page|Text of link]]. For example, to link to Wikipedia's main page, with the link appearing as the word "Wikipedia", you would type [[wikipedia:Main page|Wikipedia]]. It would appear on your page as Wikipedia. Note that the Wikipedia designator is not capitalized and there is no space after the colon (:).

An alternate Method:

  • Copy the link from the WikiPedia Page and paste it into an external link tag [ ]
    • The External Tag Setup: [http://en.wikipedia.org/wiki/Abraham_Lincoln Abraham Lincoln]
      • WikiPedia Link: http://en.wikipedia.org/wiki/abraham_Lincoln
      • Text you want to be visible on the page: Abraham Lincoln
    • Result: Abraham Lincoln

Redirecting

How do I Redirect a page to another page?

  • In the first line of the Edit Page type: #redirect[[Place:Indiana, United States]]
    • The text between the double brackets is the page you want the current page Redirected to
  • MUST be the first line in the Text area for this command to work
  • For detailed directions see the Redirect Help Page
  • Another use: Creating an alternative Place Name for a page

Caution: everything on the redirected page is lost! Make sure you move information unique to the redirected page over to the surviving page.

Images

How do I include images on a page?

  • First you need to upload the image. Please make sure that you are not violating someone else's copyright when you do so.
  • Once you've uploaded the image, refer to it using an Image or a Media Link
    • Image Link i.e. [[Image:WeRelate.gif]] will place a copy of the image on the page as shown below
    • Media Link i.e. [[media:WeRelate.gif]] will place a link to that image on the page as shown below
  • You can also use the Image button or the Media button at the top of the text edit screen to produce the Image and Media tags for you. **Simply replace the "Example.xxx" with the name of your image file
What it looks like What you type

Image:WeRelate.gif

[[Image:WeRelate.gif]]

Media:WeRelate.gif

[[Media:WeRelate.gif]]
  • For more information concerning Images such as Preparing them for upload, how to upload, Annotating, placing them on a page and creating an image gallery see: the Images Tutorial
  • To learn advanced image formatting techniques, visit the Wikipedia Image Formatting page.

HTML tags

HTML vs. WeRelate Tags
  • Some HTML tags can be used on WeRelate pages, but for the most part it is quicker to use the WeRelate tags.
  • HTML tags which do not have WeRelate counterparts are shown and described on this page.
  • Below are examples of two tags both in HTML and WeRelate format to show the comparison
What it looks like WeRelate Tag HTML Tag

Bold

Italic

'''Bold'''
''Italic''
<b>Bold></b>
<i>Italic></i>
Unusable HTML tags

The following tags should not be used in wiki pages:

  • pre Tag <pre> </pre>
    • A pre tag just indents the first line of a paragraph
    • Starting a line with one or more spaces does exactly the same thing as the pre tag
      • it indents the first line of the paragraph.
  • Link Tag <a href="http://www.google.com">googl</a>
    • Not sure why the Wikipedia parser excludes this tag, but it does, and since we use the same parse as Wikipedia, we exclude it too.
    • Use a WeRelate External Link Tag: [http://www.google.com google]
    • Result: google
  • Image source link <img src="xxx"/>
    • Use a WeRelate External Link Tag: [http://www.werelate.org/w/skins/common/images/new-wr-logo.gif New WeRelate Logo]
    • Result: New WeRelate Logo

Where can I learn additional formatting techniques?

You have several options:

  • If you like to learn by example, you can go to a page that has a format (table, list, heading, etc.) that you would like to use and click on the Edit (or View source) link at the top of that page to see how that page is formatted.
  • You can practice and share your formatting techniques in the Sandbox.
  • If you'd like to learn about more advanced formatting techniques such as tables, see Wikipedia's excellent article on formatting.
  • If you have questions that aren't answered by this page, please send an email to dallan@WeRelate.org.
  • Regardless of how you learn, use the Show preview button as you're editing the page to experiment with different formatting options.

Related pages

Fundraiser
Help fund new features!