Skip to content

16.06 PracticalSeries Wiki conventions

mgledhill edited this page Mar 13, 2025 · 12 revisions

PAL Logo showing Wiki Documentation heading

16.6SpacerSidebar

The PracticalSeries sidebar is primarily a navigation bar and a table of contents (TOC) for the Wiki. It looks like this:

Sidebar format
Figure 16.17 — PracticalSeries sidebar format

It is made up of five parts:

Title bar and storage location badge
Navigation bar
Main table of contents
Table of contents for the appendices
A link to the bottom of the page (end of page link)
List 16.17 — Sidebar components

Each of these is examined in turn in the following sections.

⬆️ Top



16.6.1SpacerNames and locations of the sidebar files

The PracticalSeries Wiki pages all have a unique sidebar page (the exceptions being the CaseNotes and Licence pages which share a sidebar page).

Every sidebar has its own Markdown file called: _sidebar.md

The only thing that differentiates one sidebar from another is the location (folder) where it is stored. This was explained full in section 4, but a brief recap is given below.

The PracticalSeries folder structure has a separate folder of each page in the Wiki, the folder and page name for this section being:

   16-0000/16 PracticalSeries Wiki conventions.md

It is in the folder 16-0000; if a file called _sidebar.md is present in the same folder, then GitHub will display that _sidebar.md file as the sidebar for any Wiki page in that folder (in this case: 16 PracticalSeries Wiki conventions.md).

If there is no _sidebar.md file in the folder, it will display the _sidebar.md file that is in the root folder (where the Home.md page is)

So that’s it, every page in the Wiki lives in its own folder (see section 3 and section 16.2 for full details) and each of these folders has an _sidebar.md file that is the sidebar for that particular page.

⬆️ Top



16.6.2SpacerSidebar title and location badge

