Shortcodes, templates, and external data

I wanted to build a plugin that would give a shortcode so that users could provide a Bandcamp URL like inside a shortcode like:

{{< bandcamp >}}

and get a nice little player widget. Bandcamp supports these widgets as iframes. There are some parameters I could support as well to style the widget.

However, those Bandcamp iframe urls require codes that are not present in the URL such as this:

<iframe style="border: 0; width: 100%; height: 120px;" src="" seamless><a href="">Piecing It Together by Free Throw</a></iframe>

That’s the code Bandcamp gives you when you use the little “embed builder” on an album’s page. For my own use, I could just use that code.

They even provide a Wordpress shortcode like:

[bandcamp width=100% height=120 album=4069831852 size=large bgcol=ffffff linkcol=0687f5 tracklist=false artwork=small]

which my plugin could support. But, I really wanted the user to just be able to give the URL to the page instead of messing with all this embed stuff.

When I did this previously on an 11ty site, I had a little JS snippet that could request the URL, pull out the codes from the meta tags in the HTML (screen scrape basically) and use that to populate the HTML. Is such a thing possible with Hugo/MB? I found the getJSON and getCSV functions but Bandcamp doesn’t have that data format available.

Fetching a URL is realativly straight forward with resources.GetRemote but parsing is… ugly. :scream:

Also, you might want to check out the Bandcamp shortcode by @shindakun.


I see that person faced the same challenges I am. I think your meta parsing example will actually work for what I want to do. I’ll give it a shot this weekend.

Thanks for the tips.