Song Pages: Read, adjust and play any song
The song page is where you actually play from. It shows the words, the chords and the chord diagrams for your instrument.
Almost everything on the page can be adjusted to suit you. Make the text bigger, move the diagrams, change the colours, scroll hands-free while you play, or edit the song itself.
Please DO NOT use HTML markup in the songs as almost all formatting can be done using Chordpro directives.
๐ก Handy hints: Throughout this page, look for our Handy hints. These practical suggestions come from helpful feedback from our users and point out useful shortcuts and small details that can make song pages easier to use.
Make the song easier to read
Open โ๏ธ Settings in the top bar, or from the hamburger menu on a phone. A panel opens showing everything you can change, with your current choice against each one in red. Click a row to change it, and the song behind the panel updates straight away.
The main settings
| Setting | What it does |
|---|---|
| Notation | Standard, Roman or Nashville chord names |
| Lyrics font | Helvetica,Arial, Medium (a touch bolder), Narrow, Monoface, Low vision (Atkinson Hyperlegible) or Dyslexia (OpenDyslexic) |
| Text font size | 10pt to 24pt |
| Header font size | 100% to 250% of the body text |
| Sub header font size | 80% to 160% |
| Line spacing | 1 to 3 |
| Chord colour | Pick a swatch or choose your own colour |
| Diagram size | XS to XL |
| Chordnames | Inline, above the lyrics, or a small diagram above each chord |
| Width | Full screen, A4 or Letter |
๐ก Handy hint: Reading from a music stand? Try a larger text size and looser line spacing. Printing a set for a group? Smaller text and tighter spacing fits more on the page.
Display options
Below the divider are tick boxes for:
- Show left hand chords
- Chords in 1 column
- Chords in alphabetical order (on by default)
- Remove [ ] from chordnames
- Remove finger numbers on chords
- Note names under chordnames
- Piano chords
- Second instrument chords (opens an instrument picker when ticked)
- Show Secondary Diagrams under primary diagrams
- Monochrome theme
- Lyrics bold
- Comments bold
- Remove bold from chordnames
- Ignore common chords
Keep the settings you like
At the bottom of the Settings panel:
| Button | What it does |
|---|---|
| ๐พ Save Settings | Keeps these settings for this song |
| ๐ Remove | Clears the saved settings for this song |
| โญ Save current view as defaults | Uses these settings for every song from now on |
๐ก Handy hint: Once you have a song looking the way you like it, โญ Save current view as defaults applies the same look to everything, so you do not have to set it up again each time.
Move the chord diagrams, or hide them
The buttons in the bar above the song decide where the diagrams sit.
| Button | Where the diagrams go |
|---|---|
| Top | Above the lyrics. Good on a narrow screen. |
| Right | Beside the lyrics. The usual choice on a wide screen. |
| Bottom | Below the song. |
| Hide | Removed from the page. |
๐ก Handy hint: Hide the diagrams to fit more of the song on screen, then hover over any chord name in the lyrics to see that one shape pop up. On a phone or tablet, tap the chord name instead. This works with Inline and Above chord display, but not with the small diagram option.
Understand the unusual chord markings
Some songs use markings that are not chord names:
| Marking | What it means |
|---|---|
| [NC] | No chord. Sing this bit without strumming. |
| [ ]* | One strong strum. |
| [ ]โ | One downstrum. |
| [ ]โ | One upstrum. |
| [D7-alt], [B7-2] | A different shape for the same chord. |
Swap a chord for a shape that suits you
If a chord shape is awkward for you, there is almost always another way to play it.
Click any chord diagram and a panel opens showing alternative shapes for that chord. Click one and it replaces the original.
The new shape carries through to:
- The song on screen
- Any PDF you make from the song
- Your saved favourite, once you save it
These alternatives are worked out automatically. Most are perfectly playable, though you may meet the occasional odd one.
Put a chord back, and other options
Right-click any chord diagram to open a small menu. On an iPad, press and hold instead.
| Option | What it does |
|---|---|
| Open chord in new tab | Opens the diagram on its own, where it can be resized and saved |
| Copy define statement to clipboard | Copies the ChordPro code behind the diagram |
| Delete that diagram | Puts back the shape you had before |
| Delete all definitions for that chord | Clears every change you have made to that chord |
| Delete all revised definitions | Clears every chord change in the song |
๐ก Handy hint for teachers: Open a chord in a new tab and you can scale the diagram up to around 2200 pixels, close to a full A4 page. Save it as a PNG or copy it, then drop it into a handout or a slide. It stays sharp at any size.
Scroll hands-free while you play
The song can scroll itself so you do not have to stop playing to move the page.
On a desktop the scroll controls sit above the song. On a phone, tap the โถ icon in the menu to open a small panel.
| Control | What it does |
|---|---|
| โถ Start | Begins scrolling |
| Stop | Stops it |
| Speed slider | Right for faster, left for slower. Starts at 5. |
Keyboard shortcuts
| Key | What it does |
|---|---|
| spacebar | Restart from the top |
| โ | Slow down |
| โ | Speed up |
| โ | Pause |
| โ | Resume |
What happens while it scrolls
- The chord diagrams move to the top so they stay in view
- The page headers and menus hide, giving the song more room
- Moving the mouse over the song pauses it and shows paused. Move away and it carries on.
- At the end of the song it stops and shows completed
๐ก Handy hint: Your scroll speed is remembered. If the song is a favourite it is saved when the scroll stops, so next time it starts at the speed that suits you. If Auto-save is off, click the star to save it.
Keep your changes with Auto-save
If the song is one of your favourites, the Auto-save status shows in the bar at the top. Click it to turn it on or off.
| Setting | What happens |
|---|---|
| On | Every change you make to this song is saved automatically |
| Off | Nothing is saved until you save it yourself |
If Auto-save is off, click the star
in the menu to save the song's current settings.
Edit the words and chords
Click โ Edit in the top bar to open the Edit window. This shows the song's ChordPro source, which is the plain text behind the words and chords. It will also show a preview area showing the results of any change in the chordpro. Note: it will not show the chord diagrams or the title area (to make sure the preview fits on the screen). If there is not enough room on the screen the preview area will show in a separate tab
There is a Find/Replace button next to the Done button that allows you to do a full song replace of one string with another - e.g. A# to Bb
See ChordPro Directives for what all the codes mean.
If you click on Cancel then any changes you make will be ignored and the Edit will close.
If you click on Done then the changes will be put into the song and the Edit will close
You can't change the key while you are in EDIT so click on Done, change the key and go back into EDIT
Check how the song will print
Click the printer icon at the top right to see how the song will look on paper. Use it to check whether the song fits the page, and adjust the text size, spacing and margins until it does.
๐ก Handy hint: Click Done before opening the print preview. Until you do, the preview shows the last saved version of the song rather than the changes you have just made.
๐ก Handy hint: This is the quickest way to get a song onto one page. Check the preview, adjust, check again, and only make the PDF once it looks right.
Make your own chord diagram
The Chord Builder lets you draw a chord shape of your own, or replace one of the standard shapes for this song.
- Click โ Edit, then Chord Builder.
- Replace the word NewChord with a name of your own, such as
D7-Hawaiian. - Click the string grid to place the finger dots. If they dont show then click on the Add/Remove Dots button.
- For finger numbers, click on the number (below the Add/Remove Dots button), click a number, then click the dot it belongs to. Repeat for each finger.
- To start higher up the neck, put the starting fret number in the Start Fret box.
- To move a chord shape up or down the neck use the Up or Down arrows below Slide to move the chord up or down the fretboard.
- Click Insert into Song to put the chord into the song.
- Click Done in the Edit window to apply it.
๐ก Handy hint: Use a standard chord name, such as A7, and your shape replaces the usual one for that chord. It only changes this song, not any others.
Add a song of your own
Click ๐ Links โพ in the top bar and choose โ New Song. You get a blank song page with a template in it.
Open the Edit window and replace the template with your own words and chords.
- Put your title inside the curly braces:
{t:Your Song Title} - Delete any template lines you do not need, such as subtitle, artist or key
- See ChordPro Directives for everything you can use
Once it is written you can:
- Print it from your browser
- Make a PDF or Word document with ๐ Files โพ
- Save it as a favourite (see Favourites) so it is kept permanently
๐ก Handy hint: Save your song as a favourite. Songs you create are only kept for 2-3 days unless you save it as a favourite.
Songs you create are visible only to you, and to anyone you share your favourites with. Other people using the site will not see them.
See also:
