How to reduce the code footprint of the Unsplash credit badges
• 4 min read
Reduce the footprint of the credit badges code provided by Unsplah to ease the creation of attribution lists.
Have you ever visited the Unsplash site? I like fotography very much and I enjoy having nice pictures on my blog. Unsplash is one of my prefered sources...
Let's be fair: the fotographs who publish their pictures on unsplash do deserve some gratitude - at least in form of a proper attribution! Hence I wanted to list all the Unsplash pictures I do display on my pages and add the correct references.
Great: Unsplash is providing us with some ready-to-use code snippets to generate according mentions (see below). It best suits to display a few "credits". For a longer list of attributions, the format may not be really suitable, as it produce a lot of code repetitions. Just imagine a "Credits" page listing a large amount of picture references... DRY Alarm!
At least, one can manage to reduce the "Don't Repeat Yourself" burden using the following two code snippets - while respecting the original corporate design:
For comparison, the following is an example of the original credit badge:
The objective has been attained - as well as a DRY win!
The described solution can easily be integrated in existing pages, scripts etc.
Hence, I'll need to adjust the design of my Ghostination theme in order to ease the usage of those badges... tbc.
Using Ghost, I'm able to integrate Unsplash pictures seamlessly into my blog articles: Ghost offers a function to use/paste a direkt link to the Unsplash API to provide the pictures in an appropriate format. The pictures are not saved in the blog in this case.
Though I personaly preffer to download local copies of the pictures from the Unsplash server first and then to upload those local versions into the blog.
There are at least 2 advantages in doing so:
The blog avoids a potential "privacy" issue due to a direct link to an external server, which can be tracked when a visitor is displaying one of the blog's pages.
I'll take the time to document the pictures I'm integrating in the blog and to credit the photographs appropriately.