View digital sheet music with the WordPress block editor – WordPress Tavern
PhonicScore, a Vienna-based company, recently released its OpenSheetMusicDisplay plug-in (OSMD). This is a WordPress block designed for rendering digital sheet music in the browser.
This is the type of plugin that allows the beauty of the block editor to shine. A few years ago, such a feat would only have been possible via the shortcode system. Users should have manually typed in all of the shortcode’s arguments – assuming they could all remember everything – and preview the message to see what it would look like. Today, they can interact and make changes directly to their score display from the editor.
OSMD was never a first WordPress project. It is a stand-alone library that the company has decided to make available to WordPress. With the power of the block system, they were able to do it. One can only hope that we see investments in our community from similar projects now that the block editor has become more stable.
We are barely digging below the surface for what will be possible over time. Blocks like OSMD build on the optimism I had when the system was first unveiled.
To use the plugin, users simply need to insert the OpenSheetMusicDisplay block into their content canvas. It is located in the Integrate category. From there, they have to select or download an XML file through the blocking options sidebar (
.mxl files are supported). Dragging and dropping a file does not work in this version – maybe a feature request for 2.0?
The “Basic options” tab has several width and aspect ratio settings. For the most part, it’s probably best to leave these defaults. However, it will depend on your theme and the space it offers.
The block does not currently support the standard wide alignment system. Instead, it has a width option, allowing users to determine the front output. Since this is a non-standard option, it may not work well with all themes. Depending on how the user’s active theme handles the width of the content, they can achieve very different results.
The “Drawing Options” tab is where users have more control over customizing the output. These settings allow users to determine what is “drawn” in the digital score. One option is whether to draw the composer’s name. Another is to produce time signatures. With 10 settings in total, there is a lot to tinker with.
The biggest problem I encountered with the plugin was the editor freezing every now and then. It appeared that the block was trying to recharge, even when I was working outside of it. This happened even though you cleared the “Render automatically on change” check box.
Overall, this plugin should serve those users who want to display sheet music well. It is simple to use and offers plenty of customization options. The team has a OSMD library demo in action on their site.
For those who are not inclined to share digital sheet music, well, we can all appreciate the genius of JS Bach. Air: