Documentation

Basic Song Layout

Songhub supports most of the Chordpro file format.

This include directives in the format {key: value} such as {title: My Song}.
Directives enable you to set data about the songs, such as title, artist, key, capo position. View all supported directives.

Apart from directives, the main bulk of your songs will be main up of chords and lyrics.

Chords & Lyrics

In Songhub, your chords should be written inline with the lyrics. Chords must be surrounded by square brackets to be treated as chords, eg. [Am]. They must also be valid chord names to work.

If you have imported or copied a song which has the chords written above the lyrics, the chords won't be treated as chords, but will appear as lyrics. Therefore, transposing and capo positions won't have any affect if you don't surround your chords with square brackets.

We will be creating a tool to automatically convert chords written on a seperate into inline bracked chords.

Example
[C]Write your [Am]chords in front of the [F]word or let[G]ter
You [C]want them to [F]show a[G]bove
Sections

You can seperate your song into sections (eg. Verse, Chorus, Bridge), by leaving a blank line.

Verse 1
[C]My very short verse

Chorus
[Am]My very short chorus

Verse 1 and Chorus will automatically be seperated into sections because of the blank line between them.

The first line of each section will become the title, unless there is a chord found in the first line, and then the section won't be assigned a title.

Chorus

Specifying a section as a chorus will give the section special styling so that it stands out and is easy to quickly identify.

To specify a section as a chorus, you need start the section with either {start_of_chorus} or {soc}. And you also need to mark the end of the chorus with {end_of_chorus} or {eoc}.

Not that empty lines within the start and end tags will not be seperated into sections, but will shows as blank lines within the chorus itself.

The starting directive can be above or below the section title.

Chorus
{soc}
[C]My very short chorus

[Am]Still in the chorus, despite blank line
{eoc}
Guitar Tabs

To specify a section as a guitar tab, you need start the section with either {start_of_tab} or {sot}. And you also need to mark the end of the tab with {end_of_tab} or {eot}.

Guitar tabs are sections that show up exactly as you type them (including all blank spaces), and have a special style.

Lines will not be wrapped within each guitar tab, but will instead be horizontally scrollable.

Blank lines in this section will make the guitar tab be seperated into multiple sections, which can all be scrolled individually.

Chorus Guitar Part
{sot}
E|------------------|
B|--12--11----------|
G|----------11------|
D|--------------13--|
A|------------------|
E|------------------|
Line Styles

You can apply custom styles to individual line, such as text colour, background color, bold.

You do this by adding special characters to the start of the line.

Supported styles
  • Bold: an asterisk * will make the text bold, eg. *This line will display in bold
  • Italic: a forward slash / will italise the line, eg. /This line will be italised
  • Bold & Italic: an exclamation point ! will both italise the line and make it bold, eg. !This line will be italised and displayed in bold
  • Underline: an underscore _ will underline the line, eg. _This line will be underlined
  • Text colour: you can set the text colour by starting with an ampersand &, then putting the colour (in any html supported format), and then finishing with a colon :, eg. &red:This line will be red or &#ff0000:And so will this
  • Highlight (background) colour: you can set the highlight colour by starting with an greater than symbol >, then putting the colour (in any html supported format), and then finishing with a colon :, eg. >yellow:This line will be highlighted with yellow or >#ffff00:And so will this
Combine styles

You can alse combine multiple styles together, such as bold and text colour.

*$red:This line will be both bold and red
Supported Directives

This is list of all the directives that Songhub currently supports:

  • {title: ...} or {t: ...} - the title of the song.
  • {subtitle: ...} or {st: ...} or {artist: ...} - the artist of the song.
  • {key: ...} or {k: ...} - the key of the song, eg. C or Am.
  • {capo: ...} - the capo position for the song. (This will auto adjust the chords to be correct for the capo, so a chord of C, with a capo of 3, will show as A when displayed).
  • {bpm: ...} or {tempo: ...} - the tempo of the song in beats per minute. Must be a number above zero.
  • {copyright: ...} - copyright information for the song. Displayed at the bottom of the page.
  • {ccli: ...} - the CCLI number of the song. Displayed in the header.
  • {arrangement: ...} or {flow: ...} - the arrangement for the song. See Arrangement for more info.
Inline directives

These are directives which show up where you have inserted them in the song.

  • {comment: ...} or {c: ...} - defines a musical instruction.
  • {guitar_comment: ...} or {gt: ...} - defines a musical instruction for guitarists. Will be hidden if guitar tabs are hidden.
Arrangement

You can set a custom arrangement to save rewriting song sections. This is done by using the arrangement or flow directive, and putting a comma seperated list of the section titles.

{arrangement: Verse 1, Verse 2, Chorus, Verse 3, Chorus, Bridge, Chorus}

Note: if a matching section is not found, the text you enter will be inserted instead, so this can be used to make comments.

Short Names

As well as using the full name for each section, you can also use the short name. A short name is auto-generated using the first letter of each word in the section title and capitilising it. So Verse 1 would become V1, and Alternative Chorus 2 would become AC2.

If multiple sections have the same short name, the first matching section will be used. So you'll need to use the full name to select the correct section, or change the titles so their short names are unique.

You don't need to use commas if you are using the short names.

{flow: V1 V2 C V3 C B C}
Misc
Hidden comments

If you want to insert comments that won't be displayed when the song is rendered, just start a line with #.

#This is a hidden note