Text wrapping of image captions
-
In the theme I used previously (Vigilance), captions under images wrapped automatically to fit under the image. But now that I’ve switched to Photolia, that doesn’t happen. Here’s an example:
The winding road to Bloomington: The Dixie Highway and State Road 37 in Indiana
Notice the map image and its caption. The caption doesn’t wrap on that right-aligned image and leaves a big blank space right of the image.
How can I get back those lovely wrapping captions in Photolia?
The blog I need help with is: (visible only to logged in users)
-
Hey Jim,
It looks like this is something that could be improved within the theme. I’ve passed this along to our theme developers. I’ll let you know as soon as I know more!
-
-
-
Hello! It looks like some changes may have been made to the way captioned photos display. But these changes have some real challenges that I’d like to see addressed. Please see this post, which is a good example, but these changes are showing up throughout my site:
The images I captioned are not displaying at the size I chose; they are instead all being limited to some predefined width. Also, they all have an enormous gray box around them.
What I want is for all of my captioned photos to not have a gray box around them, as before, and to display at the size I set for them. I also want the caption text to be left justified, as before this change.
Thanks!
-
Hey Jim,
It looks like some changes were made to the way captions are being handled in Photolia. The main change you’re referring to holds images with captions to 50% of their original width. I passed this feedback along to the theme developers so they can consider potentially revisiting the change.
For now, you can use the following CSS to override the 50% limit and remove the background color:
.wp-caption { max-width: 100%; background-color: #fff; }Just copy and paste that under Appearance -> Customize -> CSS.
Can you give that a try and let me know if it accomplishes what you’re looking for?
-
Jeremey,
Thanks – it helps, but it doesn’t bring it all the way.
The images are centering. When I don’t specify alignment, I want them to left justify. When I do specify alignment, I want them to follow that alignment.
Also, the captions are still centering, and they are again not wrapping. I want them to left justify, as they did before. When I force text-align=left in the CSS, which I did, the text doesn’t even left-align with the image – it left-aligns with the background.
Also, I do not want a background behind the image *at all* because it screws up the spacing on my page. Images with no caption have less space above and below than images with captions, and it looks all janky. Also, it gives a gap-toothed look to the post, as spacing between paragraphs differs from spacing between a paragraph and a captioned image.
Take a look at the posts I linked to earlier in this thread to see what I mean.
-Jim
-
Hey Jim,
Please see below!
The images are centering. When I don’t specify alignment, I want them to left justify. When I do specify alignment, I want them to follow that alignment.
I definitely understand! I’ve passed this feedback along so this can be adjusted moving forward.
Also, the captions are still centering, and they are again not wrapping. I want them to left justify, as they did before.
Understood! It’s still being worked on.
Also, I do not want a background behind the image *at all* because it screws up the spacing on my page. Images with no caption have less space above and below than images with captions, and it looks all janky.
I definitely understand your preference here. However, this isn’t so much a “bug” as it is a “designer’s choice” to have a background image for captioned photos.
Either way, if the background images stay put for captioned photos, we can remove them entirely and fix the padding with custom CSS so this looks great.
Let’s just see what happens when the adjustments are completely done so we know what we have to work with moving forward!
-
Thanks Jeremey!
Let’s see how the developer/designer finishes working through this captioning issue. If that doesn’t result in exactly the look I want, then perhaps I can enlist your help in figuring out the CSS that will get me there.
My hope is that the developer/designer reverts captioned photos to the way they worked before in Photolia *except* that captions wrap under the photo. The other things that have shown up on captioned photos — the gray box behind, the centered caption, the shrunken image size — are different from when I bought Photolia. I’m not sure I understand why it would be necessary or desirable to change these design elements now.
-Jim
-
Hey Jim!
I really appreciate your patience with this one. Let’s see how this ends up looking at the end. Regardless, we’ll get it looking great!
-
Jeremey,
What is going on with my theme? Now all the images I’m hosting at WordPress are centering rather than left justifying. Meanwhile, the images I host at Flickr are still left justifying. It’s making my blog look like a hodgepodge.
What I want is for all images to left justify by default, regardless of where they were sourced, as they did when I bought the Photolia theme. (By the way, these images left justify in the editor.)
I selected the Photolia theme very carefully because it gave me the look I wanted, which included its default image alignments. While I get it that a lot can be fixed with CSS, it was not my vision when I bought this theme that I would have to do custom CSS to get the look I originally got with the theme.
Thanks,
-Jim -
P.S.: The WordPress-hosted images are also no longer respecting the dimensions I set for them. On my post today, I set most images to display at 640px wide. They’re displaying narrower than that. -Jim
-
Hey Jim,
I really appreciate your patience on this and realize this is quite frustrating. We’re continuously passing feedback back to the theme designer. When they’re making changes, please note they’re not looking directly at your site so some changes may adversely affect your images (the Flickr ones particularly as the designer may not have Flicker embeds while testing).
It’s a work in progress, and we’re trying to make it as seamless as possible. Unintended consequences will arise. We’ll keep updating!
-
Hi Jeremey,
I’m sorry I let a little of my frustration show in my last message. I can see that you’re kind of in the middle between me and your theme designer, who IIRC is a third party.
My blog is just my hobby, but it’s my main one. I’ve been writing in it 7.5 years now. I’ve built a readership. Many of my blog posts feature in the top five results for certain Google searches. It’s a joy!
So when things don’t go as I think they ought to, I do feel frustrated.
It doesn’t help that just after I switched to Photolia, I learned that readers on certain slightly older browsers were seeing only a blank page. To make a long story short, blogs on Photolia don’t display at all on some slightly older browsers when the Custom Fonts upgrade is in use. I have that upgrade. It took a developer quite some time to pin down this bug but in the end I was told that this problem would not be fixed. I reluctantly chose to stop using this upgrade, which was disappointing. I tell you this not to complain or to pile on, but to give you some context — I had some disappointments with Photolia before I reached out about this problem. So I was a little frustrating going in.
But I’m also a 25-year veteran of the software industry. I’m currently Director of QA for a young software company in Indianapolis. So I understand that problems can be thorny, that legitimate bugs sometimes don’t get fixed, and that third parties can be beyond your control. So I do get how this works, and I sympathize.
Thanks,
-Jim -
Hey Jim,
You’re correct in that the theme is through a third-party so we don’t have direct control over how the theme looks. However, that doesn’t mean we can’t get it to look how you want! As for your previous trouble with Photolia, I definitely remember struggling with that one. It was super tricky and frustrating.
Where we are now: the theme developer has finished making changes to the theme. So, it’s time for us to tinker away if necessary. First, I believe you’re going to want the background removed from captioned images and the spacing tightened up a bit. Here’s the CSS for that:
.wp-caption { background-color: #fff !important; padding: 0; }The “important” tag is necessary in this case.
As for the image caption wrapping, the design that the theme author chose doesn’t wrap captions until they hit a certain width. For example, the caption here doesn’t wrap (it centers now instead):
The winding road to Bloomington: The Dixie Highway and State Road 37 in Indiana
Is that something you would like to adjust through CSS?
-
Jeremey, thank you.
I think I’m going to just accept most of how this works now and move on. I think it doesn’t make sense to either press the theme developer to make the last 7.5 years of my blog all look just as I want it, or have you write piles of custom CSS to make that happen. Truthfully, 80% of my old posts get so few visits a year that it’s not worth it.
For the few dozen old posts that do get a lot of visits thanks to mama Google, if they look wonky thanks to how the theme works now, I will go fix them manually to work around it. And going forward, I will avoid situations that don’t play well with how the template works now, such as a tall, narrow image with a long caption.
<b>There is, however, one thing that I would like your help with.</b> I still want my images hosted on WordPress to left justify (when I choose Align=None), and always honor the dimensions I set for them. Actually, I consider it a bug that when I set an image at, say, 640px wide that the theme doesn’t actually display it that wide. But if there’s a way to fix this with CSS I’ll just do that and let it go.
I really appreciate your help with all of this.
-Jim
-
P.S.: I dropped that CSS in to remove the background around the image and it works great.
-
Hey Jim,
Before I tinker with the alignment/sizing, I just want to make sure I have it right. I’m using this post as an example:
In that post, the second image down (“Michigan Street, US 31, filled with people between the Palace and the Granada.”) is set to align-none within the post. However, it’s appearing center aligned. Correct?
Regarding the sizing, it’s set to “full”, which for that image is 598×315. I’m seeing 598×315 when I view the dimensions within the post. For the picture below that however, you have specified 617×499, but it’s appearing as 602×487. Is that the correct kind of discrepancy you’re referring to?
-
Jeremey,
You have it all right.
All the images in that post s/b set to align-none, but they’re all centering, including the second image down.
That second image was uploaded at the size you noted so that’s as big as it will ever be.
The next image was uploaded at 617×499. So I’m looking for it to display at that size, since it is narrower than the text area.
The next image, a color image of the Granada Theater, was uploaded at 705×397, which is wider than the text area. Photolia used shrink it to fit edge to edge within the text area. That’s the behavior I’m looking to get back to.
-Jim
-
Thanks for clarifying Jim. I’m on it! I just want to make sure I have the best CSS solution going forward so I’ve reached out to our theme developers for assistance. I’ll get back as soon as I have the code for you!
- The topic ‘Text wrapping of image captions’ is closed to new replies.
WordPress.com Forums 