Display Sheet Music in WordPress With the ABC Notation Plugin

If you’re a musician or a music teacher and want to show sheet music in WordPress, you might be interested in a new plugin developed by Paul Rosen called ABC Notation. ABC Notation uses ABCjs, an open source ABC music notation JavaScript library that renders sheet music.

To render sheet music, simply add the string you’d like to render between the [abcjs] shortcode. If you’re not familiar with the proper syntax to use, ABCNotation.com has a good article that explains the basics. The string that is used in the shortcode is passed to the ABCjs library, which translates and renders it into an SVG element.

Here’s an example of ABC Notation in action. The first image shows the string while the second shows the rendered output.

This slideshow requires JavaScript.

ABC Notation is an excellent example of a plugin that might not have a large audience, but will come in handy to those who need it. I tested it on WordPress 4.2 beta 3 and didn’t encounter any issues. You can download it for free from the WordPress plugin directory.

Would you like to write for WP Tavern? We are always accepting guest posts from the community and are looking for new contributors. Get in touch with us and let's discuss your ideas.

4 Comments


  1. Very niche. But it looks like it would be extremely useful in that niche.

    Report


  2. Thanks for the info. I’m not familiar with ABC notation, but seems pretty easy to learn. Somehow it reminds me of Lilypond’s syntax (but simpler, of course). It will surely be useful for my guitar and music blog.

    Report


  3. Closely related (basically the same niche audience) but with a completely different approach is my Sheet Music Library plugin (complete, needs a few tweaks before publishing), which is a custom post type with several taxonomies that works primarily off of PDF sheet music and audio recording uploads. It’ll work better for larger pieces, whereas this plugin is likely very useful for short excerpts and ideas; gives me a few ideas for use cases, in fact!

    My plugin powers my sheet music library: http://celloexpressions.com/music/. I can send the beta version to anyone interested that contacts me, more details here: http://celloexpressions.com/blog/new-sheet-music-library-the-story/. IT used pdf to image conversion to display preview directly on the site, linking to PDF downloads for the whole thing.

    Report

Comments are closed.