Apparently WordPress.com already has support for Bandcamp shortcodes. But what if you’re on a self-hosted WordPress site? You can create your own shortcode, using add_shortcode().

Here’s what I have in my functions.php file:

PHP
  1. <?php
  2.  
  3. add_shortcode('bandcamp', function($attr=[]){
  4.     $attr = shortcode_atts([
  5.         'width' => 350,
  6.         'height' => 470,
  7.         'album' => null,
  8.         'title' => null,
  9.         'size' => 'large',
  10.         'bgcol' => 'ffffff',
  11.         'url' => null,
  12.         'linkcol' => '0687f5',
  13.         'tracklist' => 'false',
  14.     ], $attr);
  15.  
  16.     extract($attr);
  17.  
  18.     if ($album == null)
  19.         return false;
  20.  
  21.     // the embed code itself
  22.     $iframe = sprintf('<iframe style="border: 0; width: %s; height: %s;" src="https://bandcamp.com/EmbeddedPlayer/album=%s/size=%s/bgcol=%s/linkcol=%s/tracklist=%s/transparent=true/" seamless></iframe>',
  23.         $width . 'px',
  24.         $height . 'px',
  25.         $album,
  26.         $size,
  27.         $bgcol,
  28.         $linkcol,
  29.         $tracklist,
  30.     );
  31.  
  32.     // if your site uses Gutenberg
  33.     // this is veerrrry....sloppily creating your own block
  34.     return '<figure class="wp-block-embed-bandcamp wp-block-embed is-type-audio is-provider-bandcamp wp-embed-aspect-16-9 wp-has-aspect-ratio js">' . '<div class="wp-block-embed__wrapper">' . $iframe . '</div>' . '</figure>';
  35. });

The $iframe variable is the important part. Obviously, if you’re not using Gutenberg, you can just delete the entire return sprintf('<figure thing of code and end the entire function with return $iframe;

(Yes, Gutenberg lets you easily add an HTML snippet, but it considers Bandcamp embed codes “invalid”. Uh huh.)

Generating a Bandcamp shortcode

Go the album you want to embed (we’ll use Cosmagora as an example). Under the album artwork, click Share / Embed, then Embed This Album.

You’ll get a window showing the different player styles.

You’ll get another window with options to customize your player further, along with the embed code.

Two important things:

  • be sure to check wordpress.com in the top left, so it gives you the shortcode, rather than the HTML version
  • customizing it might add some HTML attributes not in the above PHP code. If that’s the case, you can add them through the shortcode_atts() function

Aaaand that’s it! Happy Bandcamping!

More info: