Music Sheet Viewer WordPress plugin

« Music Sheet Viewer » plugin allows you to display a music sheet written in MEI, MusicXML or PAE, in a WordPress page.

The code is entered directly using the shortcode tag [pn_msv] … and that’s all!!

You do not need to escape HTML entities or anything. Just post your code as-is, even if the code is an XML dialect. The plugin will handle the rest.

With this plugin, never ever upload a music sheet image to your website that is not zoomable and requires a new upload every time a single note must be changed!!!

At last it’s fully responsive!

Example : This same page uses the « Music Sheet Viewer » plugin.

The following PAE code :


[pn_msv]
@clef:G-2
@keysig:xFCGD
@timesig:3/8
@data:'6B/{8B+(6B''E'B})({AFD})/{6.E3G},8B-/({6'EGF})({FAG})({GEB})/4F6-
[/pn_msv]

displays as :

Installation

The plugin can be installed from : Music Sheet Viewer on WordPress plugins directory

Implementation

The music sheet rendering is powered by the Verovio JavaScript toolkit.

Supported formats

« Music Sheet Viewer » supports code written in MEI, MusicXML or PAE (RISM format).

Supported inputs

The input can be entered either inline inside [pn_msv] and [/pn_msv] shortcode, or for big scores, using the file parameter.

Content displayed

This plugin is not intented for displaying a full score with many pages, but either the first page of a multi-pages score, or music incipts.

Score layout

The score fits automatically to the content in which it’s placed without any specific indication.
If what is displayed is too small to fit to the allowed content it’s possible to justify the rendering, using the layout="justified" parameter.

Shortcode parameters

format

Format of the music sheet code when passed inline. Has no effect if file parameter is used.

Possible values : mei (MEI), xml (MusicXML) or pae (RISM format).

Default format is pae as it’s compact and convenient for displaying music sheet fragments.

Note that « Music Sheet Viewer » doesn’t check that the code is written in the language passed to format parameter. If they don’t match, the result is unpredictable.

file

If the code isn’t specified inline, allows to indicate either :

  • a local file previously uploaded on your website
  • In this case, file parameter must start with a ‘/’ and is assumed to be found under your website’s root.

    Example :

    
    [pn_msv file="/wp-content/uploads/2017/05/DoSerrure.mei"/]
    
  • a remote file
  • Specify the complete URL of the file.

    Example :

    
    [pn_msv format="mei" file="https://www.verovio.org/examples/downloads/Chopin_Etude_op.10_no.9.mei"/]
    

font

Renders the score with the corresponding SMuFL font. Three fonts are available : Leipzig, Bravura and Gootville. By default, Leipzig is used.

layout

By default the score fits automatically to the content in which it’s placed.

layout="justified" allows to maximize the space used to display a score line too small to fit to the allowed content.
To keep for this specific situation as this option will display every music sheet on a single line.

This is the only possible layout value so far.

Example :
Without justification :


[pn_msv]
@clef:G-2
@keysig:xF
@timesig:3/8
@data:=25//$xFCG @c 2-4.-'8E/{6AGFE}{8A''C}'B''4D{6C'B}/{''DC'BA}{''8EA}
[/pn_msv]

With justification:


[pn_msv layout="justified" font="Gootville"]
@clef:G-2
@keysig:xF
@timesig:3/8
@data:=25//$xFCG @c 2-4.-'8E/{6AGFE}{8A''C}'B''4D{6C'B}/{''DC'BA}{''8EA}
[/pn_msv]

Error messages

Error messages can raise at preview time (e.g font parameter with an unknown value), letting you correct the code prior to publishing.
Or they can raise later, for example if the content of a score file previously uploaded is changed and produces a loading error : In this case the error might only be visible in the browser’s console in development mode.

Known restrictions

No nested shortcodes are allowed within MEI or XML formats.

Gallery

Gallery of examples using Music Sheet Viewer plugin

Les commentaires sont fermés.