gome/last-fm-album-art
gome
/
last-fm-album-art
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
Include album art automatically on your site using just HTML!
2 Commits 1 Branch 0 Tags 33 KiB
JavaScript 100%
Go to file
gome d59955473f update documentation 2023-10-22 13:27:45 -05:00
README.md update documentation 2023-10-22 13:27:45 -05:00
album-art.js initial commit 2023-10-22 13:27:45 -05:00

README.md

Last.fm album art fetcher

You can include album art on your site without having to look up URLs or host it yourself!

This script uses the Last.fm API to pull down album art and insert it into a static site.

Usage

  • In the <head> of your HTML, add a <script> tag with:
    • a src attribute with the path to the album-art.js file,
    • a defer attribute present, and
    • a data-api-key attribute with your Last.fm API key.
  • In the <body>, use <img> tags wherever you want album art, with:
    • a data-album attribute containing the name of the album you want,
    • a data-artist attribute containing the name of the artist, and
    • a width and height defined, preferrably square.

With this info supplied, album-art.js will use the album and artist supplied on each <img> to search for the albums on Last.fm. If it finds the album, it will insert the album art for it into the page, and you're good to go.

If the script encounters an error during this process, it will put the error message into the data-error attribute of the affected <img> element.

Usage looks something like this:

<head>
  ...
  <script defer src='example/path/to/album-art.js' data-api-key='YOUR-API-KEY'></script>
  ...
</head>
<body>
  ...
  <img data-album='Heaven or Las Vegas' data-artist='Cocteau Twins' width='64' height='64' />
  ...
</body>

Setup

  1. First, you need to have a normal Last.fm account.
  2. Once logged in, create a Last.fm API account to get an API key.
  • The API call for album-art.js doesn't require any special authentication beyond the API key, so you don't need to fill in the "Callback URL" or "Application homepage" fields.
  1. Download a copy of album-art.js and put it somewhere on your site.
  2. Follow the Usage instructions above to include the script on any page on your site you want to include album art on.

License

If you want to credit me on your site, that would be awesome. You can credit me as gome.

If you modify (or just enjoy!) this software, please let me know, and share any useful improvements (pull requests are a welcome way to do so).