How to add image caption for plugin

Hey Manoj,

There’s definitely not a plugin for this and trying to use another plugin for this would probably break it.

So yes, in order to fix this you would probably need to mess around the plugin PHP code and some jQuery later on. I would probably do it through a data tag. If don’t know any PHP or Jquery/Javascript maybe you could get a developer to do this for you/

If you know some php, you can do this by adding the caption at line 275 of ‘jsjSlideshow.php’:

// Start Gallery
		$output .= apply_filters( 'gallery_style', $gallery_style . "\n\t\t" . $gallery_div );
		$i = 0;
		foreach ( $attachments as $id => $attachment ) {
			$i++;
			  // This comes from line 770 of wp-includes/media.php
			$attributes = array(
				'data-galleryid'   => $instance,
				'data-link'   => wp_get_attachment_image_src( $id, "full" ),
				);
			$output .= wp_get_attachment_image( $id, 'pageWidth', false, $attributes);
		}
		$output .= "</div>\n";

I have tried this but it shows image caption on slider means it shows caption as slide i have put this code `// Start Gallery

$output .= apply_filters( 'gallery_style', $gallery_style . "\n\t\t" . $gallery_div );
		$i = 0;
		foreach ( $attachments as $id => $attachment ) {
			$i++;
			  // This comes from line 770 of wp-includes/media.php
			<strong>$output .= "
				<{$captiontag} class='wp-caption-text gallery-caption'>
				" . wptexturize($attachment->post_excerpt) . "
				</{$captiontag}>";</strong>
			$attributes = array(
				'data-galleryid'   => $instance,
				'data-link'   => wp_get_attachment_image_src( $id, "full" ),
				);
			$output .= wp_get_attachment_image( $id, 'pageWidth', false, $attributes);
		}

[Moderator Note: Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

here is video : https://screencast.com/t/DS9O1Suk4

Is there any another way to add caption over the image and not as slider

Thanks

Here’s how i would do it.

1. Add caption as a data attribute (data-caption), underneath data-link

2. Using the onPrevNextEvent event in the javascript, code it up so that

– when the slide changes, you populate a div with the caption
– then you position:absolute the div over the image

3. Write the correct CSS so that it works (this is not simple and will take a lot of tinkering around)

…

You might be able to do it the way you’re doing it, but i think you need to mess around with the css in order to get it right.

Let me know if this works.

OK i will try and let u know if it works or not.I added attribute for images just fetching part to div is left

here is added code

$attributes = array(
				'data-galleryid'   => $instance,
				'data-link'   => wp_get_attachment_image_src( $id, "full" ),
				<strong>'data-caption' => wptexturize($attachment->post_excerpt)</strong>
				);
			$output .= wp_get_attachment_image( $id, 'pageWidth', false, $attributes);

thanks for reply

Hey Jorge Silva-Jetter,
Please help me to how to fetch that caption into div I have tried so much but not got success.I will do css part just after caption is fetching in div just need to fetch it into div.

Please Reply
Thanks

Hey Jorge
Happy to to told that i have resolve this problem by adding only 1 function in java script and it works

1) What i do is add alt attribute as caption for image which

$attributes = array(
				'data-galleryid'   => $instance,
				'data-link'   => wp_get_attachment_image_src( $id, "full" ),
				'alt' => wptexturize($attachment->post_excerpt),
				);

2) after that by referring this link https://jquery.malsup.com/cycle/caption.html

add `after: function() {
jQuery(‘#image_caption’).html(this.alt);
},`
in Javascript

And it works Please update plugin for image caption If above code is suitable and give caption on/off link to admin setting.

Thanks

thanks buddy for great Plugin

Glad you resolved it! It’s always useful to learn some jQuery!

I might put some feature in for caption… or I might not. Right now, I’m more interested in keeping it simple and clean, which is the reason why I made the plugin in the first place, but thanks for the tip!

If you like the plugin, please review it!

https://www.ads-software.com/support/view/plugin-reviews/jsj-gallery-slideshow

Hi,
I’m looking to add the exact same functionality to a wordpress site i’m working on. I’m a bit confused. Could you tell me:
i) what code I need to add,
ii) the files i need to add it to, and
iii) the line i need to add it on?

Any help would be much appreciated. Great plugin, just want to add short comments to it!

hey dalejones789

is u downloaded that plugin if yes

open file jsjSlideShow.php

find comment // Start Gallery HTML Code

below of this comment there is foreach loop. in that you just add attribute what you wanted.

then find comment // Add Code to initiate Galleryjsj-slide-showf

in that javascript get that attrubute

that’s it var readtitle = jQuery(this).attr(‘image_title’);

for ex:

i have pass attribute

$attributes = array(image_title' => wptexturize($attachment->post_title)
				);

and getting that in js with this code var readtitle = jQuery(this).attr(‘image_title’);

Sorry but I can’t find
// Add Code to initiate Galleryjsj-slide-showf

Is it in the jsj-gallery-SlideShow.php file?

That’s from an old version of the plugin. That comment is no longer there.

The gallery init code is now in js/jsj-gallery-slideshow.js. It’s minified, which makes a bit hard to read, but you can take a look at how it works in main.js : https://github.com/thejsj/jsj-gallery-slideshow/blob/master/js/app/main.js

Then, maybe, copy that over to the main.js into jsj-gallery-slideshow.js, replacing the old content.

The idea is basically that you add the captions as attributes in the php side, and then look them up with jquery.

Again, thanks for the quick responce, but i’m not a programmer (only good with copy and paste ?? )
So this is to difficult for me.

I don’t think copy paste will be enough for this one!

Wait for a a week or two and I can add this to the plugin. A couple of people have been asking for it already.

that would be great.