Editing Wikitext/Emphasis and Links

From Wikibooks, open books for an open world
Jump to: navigation, search
 
Normal Text
Italic text
Boldface text
Boldface and Italic
Underlined text
Emphasis.GIF
 

Emphasis and Links

Wikitext is simple and easy to learn. Beginners can produce quite useful pages in a very short time. It is true to say, that compared with some other languages, wikitext lacks power in design and layout, but for sheer ease of use it is hard to beat. Advanced users are able to mix Wikitext, HTML and inline styles to create beautiful and expressive pages, and to some extent have overcome its shortcomings.

By far the most frequent formatting task that the web-writer performs is the application of text emphasis. That is to say, the adding of typographic emphasis, as opposed to the stylistic emphasis of the work. In addition, a knowledge of how to make hyperlinks is today commonplace, and both emphasis and linking are explained below. Readers who need more advanced material should follow the links within the page.


Text Emphasis

Like in HTML, you can make your text bold and italic. However, in Wiki the syntax is quite different.

Making Italics

To make text italic, you place two single quotes on each side of the text. For example, if you write this;

''Wikibooks are great !''


you will get this:

Wikibooks are great !


Making Bold Text

To make bold text that will stand out from your text, you put three single quotes around the text. Again, if you write this;

'''Wikibooks are great !'''


you will get this:

Wikibooks are great !


If you want to make your text bold and italic at the same time, put five (3 + 2) single quotes on each side of the text. If you write this;

'''''Bold and italic stands out too !'''''


you get this:

Bold and italic stands out too !

Underlining Text

Underlining text is not strictly an emphasis matter, but it is a related method.

To make any part of your text underlined, the best way is to add a pair of HTML tags to the text. The tags can be used in combination with the other emphasis methods by nesting them. If you write this:

The <u>underlined</u> part gets attention.


You get this:

The underlined part gets attention.


And we can mix these methods like this - if you write the following:

The ''Emphasis of '''text <u>is</u> important.''' ''


You get this:

The Emphasis of text is important.


Sub and Superscripts

At times it is useful to place a smaller letter above the other text or below it. The former is called a superscript and the latter a subscript. Both find use in marking work with reference numbers; numbers that relate to lists at the end of a page where fuller details can be found. Any text could be added in this way.

The code to produce these out-of-line effects is made with the HTML tags <sup> and <sub> respectively. The following code shows what to type and gives the result of doing so.
If you type either of these:

Sample text<sup>321</sup>

Sample text<sub>123</sub>

The results look like this:

Sample text321

Sample text123

Superscript and subscript tags are often added to the text intended to be displayed as hyperlinks, so that the displayed reference number can be selected to go directly to another page.


Drop Capitals

D

rop capitals add emphasis to text, in that they draw the eye to the start of a section. They often find application where there is no formal heading style in use. In the past they have been found mainly in art works though the rules for their use are by no means clear. There is no general wikitext code to insert a drop capital, but there is a template.

The first character of the preceding paragraph has an example of a drop capital, and the box below shows what to type in the editing window to make it work:

{{drop|D}}rop capitals add emphasis to text...

Notice that the whole template code is enclosed in double curly brackets, and the idea is to make a drop capital from the first letter of the paragraph, the letter 'D'. The name of this template is Drop, and this name comes first in the brackets; then there is a pipe symbol separator; then the letter to enlarge comes next. Notice that the follow-on text is written hard against the closing brackets; do not leave a space. If the next character is a space, just ignore it and close-up to the first non-space character; this avoids layout problems.

Finding the pipe symbol can be difficult on some keyboards, and it is often found on a different key than the one indicated. In case of difficulty, it is included in a selection of symbols to be found at the foot of every editing page.

Emphasis Summary

There are other results to be had by adding quotes, (apostrophes), though they merely serve to place the results already mentioned into parenthesis. It is perhaps interesting to note that getting bold or italic text into double quotes on a page is not among these examples. Refer to the table below for a summary of the useful emphasis options.

