Need help? Check out our Support site, then


Aligning Captions Flush Left

  1. Does anyone know how to get photo captions to align flush left? We can't get our to do anything but center. The site is http://tenleytimes.wordpress.com.
    Thank you,
    DA

    The blog I need help with is tenleytimes.wordpress.com.

  2. It could be just me, but the captions on wp.com are very touchy. If you center a picture, the caption will center. Align an image right or left, and the caption will do the same. Apparently some folk in the past have gotten captions to link to other posts or sites (?, though I have not been able to link in captions!). And if you further confuse the visual editor by adding text color,size, or whatever, the formatting it messes up the caption.

    To my experience, both the caption and gallery features in wp.com are not fully functional.

    I'm best able to make posts look the way I want by ignoring the caption 'feature' and just inserting an image, then writing about it in the post.

    Tables, of all things, let you have more control!

  3. Thanks. I tried aligning the image to the left but both it and the caption remained centered. How were you able to get the image to align?

  4. panaghiotisadam
    Member

    Captions are designed as centered, and you can't change that because they are in what WP calls "shortcode": a ready-made formula, the parameters of which we cannot access. If you want full control over your image legends, you have to use html coding for tables. But since your legends are long phrases, I don't see why you need the caption option: as Tess says, plain text in the post would do.

  5. Hi panos,
    Have you ever gotten a link to work in a caption?
    I remember that someone was recently talking about doing that, but not who, and I have not been able to do it. Wonder if you added the link in html editor and never switched back to visual before publishing if it works—same maybe if you formated the caption align left or right only in the html editor. ??? I think I've seen that formatting on someone's blog as well??? It's too touchy and unreliable for me to understand???

  6. panaghiotisadam
    Member

    You remember well - case 1 here:
    http://en.forums.wordpress.com/topic/links-in-caption-of-images?replies=4
    Case 2 here:
    http://en.forums.wordpress.com/topic/image-text-alignment?replies=8
    Case 2 is messed-up coding.

    I'll run my tests and let you know..

  7. Remember, yes. Find: wow! you are amazing!

  8. panaghiotisadam
    Member

    I have a memory problem...

    So: Re linking, no. I could get the link code in the editor alright, but the result was no caption at all in the published post. Re alignment, I could find no decent way to change it.

    But I wouldn't bother. As you know, if you want an image with a legend aligned anyway you like, and the whole thing enclosed in a border or whatever, you can do it with html. And of course an alternative is editing the image to incorporate the legend in the image itself. (While the simplest thing is what you're saying at 4:56 AM above - that's what I do too.)

  9. So here is a simple table for 2 pictures across, with a caption below each picture:

    <table border="0" align="center">
    <tbody>
    <tr>
    <td>IMGAGE1_HERE</td>
    <td>IMGAGE2_HERE</td>
    </tr>
    <tr>
    <td>CAPTION1_HERE</td>
    <td>CAPTION2_HERE</td>
    </tr>
    </tbody></table>

    Copy the code above in the HTML editor. Then you can switch to the Visual Editor to insert pictures and captions.
    If you want only 1 picture and caption, take away the lines for img2 and capt2. Or add more "td… /td" lines for more cells across. align can be center, left or right.

  10. panaghiotisadam
    Member

    (May I ask my respected colleague what this has to do with armstrongtt's question?)

  11. Oh, the original poster wanted to display pictures with left aligned captions. I suggested a table, but gave no concrete example. And now I can't work out how to align the caption to the left in the cells. I like captions centered so have never tried to adjust that aspect. Do you know how?

  12. May be irrelevant, but I figured it out:
    A picture and caption centered in the post with a left aligned caption:

    <table border="0" align="center">
    <tbody>
    <tr>
    <td style="text-align:center;">IMAGE_HERE</td>
    </tr>
    <tr>
    <td style="text-align:left;">CAPTION_WHICH COULD BE
    LONG</td>
    </tr>
    </tbody></table>

    With table data use "text-align:attribute", not "align=attribute"
    Of course the image and the caption can be left, center, or right.

  13. panaghiotisadam
    Member

    "Do you know how?" Ah, now my respected colleague proceeded to insulting me!

    Can be simpler than your solution. Just write
    <td align="DEFINE">
    (where DEFINE can be left, center, right or justify.)

    But I don't think this is useful to armstrongtt: his posts have single images with descriptions. I would stick to your original suggestion.

    For a formidable table tutorial check this:

    http://www.w3.org/TR/html401/struct/tables.html

  14. Hey panos! Never insult you.
    You are right, I just had to overcome my lack of knowledge for myself. That link is exactly where I went! Beats my 10 year old HTML book.

  15. panaghiotisadam
    Member

    Just joking! (You see, how to align an element is very simple: no way I wouldn't know that!)

  16. oooh I should have made it clear that it was my question! (I knew you knew. But I didn't.)
    I missed the difference between "text-align:attribute", and "align=attribute" so it's a simple thing, but it tripped me up.

  17. panaghiotisadam
    Member

    To carry on with the joking, "I knew you knew but I didn't" isn't the most lucid of phrases...

  18. you didn't know i knew you knew …
    "Alas, I am a woman friendless, hopeless!"
    <3

  19. All,
    Thanks for the input, but I am completely lost. I don't understand what links have to do with it. Is there some way to get captions to align left? If so, how? Can you provide step-by-step instructions?
    Thanks again.

  20. The simple answer is no,
    you can't make captions align left. The "feature" is written in wp.com shortcode and we are not able to edit it.

    If you are using pictures the full width of your posts, the easiest way is as I said:
    "… just inserting an image, then writing about it in the post."

    My apologies about confusing you with the links question. Someone had managed to put links in his captions, but he did not know how he did it, nor do we: it has nothing to do with your question, especially because even staff said it was not possible. There was also a poster who had managed to make a caption align in an odd way by mistake. Most mistakes with captions involve deleting the photo but having the caption remain to mess up formatting of the rest of the post.

    I sometimes use small pictures, 2 or 3 across the post, so I use tables to have captions below. I like the captions centered below the images, but you can control the alignment of data (pictures or text) in a table.

    A table could be as simple as 1 box wide and 2 rows long: a picture in the top row, a caption in the second row.

    My post at Feb 11, 2009, 3:18 PM is how to make a table centered in a post, with a picture on top (centered) and a caption aligned left below.
    http://en.forums.wordpress.com/topic/aligning-captions-flush-left?replies=19#post-308388

    To use it, just copy my code into the HTML editor. Switch to the visual editor, and where it shows "IMAGE_HERE" insert your picture and delete the words. Where you see "CAPTION_WHICH COULD BE
    LONG" write your caption. (highlight those words and write what you like.)

    I don't write my tables every time I write a post. I save the code for my most common format as a draft. When I want to have a table in a post I just open the draft for editing, copy the code in HTML to the new post, switch to "visual" and then insert pictures and text that I want for the new post.

    By the way, if the border around the picture and caption is important to you, panos can surely add the code to make it. My table has no border.

  21. panaghiotisadam
    Member

    Sure... Armstrongtt is using Pressrow, which creates a light grey background with a grey border. Here's a simple solution:

    <table style="border:solid 1px #cdcdcd;background-color:#eeeeee;padding:2px;">
    <tr><td>IMAGE_CODE_HERE<br />CAPTION_HERE</td></tr>
    </table>

    (Note that this is not an all-purpose solution: it's for single full-size images, aligned to none.)

  22. Elegant. A table can be just one box.

  23. panaghiotisadam
    Member

    Elegant, but on second thought... With the above version the caption gets too close to the image. So back to normal:

    <table style="border:solid 1px #cdcdcd;background-color:#eeeeee;width:WIDTH_OF_IMAGE_PLUS_FOURpx;padding:2px;">
    <tr><td>IMAGE_CODE_HERE</td></tr>
    <tr><td>CAPTION_HERE</td></tr>
    </table>

    Made another improvement too. The previous version would be ok for images that cover the entire width of the theme, or for short captions, otherwise the caption text would spill past the image. So I added the width attribute to limit the caption text to the width of the image.

Topic Closed

This topic has been closed to new replies.

About this Topic