Tell me more ×
WordPress Answers is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.
up vote 0 down vote favorite

I noticed that my image captions are not showing the way it should. Instead of showing the caption below the image, it shows separately.

This is the code I got when inserting an image with a caption:

[caption id="attachment_1198" align="alignleft" width="300"]<a href="http://www.mozeej.com/wp-content/uploads/2012/10/DSC_0313.jpg"><img class="size-medium wp-image-1198" title="Katugastota Color Lights - Fault" src="http://www.mozeej.com/wp-content/uploads/2012/10/DSC_0313-300x225.jpg" alt="&quot;Be aware of the vehicles coming from left&quot; reads a board hanging on the pedestrian side of the color lights in the Katugastota City just in front of the Arena Theater. A fault present from the first day till today. No body to fix it! Only a stupid board to warn people! What about a foreigner?" width="300" height="225" /></a> "Be aware of the vehicles coming from left" reads a board hanging on the pedestrian side of the color lights in the Katugastota City just in front of the Arena Theater. A fault present from the first day till today. No body to fix it! Only a stupid board to warn people! What about a foreigner?[/caption]

When viewed in a browser:

<figure class="full-width-mobile alt alignright" style="width: 300px;"><img class="size-medium wp-image-1198 responsive" title="Katugastota Color Lights - Fault" src="/" data-src="http://www.mozeej.com/wp-content/uploads/2012/10/DSC_0313.jpg" alt="&quot;Be aware of the vehicles coming from left&quot; reads a board hanging on the pedestrian side of the color lights in the Katugastota City just in front of the Arena Theater. A fault present from the first day till today. No body to fix it! Only a stupid board to warn people! What about a foreigner?"   /></a></figure>
<p>&#8220;Be aware of the vehicles coming from left&#8221; reads a board hanging on the pedestrian side of the color lights in the Katugastota City just in front of the Arena Theater. A fault present from the first day till today. No body to fix it! Only a stupid board to warn people! What about a foreigner?[/caption]</p>

As you could see, towards the latter of the second line is the "[/caption]" tag. It also lacks link tag 'a href=...'.

At the moment, the caption is just like the text, except that it ends with a [/caption] tag.

Since the url link is not present in the HTML I removed the URL segment from the HTML editor.

[caption id="attachment_1198" align="alignright" width="300"]<img class="size-medium wp-image-1198" title="Katugastota Color Lights - Fault" src="http://www.mozeej.com/wp-content/uploads/2012/10/DSC_0313-300x225.jpg" alt="&quot;Be aware of the vehicles coming from left&quot; reads a board hanging on the pedestrian side of the color lights in the Katugastota City just in front of the Arena Theater. A fault present from the first day till today. No body to fix it! Only a stupid board to warn people! What about a foreigner?" width="300" height="225" /></a> "Be aware of the vehicles coming from left" reads a board hanging on the pedestrian side of the color lights in the Katugastota City just in front of the Arena Theater. A fault present from the first day till today. No body to fix it! Only a stupid board to warn people! What about a foreigner?[/caption]

When the URL segment is removed, it shows as desired. But ofcourse without the link for the image so it wouldn't open up in pretty photo. Resut:

<figure class="full-width-mobile alt alignright" style="width: 300px;"><img class="size-medium wp-image-1198 responsive" title="Katugastota Color Lights - Fault" src="/" data-src="http://www.mozeej.com/wp-content/uploads/2012/10/DSC_0313.jpg" alt="&quot;Be aware of the vehicles coming from left&quot; reads a board hanging on the pedestrian side of the color lights in the Katugastota City just in front of the Arena Theater. A fault present from the first day till today. No body to fix it! Only a stupid board to warn people! What about a foreigner?"   /></a><figcaption>&#8220;Be aware of the vehicles coming from left&#8221; reads a board hanging on the pedestrian side of the color lights in the Katugastota City just in front of the Arena Theater. A fault present from the first day till today. No body to fix it! Only a stupid board to warn people! What about a foreigner?</figcaption></figure>

The way I see it, it is some thing that WordPress is doing. Because according to my knowledge Short Codes are processed in PHP, so I don't think any JavaScript is doing the mess.

But still how can the close tag "[/caption]" be on the content? I am a bit puzzled. Would be great if you can help me out.

What could be the cause of it? How can I overcome it?

The link to the post: http://wp.me/p2Esxn-jj

share|improve this question
If I don't add a caption, every thing is fine. The problem is when I add a caption to the image. – Ziyan Junaideen Oct 11 '12 at 17:41
I cannot reproduce issue with your example code. Do you have any related plugins enabled? Try disabling plugins and switching to default theme and see if issue persists. – Rarst♦ Oct 11 '12 at 17:55
I did deactivate all plugins, but same result. I have two more blogs, they don't have this issue. Could it be the theme? If it is, what type of code should I look in to? – Ziyan Junaideen Oct 11 '12 at 18:06
I guess that does leave theme (that is if you can confirm that issue goes away in default/different theme). It's hard to guess, I'd look for things that hook into img_caption_shortcode or something like that. – Rarst♦ Oct 11 '12 at 18:08
@Rarst thanks, searching through the file I found functions that handle the hook. One does some manipulation to the code, specially the link. I am looking in to it. Now I got a place to look! A big thanks! – Ziyan Junaideen Oct 11 '12 at 18:21
show 2 more comments

closed as too localized by Rarst♦ Oct 13 '12 at 19:32

This question is unlikely to help any future visitors; it is only relevant to a small geographic area, a specific moment in time, or an extraordinarily narrow situation that is not generally applicable to the worldwide audience of the internet. For help making this question more broadly applicable, see the FAQ.

Browse other questions tagged or ask your own question.