If you are adding an image (or other media file) to the WordPress Media library you can set certain meta-data, like Caption, Alt-Text and Description. I wanted to make part of the Caption a clickable link that refers to the source/website of the picture to give proper credits to the original author. Unfortunately this is not really a common habit in the blog-o-sphere I’ve noticed (trying to find the sources of one original image), so it made even more sense to me to create a solution for proper attribution.
The most easy might be to switch to Text view and add some anchor text around the part you want to link. However I liked a more user friendly solution in which the source is stored within the Media Library itself.
I started out trying some plugins like media-credit and better image credits. However they added too much stuff around it, while I essentially wanted hyper-linked caption.
Luckily I came across a solution from Kaspars Dambis; How to Automatically Add Image Credit or Source URL to Photo Captions in WordPress. It behaved a bit strange with https links, but it was a solid base to work on. He created a filter for the ‘img_caption_shortcode’. You can read more about how Captions work in Justin Tadlock’s blog.
Solution
Most of the solution was already provided by Kaspars Dambis. I’ve added an extra field below the Source URL field in which you can fill in the credits. If you fill in the source URL only, the whole text in the Caption will change in a hyperlink to the source. If you fill in the credits field, that will be added to the caption (after a ‘-‘ symbol) as a hyperlink.
To use this, just copy-paste the code to the functions.php of the theme (or child-theme) that you are using.
Result
Check the result of the plugin in my article on dynamic light (in Dutch only) at the Lumiflow website.
Hi Kasper
Thanks for this code. I’ve added it to my site using the code snippets plugin and it looks like it will be great for adding credits for featured images but it doesn’t seem to add the credit options when editing images that I’m inserting into the body of a post.
Is this correct or am I doing something dumb? :-)
Thanks for any advice as I am a quite new to wordpress and not the best with code in general!
Hi Kasper – ignore earlier comment, have found out where it was, you need to add credits when adding the image not after!!!
Thanks for the code – so much easier to add credits now.
Hi Kasper
Loving this solution but does this work for adding credits to featured images?
I didn’t test that. You could write your own function that’s triggered when a featured image displays.
For featured images, I just added this in the single.php file located in my child theme :
source: <a href="source_url; ?>” target=”_blank”>source_credit; ?>
Thanks a lot for this post Kasper.
I wrote a conditional snippet that can be added right bellow the featured image ( the_post_thumbnail(‘full’); ) in single.php file, located in the child theme.
source_url;
$source_credit = get_post(get_post_thumbnail_id())->source_credit;
if (!empty($source_url) && !empty($source_credit)) { // DISPLAYED ONLY IF BOTH FIELDS AR NOT EMPTY!
echo ‘source: ‘ . $source_credit . ‘‘;
}
?>
Hi Kasper, thank you so much for this! That’s exactly what I’m looking for. Is there a solution to show the credits without enter an url? If i did not enter the url, the credtis will not be displayed.
Difficulty I’m having is adding these custom fields to output when there is no caption content. Not sure how to do this without img_caption_shortcode filter, since displaying these custom fields depends on having caption content. Any ideas on that? Thanks!