Wikitext Apostrophe Code for the Emphasis of Text
Wikitext Result HTML Equivalents Description
'Text' 'Text' 'Test' parenthesis uses one set of quotes
''Text'' Text <i>Text</i> italics use two sets of quotes
'''Text''' Text <b>Text</b> bold uses three sets
''''Text'''' 'Text' <b>'Text'</b> bold-in-quotes uses four sets
'''''Text''''' Text <b><i>Text</i></b> bold-italics use five sets
''''''Text'''''' 'Text' <b><i>'Text'</i></b> bold-italics in quotes uses six
'''''''Text''''''' ''Text'' <b><i><nowiki>''Text''</nowiki></i></b> bold-italics in double quotes uses seven


Making Hyperlinks

Pages have blue links in them, sometimes called hyperlinks. They allow users to click them with the mouse to go to the linked pages, and knowing how to set these links in a page can add useful content to the work.

The blue text can say anything; it does not need to have the same wording as the link address. There are two variations of links; one is an external link, and the other is an internal link.

  • External means on an outside website, for example, Google, Wikipedia, etc., where the server's address is different to that of Wikibooks.
  • Internal means under the same Wiki project. Here it means belonging to the WikiBooks server and its folders.

Although external links always use the full web address, internal links need only a short address. In fact, one way to make internal links uses a full local path, the path that complements the front end address below.

Wikibooks addresses for pages can be found from the address bar at the top of any browser, and the front end of all of our Wikibooks addresses will be found to start with:

http://en.wikibooks.org/wiki/


In Wikibooks, the folder that follows such a front end will contain the so-called home page, (e.g. Bicycles), and pages beyond the home page will be found in its sub-folders. Refer to Figure 1 for a file tree that shows a typical folder structure. It is as well to mention, for those who are more familiar with command-line paths, that for fully-expressed external links, it is only necessary to access the containing folders of html pages, and not the html files themselves; the files within these folders are set to open by default when the folders are accessed. The folders have the same names as the default html pages within them. Also, for all web addressing, folder separators are forward-slashes (/), not the the back-slashes (\) of the command-line.

This section shows the simplest ways to make effective page links (anchors), that will always work, both external and internal, and gives some notes on shortened addressing methods for those who prefer them.

External Links

To make an external link to another website from any page location, just enclose the full URL address of the site in single square brackets. The browser's address bar gives the full address to use in this case, so confusion rarely results. For example, to make a link to the Google search page somewhere in this Emphasis and Links page, use the following Wikitext:

