Need to display image caption on blog (source of image legal)

[ktheory]

Hello,
I need to display the image caption below the post image as a source for legal reasons (like most blogs). I can’t figure out a way to turn it on??

I’ve also looked at the hooks and tried to add it using the “sf_post_content_start” action, but it doesn’t start until the content. Is there a hook that I can add_action to?

[Rui Guerreiro – SUPPORT]

Hi,

You can do it using the image asset, there is an option to show the caption below the image.

Check this example:
https://www.dropbox.com/s/c81pbrq4feelw0z/Screenshot%202017-01-23%2016.58.42.png?dl=0

http://uplift.swiftideas.com/elements/image-lightbox/

Hope it helps.

-Rui

[ktheory]

Thanks Rui. Unfortunately, that doesn’t solve the issue on the blog pages. As with most blogs, you must credit the news/image source, but the blog output options(archive page, blog SPB modules, and default post outputs) don’t provide this for featured images (post_thumb) or as an excerpt.

Moreover, the ALT tag is replaced with the post title, so I can modify with javascript either.

Any ideas or updates??

Thank you

[Rui Guerreiro – SUPPORT]

No there isn’t any option for that. Aren’t you using the page builder to create the posts content?

-Rui

[ktheory]

I’m using the post builder to output the blog (recent posts carousel, and timeline), but not the post builder to create blog posts.

Is there a SF hook I could use to add_filter or add_action to add the caption? For example, I kind of hacked a workable function on the blog single pages by using the sf_post_content_start hook to add the get_post(get_post_thumbnail_id())->post_excerpt, but it does not work on the blog archive, blog list, or recent posts.

Or, if the ALT tag was working (and not outputting post title) I could use javascript to add the caption at page runtime.

I love your themes, but I’ll admit that I’m surprised that this common functionality is not available. Image source/credits is a pretty common requirement for blogs.

Any pointers would be much appreciated.

[Rui Guerreiro – SUPPORT]

Let me forward this to our head developer to see what can be done.

-Rui

[Swift Ideas – Ed]

Hi @ktheory

It’s not something that you commonly see in themes, which is why it’s not included as standard. Feel free to override this function, to output whatever you need:

if ( ! function_exists( 'sf_image_post' ) ) {
        function sf_image_post( $postID, $media_width, $media_height, $use_thumb_content, $return_url = false ) {

            $image = $image_srcset = $media_image_url = $image_id = "";
			
            if ( $use_thumb_content ) {
                $media_image = rwmb_meta( 'sf_thumbnail_image', 'type=image&size=full', $postID );
            } else {
                $media_image = rwmb_meta( 'sf_detail_image', 'type=image&size=full', $postID );
            }

            foreach ( $media_image as $detail_image ) {
                $image_id        = $detail_image['ID'];
                $media_image_url = $detail_image['url'];
                if ( isset($detail_image['srcset']) ) {
                	$image_srcset = $detail_image['srcset'];
                }
                break;
            }

            if ( ! $media_image ) {
                $media_image     = get_post_thumbnail_id();
                $image_id        = $media_image;
                $media_image_url = wp_get_attachment_url( $media_image, 'full' );
                $image_srcset 	 = wp_get_attachment_image( $media_image, apply_filters( 'sf_post_main_image', 'full' ) );
            }

            $detail_image = sf_aq_resize( $media_image_url, $media_width, $media_height, true, false );
                        
            $image_meta 		= sf_get_attachment_meta( $image_id );
            $image_caption = $image_alt = $image_title = $caption_html = "";
            if ( isset($image_meta) ) {
            	$image_caption 		= esc_attr( $image_meta['caption'] );
            	$image_title 		= esc_attr( $image_meta['title'] );
            	$image_alt 			= esc_attr( $image_meta['alt'] );
            }
            
            if ( $detail_image ) {
                $image = '<img src="' . $detail_image[0] . '" width="' . $detail_image[1] . '" height="' . $detail_image[2] . '" alt="' . $image_alt . '" />';
            }
			
			if ( $image_srcset ) {
				$image = $image_srcset;
			}
			
            if ( $return_url && $detail_image ) {
                return $detail_image[0];
            } else {
                return $image;
            }

        }
    }

Hope that helps.

– Ed

[ktheory]

Thanks Ed!
As mentioned, this function helps on the blog single pages, but not on the output for the archive, carousel, recent posts, etc. Is there a global image hook you use for featured? Or do I have to pull all the separate functions (sf_get_recent_post_item, sf_post_thumbnail, etc)?

Thanks for the continued support!

Jeff

[Swift Ideas – Ed]

Hi Jeff,

Yes – you’d need to override those too, let us know if you need advice on which functions they are.

Thanks,

– Ed