This is the first entry for every _sidebar.md file. The title is always the same for every sidebar:

     ${\large \color{#446FBD}\text{Wiki\ contents}}$

Also on this line is a badge that has the folder name that contains the _sidebar.md file:

Sidebar title and badge
Figure 16.18 — Sidebar title and badge

Note

The pencil icon is created by GitHub and allows me to edit the sidebar

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

### Wiki contents<img width="107" height="1" src="https://psop.uk/wi-s" alt="Spacer"><!-- LOCATION BADGE --><img height="15px" src="https://img.shields.io/badge/loc-06--0700-808080">

Table 16.37 — Sidebar title and location badge

It is a standard Markdown level 3 title (3 hashes, see section 6.10) with the text: Wiki contents.

This is followed by spacing image (107 pixels wide by 1 pixel high), see section 11.4. this creates the gap between the title text and pushes the badge to the right-hand side of the sidebar.

The badge is a Shields.IO badge, it has the label loc followed by the folder name where the sidebar.md file is located, in this case it is the folder 06-0700, this is written in the badge URL as 06--0700, the double dash being an escape code to display a single dash, see section 15.2. The number 808080 is the light grey background colour for the badge

⬆️ Top



16.6.3SpacerNavigation bar

The navigation bar has the following appearance:

Navigation bar
Figure 16.19 — Navigation bar icons and meaning

This navigation bar is exactly the same as that discussed in section 15.1 and I refer you there for the details of its construction.

⬆️ Top



16.6.4SpacerTable of contents

The table of contents is the same for every sidebar (they all have a full table of contents for every page in the Wiki). The only difference being that the TOC associated with the chapter of the current page is shown opened, this is the sidebar TOC for chapter 1:

Sidebar TOC
Figure 16.20 — Sidebar TOC

The chapter 1 TOC is open (collapsible arrow pointing down), all other chapter TOCs are closed (collapsible arrow pointing right).

Obviously, the TOCs are different for different Wikis, however, the general appearance of the TOC is consistent, the heading text all lines up for example.

Each line of the TOC has indentation to separate the chapter/section/division numbers from the text, it can be seen here:

TOC indentation
Figure 16.21 — TOC indentation

The indentations are designed to allow the widest number: cc.ss.dd, all with double digits to fit in the gap before the section and division headings. Chapter headings are less indented. The whole thing has a symmetrical and pleasing appearance.

The following Markdown examples cover all the various types of TOC:

Unnumbered heading without collapsible content (like Home and CaseNotes in the above image)
Unnumbered, collapsible TOC (like Licence in the above image)
Single digit chapter, collapsible (like chapter 1 in the above image)
Double digit chapter, collapsible (as above but with at two-digit chapter number)
List 16.18 — Types of TOC

Taking each in turn:

In all these examples the following definitions are applied

Item Definition
${\large \color{#B00000}\text{page}}$ The Wiki page name in link format (section&9.2.1)
${\large \color{#4B0082}\text{Heading}}$ The Wiki heading name in link format (section 9.3.1)
${\large \color{#1F883D}\text{0…}}$ The heading number (displayed text)
${\large \color{#1F883D}\text{Heading…}}$ The heading text in plain English (displayed text)
${\large \color{#404030}\text{SECTION NAME}}$ Comment field, should contain the section name or number
Table 16.38 — TOC common elements

⬆️ Top





Unnumbered, non-collapsible TOC     

Unnumbered, non-collapsible TOC
Figure 16.22 — Unnumbered, non-collapsible TOC

The Markdown is:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<!--          [SECTION_NAME] 🟢🟢🟢 UNNUMBERED, NO COLLAPSE -->
&emsp;&emsp;&ensp;&thinsp;&hairsp;<a href="./page"><!-- HEAD -->Heading_Unnumbered_noCollapse</a>
<!--                         🟩🟩🟩 -->

Table 16.39 — TOC entry: unnumbered, non-collapsible

The following is a worked example for the home page:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<!--          [CASENOTES]    🟢🟢🟢 UNNUMBERED, NO COLLAPSE -->
&emsp;&emsp;&ensp;&thinsp;&hairsp;<a href="casenotes"><!-- HEAD -->CaseNotes</a>
<!--                         🟩🟩🟩 -->

Table 16.40 — TOC entry: unnumbered, non-collapsible example

⬆️ Top





Unnumbered, collapsible TOC     

Unnumbered, collapsible TOC
Figure 16.23 — Unnumbered, collapsible TOC

The Markdown is:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<details><!-- [SECTION_NAME] 🟢🟢🟢 UNNUMBERED, COLLAPSIBLE -->
<summary>&emsp;&ensp;&nbsp;<a href="./page"><!-- HEAD -->Heading_Unnumbered_Collapsible</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Heading](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Heading](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Heading](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Heading](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Heading](page#heading)<br>
</details><!--               🟩🟩🟩 -->

Table 16.41 — TOC entry: unnumbered, collapsible

The following is a worked example for the Licence page:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<details ><!-- LICENCE       🟢🟢🟢 UNNUMBERED, COLLAPSIBLE -->
<summary>&emsp;&ensp;&nbsp;<a href="licence"><!-- HEAD -->Licence</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[The licences and other details](licence#the-licences-and-other-details)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[The Licence](licence#the-licence)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Why did I choose the MIT Licence?](licence#why-did-i-choose-the-mit-licence)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Permissive licences](licence#permissive-licences)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Copyleft licence](licence#copyleft-licence)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Limiting liabilities](licence#limiting-liabilities)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[Which licence to use?](licence#which-licence-to-use)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[A note on spelling: licence or license](licence#a-note-on-spelling-licence-or-license)<br>
</details><!--               🟩🟩🟩 -->

Table 16.42 — TOC entry: unnumbered, collapsible example

To make the list default to open replace <details> with <details open>.

⬆️ Top





Single digit chapter, collapsible TOC     

Single digit chapter TOC
Figure 16.24 — Single digit chapter, collapsible TOC

The Markdown is:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<details><!-- [SECTION_NAME] 🟢🟢🟢 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">0<!-- NUM -->&ensp;&nbsp;&nbsp;&thinsp;<!-- HEAD -->Heading_Chap_1_Digit</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[0.0&emsp;&emsp;&nbsp;&nbsp;&thinsp;&hairsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[0.00&emsp;&emsp;&thinsp;&hairsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[0.0.0&emsp;&nbsp;&nbsp;&nbsp;&nbsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[0.00.0&emsp;&nbsp;&nbsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[0.00.00&ensp;&nbsp;&nbsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟩🟩🟩 -->

Table 16.43 — TOC entry: single digit chapter, collapsible

This has the following appearance:

Single digit chapter
Figure 16.25 — Single digit chapter, collapsible TOC pro-forma

The following is a worked example for the 02 Cloning a Wiki page:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<details><!-- [SECTION 02]   🟢🟢🟢 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./02-cloning-a-wiki">2<!-- NUM -->&ensp;&nbsp;&nbsp;&thinsp;<!-- HEAD -->Cloning a Wiki</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[2.1&emsp;&emsp;&nbsp;&nbsp;&thinsp;&hairsp;Why clone a Wiki?](02-cloning-a-wiki#21why-clone-a-wiki)<br>
&emsp;&ensp;&hairsp;[2.2&emsp;&emsp;&nbsp;&nbsp;&thinsp;&hairsp;How to clone a Wiki](02-cloning-a-wiki#22how-to-clone-a-wiki)<br>
&emsp;&ensp;&hairsp;[2.3&emsp;&emsp;&nbsp;&nbsp;&thinsp;&hairsp;Pushing local changes to GitHub](02-cloning-a-wiki#23pushing-local-changes-to-github)<br>
&emsp;&ensp;&hairsp;[2.3.1&emsp;&nbsp;&nbsp;&nbsp;&nbsp;Configuring username and email](02-cloning-a-wiki#231configuring-a-git-username-and-email-address)<br>
&emsp;&ensp;&hairsp;[2.3.2&emsp;&nbsp;&nbsp;&nbsp;&nbsp;Modifying the local repository](02-cloning-a-wiki#232modifying-the-local-repository)<br>
&emsp;&ensp;&hairsp;[2.3.3&emsp;&nbsp;&nbsp;&nbsp;&nbsp;Committing and synchronising](02-cloning-a-wiki#233committing-and-synchronising-the-changes)<br>
</details><!--               🟩🟩🟩 -->

Table 16.44 — TOC entry: single digit chapter, collapsible example

To make the list default to open replace <details> with <details open>.

⬆️ Top





Double digit chapter, collapsible TOC     

Double digit chapter TOC
Figure 16.26 — Double digit chapter, collapsible TOC

The Markdown is:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<details><!-- [SECTION_NAME] 🟢🟢🟢 SECTION GENERAL DOUBLE DIGIT CHAPTER-->
<summary><a href="./page">00<!-- NUM -->&ensp;&thinsp;<!-- HEAD -->Heading_Chap_2_Digit</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[00.0&emsp;&emsp;&thinsp;&hairsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[00.00&emsp;&ensp;&nbsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[00.0.0&emsp;&ensp;&hairsp;HeadingSecHeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[00.00.0&ensp;&nbsp;&nbsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[00.00.00&ensp;Heading](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟩🟩🟩 -->

Table 16.45 — TOC entry: double digit chapter, collapsible

This has the following appearance:

Double digit chapter
Figure 16.27 — Double digit chapter, collapsible TOC pro-forma

The following is a worked example for the 15 Navigation bars, badges and buttons page:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<details><!-- [SECTION 15]   🟢🟢🟢 SECTION GENERAL DOUBLE DIGIT CHAPTER-->
<summary><a href="./15-navigation-bars,-badges-and-buttons">15<!-- NUM -->&ensp;&thinsp;<!-- HEAD -->Navigation bars, badges and buttons</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[15.1&emsp;&emsp;&thinsp;&hairsp;Navigation bars](15-navigation-bars,-badges-and-buttons#151navigation-bars)<br>
&emsp;&ensp;&hairsp;[15.1.1&emsp;&ensp;&nbsp;Navigation bar practicalities](15-navigation-bars,-badges-and-buttons#1511navigation-bar-practicalities)<br>
&emsp;&ensp;&hairsp;[15.2&emsp;&emsp;&thinsp;&hairsp;Badges](15-navigation-bars,-badges-and-buttons#152badges)<br>
&emsp;&ensp;&hairsp;[15.2.1&emsp;&ensp;&nbsp;Creating a badge](15-navigation-bars,-badges-and-buttons#1521creating-a-badge)<br>
&emsp;&ensp;&hairsp;[15.2.2&emsp;&ensp;&nbsp;Static badge options](15-navigation-bars,-badges-and-buttons#1522static-badge-options)<br>
&emsp;&ensp;&hairsp;[15.2.3&emsp;&ensp;&nbsp;Dynamic badges](15-navigation-bars,-badges-and-buttons#1523dynamic-badges)<br>
&emsp;&ensp;&hairsp;[15.3&emsp;&emsp;&thinsp;&hairsp;Buttons](15-navigation-bars,-badges-and-buttons#153buttons)<br>
</details><!--               🟩🟩🟩 -->

Table 16.46 — TOC entry: double digit chapter, collapsible example

To make the list default to open replace <details> with <details open>.

⬆️ Top





TOCs for appendices     

TOCs for appendices are contained within an additional collapsible block:

Collapsed appendices TOC
Figure 16.28 — Collapsed appendices TOC

When expanded, the TOC looks like this:

Expanded appendices TOC
Figure 16.29 — Expanded appendices TOC

The appendices TOC is separated from the main TOC with a horizontal bar, the code for this and the top-level collapsible block is:

The Markdown is:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<!-- APPENDICES -->
<hr><!-- SEPARATOR -->
<details><!-- APPENDICES TOP 🔴🔴🔴 LEVEL COLLAPSE -->
<summary><a href="./page"><!-- APP TOP LEVEL -->Appendices</a>
</summary>
<br><!-- BLANK LINE BELOW -->


<!--INDIVIDUAL TOCs FOR EACH APPENDIX GO HERE -->

</details><!-- APPENDICES TOP🟥🟥🟥 LEVEL COLLAPSE -->

Table 16.46 — Top level Appendices TOC collapsible block

Individual TOCs for each appendix go in the orange area, these are very similar to the Single digit chapter, collapsible TOCs.

The only differences are to do with the spacings. Appendices use a capital letter in place of a chapter number and whereas the numbers (at the reduced size of the sidebar text) are all approximately the same width, the capital letters vary considerably.

There are some commonalities, the following letters are grouped in matching widths:

A, C, V, R
B, K, P, S, T, X, Y, Z
D, G, H, N, O, Q, U
E, F, L
I
J
M
W
List 16.19 — Letter groups

There are separate TOC groups for each of these.#

The code for each group is as follows:

Markdown
${\large \color{#0050C0}\text{MARKDOWN\ FOR\ A,\ C,\ V,\ R}}$ 🔽

<details><!-- [APP_NAME]     🟡🟡🟡 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">A<!-- NUM -->&ensp;&nbsp;&nbsp;&#8202;<!-- HEAD -->Heading_App_Digit_A_C_R_V</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[A.0&emsp;&emsp;&nbsp;&nbsp;&thinsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[A.00&emsp;&emsp;&thinsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[A.0.0&emsp;&nbsp;&nbsp;&nbsp;&thinsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[A.00.0&emsp;&nbsp;&thinsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[A.00.00&ensp;&nbsp;&thinsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟨🟨🟨 -->

${\large \color{#0050C0}\text{MARKDOWN\ FOR\ B,\ K,\ P,\ S,\ T,\ X,\ Y,\ Z}}$ 🔽

<details><!-- [APP_NAME]     🟡🟡🟡 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">B<!-- NUM -->&ensp;&nbsp;&nbsp;&thinsp;<!-- HEAD -->Heading_App_Digit_B_K_P_S_T_X_Y_Z</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[B.0&emsp;&emsp;&nbsp;&nbsp;&thinsp;&hairsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[B.00&emsp;&emsp;&thinsp;&hairsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[B.0.0&emsp;&nbsp;&nbsp;&nbsp;&nbsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[B.00.0&emsp;&nbsp;&nbsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[B.00.00&ensp;&nbsp;&nbsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟨🟨🟨 -->

${\large \color{#0050C0}\text{MARKDOWN\ FOR\ D,\ G,\ H,\ N,\ O,\ Q,\ U}}$ 🔽

<details><!-- [APP_NAME]     🟡🟡🟡 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">D<!-- NUM -->&ensp;&nbsp;&nbsp;<!-- HEAD -->Heading_App_Digit_D_G_H_N_O_Q_U</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[D.0&emsp;&emsp;&nbsp;&nbsp;&thinsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[D.00&emsp;&emsp;&thinsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[D.0.0&emsp;&nbsp;&nbsp;&nbsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[D.00.0&emsp;&nbsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[D.00.00&ensp;&nbsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟨🟨🟨 -->

${\large \color{#0050C0}\text{MARKDOWN\ FOR\ E,\ F,\ L}}$ 🔽

<details><!-- [APP_NAME]     🟡🟡🟡 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">E<!-- NUM -->&ensp;&nbsp;&nbsp;&nbsp;<!-- HEAD -->Heading_App_Digit_E_F_L</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[E.0&emsp;&emsp;&nbsp;&nbsp;&thinsp;&thinsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[E.00&emsp;&emsp;&thinsp;&thinsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[E.0.0&emsp;&nbsp;&nbsp;&nbsp;&emsp13;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[E.00.0&emsp;&nbsp;&thinsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[E.00.00&ensp;&nbsp;&nbsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟨🟨🟨 -->

${\large \color{#0050C0}\text{MARKDOWN\ FOR\ I}}$ 🔽

<details><!-- [APP_NAME]     🟡🟡🟡 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">I<!-- NUM -->&ensp;&nbsp;&ensp;&nbsp;<!-- HEAD -->Heading_App_Digit_I</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[I.0&emsp;&emsp;&emsp;&hairsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[I.00&emsp;&emsp;&nbsp;&thinsp;&hairsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[I.0.0&emsp;&nbsp;&nbsp;&nbsp;&nbsp;&thinsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[I.00.0&emsp;&nbsp;&nbsp;&thinsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[I.00.00&emsp;&thinsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟨🟨🟨 -->

${\large \color{#0050C0}\text{MARKDOWN\ FOR\ J}}$ 🔽

<details><!-- [APP_NAME]     🟡🟡🟡 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">J<!-- NUM -->&ensp;&nbsp;&ensp;&thinsp;<!-- HEAD -->Heading_App_Digit_I</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[J.0&emsp;&emsp;&ensp;&emsp13;&thinsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[J.00&emsp;&emsp;&nbsp;&hairsp;&hairsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[J.0.0&emsp;&nbsp;&nbsp;&nbsp;&nbsp;&hairsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[J.00.0&emsp;&nbsp;&nbsp;&hairsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[J.00.00&emsp;&hairsp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟨🟨🟨 -->

${\large \color{#0050C0}\text{MARKDOWN\ FOR\ M}}$ 🔽

<details><!-- [[APP_NAME]    🟡🟡🟡 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">M<!-- NUM -->&ensp;&nbsp;&#8202;<!-- HEAD -->Heading_App_Digit_M</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[M.0&emsp;&emsp;&ensp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[M.00&emsp;&emsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[M.0.0&emsp;&ensp;&emsp14;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[M.00.0&emsp;&emsp14;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[M.00.00&ensp;&thinsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟨🟨🟨 -->

${\large \color{#0050C0}\text{MARKDOWN\ FOR\ W}}$ 🔽

<details><!-- [APP_NAME]     🟡🟡🟡 SECTION GENERAL SINGLE DIGIT CHAPTER-->
<summary><a href="./page">W<!-- NUM -->&ensp;&nbsp;&#8202;<!-- HEAD -->Heading_App_Digit_W</a>
</summary><!-- BLANK LINE BELOW -->

&emsp;&ensp;&hairsp;[W.0&emsp;&emsp;&ensp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[W.00&emsp;&ensp;&puncsp;&thinsp;HeadingSec](page#heading)<br>
&emsp;&ensp;&hairsp;[W.0.0&emsp;&ensp;&emsp14;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[W.00.0&emsp;&thinsp;HeadingDiv](page#heading)<br>
&emsp;&ensp;&hairsp;[W.00.00&ensp;&hairsp;HeadingDiv](page#heading)<br>
&emsp;&emsp;&emsp;&emsp;&emsp;&ensp;&nbsp;[HeadingInln](page#heading)<br>
</details><!--               🟨🟨🟨 -->

Table 16.47 — Individual TOC for all 26 Appendix letters

⬆️ Top



16.6.5SpacerEnd of page link

The end of page link is identical on every sidebar:

End of page link
Figure 16.30 — End of page link

This is simply the end of page link discussed in section 9.5, wrapped in a table.

The code is:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<table align="center"><tr><!-- 🟣END OF PAG🟣E -->
        <td><a href="#idend"><strong>⬇️ End of page</strong></a></td>
</tr></table>

Table 16.48 — End of page link

It requires the end of page anchor point to be the last thing on the associated Wiki page, see section 16.5.1.

⬆️ Top



16.7SpacerFooter

The PracticalSeries footer is primarily a navigation bar (identical to that isn the sidebar), a colophon and a list of contacts and web links. It looks like this:

End of page link
Figure 16.31 — PracticalSeries footer format

It is made up of four parts:

Location badge
Navigation bar
Colophon
Links and contacts
List 16.20 — Footer components

Each of these is examined in turn in the following sections.

⬆️ Top



16.7.1SpacerNames and locations of the footer files

Footer files for a particular page are called _footer.md. These work in exactly the same way as the _sidebar.md files discussed in section 16.6.1 and are stored in exactly the same folder as the associated sidebar. See section 16.6.1

⬆️ Top



16.7.2SpacerLocation badge

The location badge (top-right of the footer) is identical to that of the associate sidebar. It has the following Markdown:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<p align="right"><!-- LOCATION BADGE --><img height="15px" src="https://img.shields.io/badge/loc-cc--ssdd-808080">

Table 16.49 — Footer location badge

It is simply a right aligned version of the Shields.IO badge used in the sidebar (see section 16.6.2). Everything within the <img> tag can be copied from the associated sidebar and pasted into the footer.

⬆️ Top



16.7.3SpacerNavigation bar

The footer navigation bar is identical to that of the sidebar associated with the same page, it can be copied and pasted directly from that sidebar. See section 16.6.3 and section 15.1

⬆️ Top



16.7.4SpacerColophon

The colophon contains the publisher and copyright information for the Wiki:

Footer colophon
Figure 16.32 — Footer colophon

This is the code:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<!--- COLOPHON -->
<p align="center"><strong><!-- NAME -->The PracticalSeries of Publications&nbsp;&mdash;&nbsp;<!-- COPYRGT -->Copyright &copy; 2024 Michael Gledhill</strong></p>

Table 16.50 — Footer colophon

It is simply a centred text string containing the publisher and the copyright owner.

⬆️ Top



16.7.5SpacerLinks and contacts

The markdown for this is:

Markdown
${\large \color{#0050C0}\text{M\ A\ R\ K\ D\ O\ W\ N}}$ 🔽

<!--- LINKS AND LOCATION BADGE -->
<p align="center">
<!-- TOP   --><a href="#idtop">⬆️ Top</a>&nbsp;&emsp;&nbsp;|&nbsp;&emsp;
<!-- EMAIL --><a href="mailto:[email protected]">[email protected]</a>&nbsp;&emsp;&nbsp;|&nbsp;&emsp;
<!-- WEB   --><a href="https://practicalseries.com/">PracticalSeries of Publications</a>&nbsp;&emsp;&nbsp;|&nbsp;&emsp;
<!-- REPO  --><a href="https://github.com/practicalseries/GitHub-Wiki-Design-and-Implementation">Main repository</a></p>

Table 16.51 — Footer colophon

It is simply four links, the first, a standard link to the top of the page, the second is an email link, the third a link to the associated website and the fourth a link to the parent repository.




Wiki contentsSpacer

Previous page Previous chapter Home Next chapter Next page
   Home

       The GitHub Wiki
       What does this guide cover?
       A note by the Author

     CaseNotes

   Licence

       The licences and other details
       The Licence
       Why did I choose the MIT Licence?
       Permissive licences
       Copyleft licence
       Limiting liabilities
       Which licence to use?
       A note on spelling: licence or license

1    Introducing the GitHub Wiki

   1.1      What are GitHub Wiki pages?
   1.2      Understanding the Wiki pages
   1.3      Creating a Wiki for a repository
   1.3.1     Creating the first Wiki page
   1.3.2     Creating additional pages
   1.3.3     Editing a Wiki page
   1.4      The Wiki is its own repository
   1.4.1     Viewing a Wiki page history
   1.4.2     How GitHub handles Wiki branche
   1.4.3     The Wiki link to the main repository
   1.5      Basic components of a Wiki page
   1.5.1     Title bar and revision
   1.5.2     Contents (pages) area
       Listing pages in the order you want
   1.5.3     Sidebars
   1.5.4     Footers
   1.6      Sidebars and footers
   1.6.1     Creating a sidebar and footer

2    Cloning a Wiki

   2.1      Why clone a Wiki?
   2.2      How to clone a Wiki
   2.3      Pushing local changes to GitHub
   2.3.1     Configuring username and email
   2.3.2     Modifying the local repository
   2.3.3     Committing and synchronising

3    A Wiki folder structure

   3.1      The default arrangement
   3.2      Create a sidebar or footer locally
   3.3      Page naming and Wiki limits
   3.3.1     Supported file types
   3.3.2     Page names and numbering
   3.3.3     Rules for page numbering
   3.3.4     Limits for Wiki pages
   3.4      A Practical Wiki folder structure
   3.4.1     Subfolder names for Wiki pages
   3.4.2     Storing images and other data

4    Different sidebars and footers

   4.1      How sidebars work
   4.1.1     The PracticalSeries sidebar
   4.2      How footers work
   4.2.1     The PracticalSeries footer

5    Markdown, GitHub Markdown and HTML

   5.1      Some useful Markdown sites
   5.2      An overview of Markdown
   5.3      How Markdown works
   5.4      Markdown flavours
   5.4.1     GitHub Flavoured Markdown (GFM)
   5.5      HTML and Markdown
   5.5.1     HTML with GFM
       GFM blacklisted HTML tags
       GFM whitelisted HTML tags
       GFM HTML tags - the grey area
       GFM whitelisted HTML attributes
   5.5.2     PracticalSeries and Markdown
   5.6      Markdown difference between files

6    Basic Markdown and text formatting

   6.1      Body text and fonts
   6.1.1     Body text responsive design
   6.1.2     Body text in sidebars and footers
   6.1.3     Rules for body text
   6.1.4     Body text examples
   6.1.5     Alignment of Body text
       Left aligned text (default)
       Right aligned text
       Centred text
       Justified text
   6.1.6     Body text propertie
   6.2      Paragraphs and line breaks
   6.2.1     Forced line break
   6.2.2     Blank line and a line break
   6.2.3     Trailing space line break
   6.2.4     Paragraph and line break rules
   6.2.5     Paragraph and line break examples
   6.3      Horizontal line
   6.3.1     Rules for horizontal lines
   6.4      Emphasis with bold
   6.4.1     Rules for bold
   6.4.2     Bold text examples
   6.5      Emphasis with italics
   6.5.1     Rules for italics
   6.5.2     Italic text examples
   6.6      Emphasis with bold and italics
   6.6.1     Rules for bold and italics
   6.6.2     Bold and italic text examples
   6.7      Emphasis with underlining
   6.7.1     Rules for underlining
   6.7.2     Underlining text examples
   6.8      Emphasis with strikethrough
   6.8.1     Rules for strikethrough
   6.8.2     Strikethrough text examples
   6.9      Superscript and subscript
   6.9.1     Rules for superscript and subscript
   6.9.2     Superscript and subscript examples
   6.10    Headings
       Alternatives for heading 1 and 2
   6.10.1   Headings Markdown rules
   6.10.2   Heading properties

7    Special characters and escaping characters

   7.1      Escape characters and codes
   7.1.1     Markdown escape sequences
   7.1.2     HTML escape sequences
   7.1.3     Decimal and hexadecimal codes
       Hexadecimal escape codes
   7.2      Special space characters
   7.2.1     Escape sequence restrictions
   7.3      Emojis and emoticons
       A note by the Author about emojis
   7.4      Comments

8    Block quotes, lists and alerts

   8.1      Block quotes
   8.1.1     Nested block quotes
   8.1.2     Adding other elements
   8.1.3     Rules for block quotes
   8.2      Unordered (unnumbered) lists
   8.2.1     Nested unordered lists
   8.2.2     Type of bullet point
   8.2.3     Indents and spacing
   8.2.4     Numbers in an unordered list
   8.2.5     Adding paragraphs
   8.2.6     Adding other elements
   8.2.7     Rules for unordered lists
   8.3      Ordered (numbered) lists
   8.3.1     Starting at a different number
   8.3.2     Nested ordered lists
   8.3.3     Type of numbering
   8.3.4     Indents and spacing
   8.3.5     Adding paragraphs
   8.3.6     Adding other elements
   8.3.7     Rules for ordered lists
   8.4      Mixing ordered and unordered lists
   8.5      Task lists (check boxes)
   8.5.1     Nested task lists
   8.6      Alerts
   8.6.1     Rules for alerts

9    Links

   9.1      Link to an external web page
   9.1.1     A direct link to a URL
   9.1.2     A link using substitute text
   9.1.3     A link using tooltips
   9.2      Link to another page in the Wiki
   9.2.1     Rules for linking to a Wiki page
   9.3      Link to headings on current page
   9.3.1     Converting a heading to a link
   9.3.2     An example of a heading link
   9.3.3     Heading link with tooltips
   9.4      Link to headings on a different page
   9.4.1     An example of a heading link
   9.5      Link to a named element
       A note by the Author
   9.5.1     Link to a point on another page
   9.6      Downloading a file
   9.6.1     The download attribute
   9.6.2     Spaces in filenames
   9.6.3     Downloading a .md file
   9.7      Reference style links
   9.8      Relative links
   9.8.1     Relative links from any Wiki page

10  Tables

   10.1    Markdown tables
   10.1.1   Horizontal alignment
   10.1.2   Table construction
   10.1.3   Vertical line breaks and alignment
   10.1.4   Making columns wider
   10.1.5   Other elements in a table
   10.1.6   Markdown table restrictions
   10.2    HTML tables
   10.2.1   A basic HTML table
   10.2.2   Aligning a table on a page
   10.2.3   Text wrap and side-by-side tables
       What this means in practice
       The problem with the align attribute
       How to stop text wrapping
   10.2.4   Setting the width of a table column
   10.2.5   Setting the height of a table row
   10.2.6   Horizontal alignment
   10.2.7   Vertical alignment
   10.2.8   Spanning columns and rows
   10.2.9   Table border
   10.2.10   Giving a table a navigable name
   10.2.11   Additional HTML tags

11  Images

   11.1    Markdown images
   11.1.1   Image size in Markdown
   11.1.2   Making the image a link
   11.1.3   Drag and drop image link
       A note by the Author
   11.2    HTML images
   11.2.1   A basic HTML image
   11.2.2   Image size in HTML
   11.2.3   Horizontal alignment
   11.2.4   Making the image a link
   11.2.5   Using a table to contain an image
   11.3    Forcing an image refresh
   11.4    Using a spacer image
   11.5    Mermaid diagrams
   11.5.1   Inserting a Mermaid diagram
   11.5.2   The rendered Mermaid diagram
   11.5.3   Supported version of Mermaid
   11.6    Interactive maps
   11.7    3D models

12  Contents (collapsible) and footnotes

   12.1    A basic table of contents
   12.2    Understanding the space characters
   12.3    Collapsible content
   12.3.1   Defaulting to open
   12.3.2   Markdown restrictions
   12.4    Collapsible TOC
   12.5    TOCs in tables
   12.6    Footnotes

13  Code fragments

   13.1    Inline code
   13.2    Code blocks
   13.2.1   Preferred mechanism
   13.3    Syntax highlighting
   13.3.1   Supported languages
   13.4    HTML code fragments
   13.4.1   Converting HTML to code

14  Mathematical formulae

   14.1    An overview of LaTex
   14.2    Inserting an inline formula
   14.2.1   Alternative delimiter
   14.3    A formula block
   14.4    Some example formulae
   14.5    LaTeX syntax
   14.5.1   Greek lowercase
   14.5.2   Greek uppercase and Hebrew
   14.5.3   Mathematical constructions
   14.5.4   Variable sized delimiters
   14.5.5   Variable sized symbols
   14.5.6   Variable sized symbols with limits
   14.5.7   Standard functions
   14.5.8   Operators and relational symbols
   14.5.9   Arrows
   14.5.10   Other symbols
   14.5.11   Accents
   14.5.12   Matrices
   14.5.13   Cases
       Aligning multiple equations
   14.5.14   Text formatting
       Font size
       Font colour
       The text command
       Font restrictions
   14.6    Abusing LaTeX
   14.6.1   Changing font colour with LaTeX

15  Navigation bars, badges and buttons

   15.1    Navigation bars
   15.1.1   Navigation bar practicalities
   15.2    Badges
   15.2.1   Creating a badge
   15.2.2   Static badge options
   15.2.3   Dynamic badges
   15.3    Buttons

16  PracticalSeries Wiki conventions

   16.1    The PracticalSeries Wiki page
   16.2    The PracticalSeries folder structure
   16.2.1   The root folder and home page
   16.2.2   Leading pages
   16.2.3   .gitkeep files
   16.2.4   Folder and Markdown file names
       Wiki pages that start at a section
   16.3    The page title area
   16.4    The page heading area
   16.4.1   Top of page marker
   16.4.2   Logo image
   16.4.3   Web ID badge
   16.5    Main body area
   16.5.1   Common page elements
       End of page marker
       End of section elements
   16.5.2   Headings
       Compensating for number widths
       Appendices headings
   16.5.3   Tables
       Links to a table
       A note on Markdown tables
   16.5.4   Images
       Images that open in a new tab
       Double images
       Links to a figure
   16.5.5   Lists
       Common points for all lists
       Basic unordered list
       Basic ordered list
       Mixed ordered and unordered lists
       Enhanced mixed lists
       Index list
       Reverse index list
       Index list with text wrap
       Reverse index list with text wrap
       Indexed, mixed list
       Reverse indexed, mixed list
       Task list
       Enhanced task list with observations
   16.5.6   Code fragments
   16.5.7   Formulae
       Standard formulae
       Alternate formulae
   16.6    Sidebar
   16.6.1   sidebar files and locations
   16.6.2   Sidebar title and location badge
   16.6.3   Navigation bar
   16.6.4   Table of contents
       Unnumbered, non-collapsible TOC
       Unnumbered, collapsible TOC
       Single digit, collapsible TOC
       Double digit, collapsible TOC
       TOCs for appendices
   16.6.5   End of page link
   16.7    Footer
   16.7.1   Footer files and locations
   16.7.2   Location badge
   16.7.3   Navigation bar
   16.7.4   Colophon
   16.7.5   Links and contacts

17  Managing a Wiki

   17.1    Revision control
   17.1.1   Managing commits
   17.2    Finding the first Wiki commit
   17.3    Rebasing the Wiki
   17.3.1   Summarising the rebase process
   17.3.2   Executing the rebase process
   17.4    Wikis and search engine visibility


Appendices
A    Unicode and HTML escape

   A.1     HTML Escape codes, full list
   A.2     Non-functional escape sequences

B    Full list of all emoji characters

   B.1      Emojis, a brief explanation
   B.1.1     Emoji short names
   B.1.2     Emoji escape codes
   B.1.3     Emoji variations
   B.1.4     Emoji numbers
   B.2      Emojis characters by category
       Smileys and emotion
       People and body
       Component
       Animals and nature
       Food and drink
       Travel and places
       Activities
       Objects
       Symbols
       Flags
   B.3      Emoji characters by Unicode

C    Segoe UI full character set

       A note by the Author
   C.1     Inserting Unicode characters
   C.2     Characters U+00000 to U+00FFF
   C.3     Characters U+01000 to U+01FFF
   C.4     Characters U+02000 to U+02FFF
   C.5     Characters U+03000 to U+09FFF
   C.6     Characters U+0A000 to U+0AFFF
   C.7     Characters U+0B000 to U+0FFFF
   C.8     Characters U+10000 to U+10FFF
   C.9     Characters U+11000 to U+11FFF
   C.10   Characters U+12000 to U+12FFF
   C.11   Characters U+13000 to U+15FFF
   C.12   Characters U+16000 to U+1CFFF
   C.13   Characters U+1D000 to U+1EFFF
   C.14   Characters U+1F000 to U+3FFFF

D   3D Model of a Sierpinski cube

       3D Sierpinski cube

E    Template

       COMMENT FIELDS
       HEADINGS
       TABLES
       FIGURES
       LISTS
       TASK LISTS
       CODE FRAGMENT
       FORMULAE
       LINKS
       BUTTONS
       ALERTS
       COLOURED TEXT
       INDEX NUMBERS
       END OF SECTION
       FOOTNOTE
       END OF PAGE

⬇️ End of page
Clone this wiki locally