[http://www.google.co.uk/]

This gives a link that looks like this:

[1]

Notice that there is a blue link and that there is a symbol with a number. You can check that the link works by clicking it. The number is there because the program was not told what text should be displayed for the link. You can have any text in place of the number by adding it after the URL; separate the two with a single space. In addition, it is as well to note that this added text can be formatted with Wikitext or HTML in the usual ways. For example, to make the text for the link say 'Google Search Engine', and to set it in italics at the same time, write the following:

[http://www.google.co.uk/ ''Google Search Engine'']

Now the link looks like this:

Google Search Engine

It will have occurred to some that an external link could be made even for internal pages, since every wiki page has a fully expressed URL address. This is indeed the case, and some resort to it when their internal links fail. However, it is better to use internal links within the server domain, since their use involves less work for the system.

It might be of interest to know that internal links are converted to fully expressed URL's before the wiki software sends the HTML source code to each browser, and that the notion of relative addresses for internal page links is essentially an in-house convenience.

Finally, it is possible to link not only to a page, but to go directly to a section within a page. This is done by adding the text of the section heading at the end of the address, separated by a hash sign. For example, to go directly to the Links and URLs section heading of Wikipedia's How to Edit a Page, use the following Wikitext:

[http://en.wikipedia.org/wiki/Wikipedia:How_to_edit_a_page#Links_and_URLs ''Links and URLs'']

Now the link becomes this:

Links and URLs


The above examples summarize the methods for making fully-expressed external links, and in the next section can be found a fairly foolproof method for making internal links.



Bikefiletree.png
Fig 1: Folder path for the internal links.

Internal Links

By far the most common task for an internal link is to link to another WikiBooks main page, sometimes called a home page. Refer to the folder tree in figure one. Notice that the address at the top of the tree is the Wikibooks front-end or root address, and that the first folder after that is called Bicycles. The Bicycles folder contains the home page of the bicycles subject, that opens by default when the folder is opened, and all other bike pages can be found below that in the folder tree. To make a link to any home page within WikiBooks just write the name of the page that you want to go to, the destination or target page, in double square brackets. The text to appear on the link in blue text, is added after the name, separated with a pipe symbol. Thus, a link to Bicycles made in this way in any WikiBooks page looks like this:

[[Bicycles|''Bikes'']]

And this is the result:

Bikes


To continue with the Bicycles folder tree, but where the required link is to a page deeper in the Bicycles file tree, (again, from any page in Wikibooks), we simply extend the folder path to include all of the folders up to and including the one that holds the page of interest; Consider a link to Adjusting brakes; it looks like this:

[[Bicycles/Maintenance_and_Repair/Brakes/Adjusting_brakes|''Adjusting Brakes'']]

And this is the link that is produced:

Adjusting Brakes


In general, it is true to say that an effective internal link can always be made by writing a folder path from the external address's home page onwards; that is, from the folder that follows the wiki folder. Compare the full external web-page path below against the internal path that starts from the home folder Bicycles to see that this is so:

[http://en.wikibooks.org/wiki/Bicycles/Maintenance_and_Repair/Brakes/Adjusting_brakes]

[[Bicycles/Maintenance_and_Repair/Brakes/Adjusting_brakes]]


Moving on, it is possible to link directly to a page section, by adding the text of the section heading separated by a hash symbol. For example, this example makes a link directly to the Block Clearance section.

[[Bicycles/Maintenance_and_Repair/Brakes/Adjusting_brakes#Block_Clearance|''Bicycle Brakes' Block Clearance'']]

And this is the link that is produced:

Bicycle Brakes' Block Clearance


Within the Page

A common task is to link to another point within the same page. Experiment will show that an internal section link of the kind shown above is the best way to make it. For example, the code for a link to show somewhere on this page, that will go directly to the section Making Italics is written as:

[[#Making Italics|''Making Italics'']]

And it makes this link:

Making Italics


Filetreeinternal.gif
Fig 2: Folders used for the dot-slash examples

Using dot-slash

The full-folder form of the internal link is discussed in an above section, and such addressing methods will always be able to make an effective link. At times there is a dot and forward slash notation used to make internal links, and these are further examples of relative addressing, in as much as they can sometimes make do without the directory name, and are stated with respect to the page that contains the link. The stated advantage of relative addressing is that a directory name might be changed without having to rewrite the link. In WikiBooks however, pages are usually redirected rather than renamed, so the examples below are more to explain the use of such notation as opposed to fulfilling any essential need.

The coding of internal links depends on where the target page is in the file tree. compared to the page that is to hold the link. There are three such scenarios using dot-dash notation, as opposed to the conventional methods:

On the same branch but at a lower level.
On the same branch but at a higher level.
In the same tree but on a different branch.

Target lower on the same branch

Refer to the drawing of the file trees. Assume that the object is to make a link on the page Emphasis that goes to the page Italics. There are two ways to do this; the first is to use the foolproof method, using the whole internal folder path that follows the wiki folder, like this:

[[Text/Emphasis/Italics|Italic Text]]

and the second way is to write the internal address relative to the page that will hold the link, like this:

[[/Italics/|Italic Text]]

This shortened version is preceded by a forward-slash; this means in this format, go to the folder that contains this page. In this case, this page means the page with the link, Emphasis. Then the forward path from there is expressed, up to and including the folder that will be accessed. The path is closed with a forward-slash.

Target higher on the same branch

Refer to the drawing of the file trees. Assume that the object is to make a link on the page Bolding; the page to go to is Text. This time the directory is two levels higher, (towards the root), than the page to hold the link. The notation with two dots followed by a forward-slash means; go back to the previous directory; thus, we need two sets of these to go to the Text level.

Use the Wikitext:

[[../../|Text]]


Note that a full internal address would function just as well in all of these cases.

Target on another branch of the same tree

Refer to the drawing of the file tree in figure two. Assume that the object is to make a link on the page Underlines; the target address is to be Tables. These are on different branches. The path needs to be described starting from the main Text home page but that page is two levels higher. Use the dot notation again to denote a shift to the home page, followed by the rest of the path to Tables

Use the Wikitext:

[[../../Tables|All About Tables]]



These examples show how the dot-slash notation is used. Even if the folders described in these links change their names, then provided that their relative positions stay the same, the links will still work.



Other Pages