WordPress 3.9 – Borders around pictures
-
Could anybody help me how to get change or rid of the borders around the images? I was able to do it with the image properties, but this option is no longer available in 3.9.
https://blogtimenow.com/images/add-border-frame-shadow-wordpress-images6.jpg
-
WordPress no longer adds any border around images like that, so you need to determine where the borders are coming from. It’s probably some CSS in your theme, so you’d have to post the URL of your website for somebody to look at it and see the borders you’re talking about.
I use Graphene theme. If it comes from the theme, this means I will not longer be able to control the borders on individual images. Well, that would be really bad!
The website is https://www.nautilus-intl.com
Do you have an example of the two different cases? One where you “fixed” the issue from before the update, and one showing the difference now? I can’t tell when that site had the images added to it or whether it’s one of the before or after cases here.
In order to determine what it should like, I need to see what happened when you fixed it before. In order to determine what it is doing now, I need to see an example recently made where it has the problem.
Good point! The animated gif flag on the front page doesn’t have the border – I removed it before 3.9 by adjusting the border size to 0 in the menu presented in my first posting. The code for that image shows:
style="margin: 0px; border: 0px currentColor;"
I guess, I have to adjust manually now in the text editor. Doesn’t look like a step forward.
I’m not exactly sure what you consider to be the “border” here, as such. That flag image doesn’t have a caption, for example, so that changes things a bit.
There are several places in your theme that affect the margins and border of the images on that front page.
The first area is in the theme’s style.css file starting on line 1231. It looks like this:
.entry-content img, .wp-caption { max-width: 98%; height: auto; } .wp-caption { max-width: 100%; background: #eee; border: 1px solid #ddd; margin: 10px auto 0; } .entry-content .wp-caption img { border: 1px solid #ccc; max-width: 98.5%; margin: 4px; } .wp-caption-text { color: #5e5e5e !important; font: normal 11px arial !important; margin: 0 5px !important; padding-bottom: 5px; text-align: center; }
That refers to a lot of various things in the page for captioned images. The 98 and 100% widths, for example, are what make the caption box slightly bigger than the image it contains. The caption box has that background color of #eee to give it that gray shade. There’s also a 1px border around both the image and the caption box itself.
If you were not using a caption, then that would not apply, and lower in the style.css, around line 1356, you’d find this:
.entry-content img, .child-page img { border: 4px solid #e3e3e3; margin: 5px 0; }
That puts a 4 px border around images with a 5 pixel margin around images.
Editing your style.css file would let you change these as you see fit, or you could use a CSS Editor like the one in Jetpack to add additional CSS rules to override those.
This is arguably a better solution than overriding those on an individual image basis, because you do it one time and you’re done. No need to change it for every image.
But if you really want that per-image change back, try this plugin:
https://www.ads-software.com/plugins/advanced-image-styles/Thank you, but the solution is simpler, and the solution is this code:
style="margin: 0px; border: 0px currentColor;"
,for example:
<img class="size-full wp-image-1932 alignnone" style="margin: 0px; border: 0px currentColor;" alt="canflag_anim3" src="https://www.nautilus-intl.com/wordpress/wp-content/uploads/canadian_flag_animated.gif" width="169" height="60" />
The plugin will let you do that.
The what plugin?
But if you really want that per-image change back, try this plugin:
https://www.ads-software.com/plugins/advanced-image-styles/Thank you, I will try this plugin!
Thanks to everyone for your help on this — I was dismayed with 3.9 to find all my image-specific editing capacity had vanished! I do NOT want these as a universal style change, but rather the ability to change borders and margins for each image. I just downloaded and activated Advanced Image Styles 2.0 plugin and I’m a happy camper!
Having the same issue with border.
I have tried the code specified aboce, style=”margin: 0px; border: 0px, but it made no difference at all.
I have too many plugins, so I don’t want to add any to what I already have.Hope this can can be resolved ASAP because having borders around my images is an eye sore.
Thanks in advance.
Did you refresh the page (F5)? Try to use my code above exactly, and if it works, substitute your image. Sometimes even a little typo can mess things up.
Greybox
Thanks for that bit of code. I was using the Advanced Images Styles plugin when WP 3.9 inexplicably started adding a border of 1 px around my images in new pages. Originally, I set border: none but WP in it’s infinite wisdom strips it out but your code it does not.
Unreal what WP thinks is a great improvement in image editing. I wish to add my voice to the many disgruntled Web Dev people who think this version of WordPress is a decided step backwards. I now have to add about ten additional plugins to get back the functionality that has slowly been stripped away over the past couple of years like links and images or should be added to the core like login redirects and user flexibility / management capabilities.
Are you listening WordPress or like Adobe are you in search of a bigger bottom line at the expense of your loyal fan base?
“Idiot Proof” is not always better and those of us that like to customize our pages feel that you are not listening!
Greg Ward
I agree with Greg. I think any next version should keep the previous version features unless there is a very good reason for removing that feature. Adding any extra plugin will always put you at incompatibility risk immediately or in the future.
- The topic ‘WordPress 3.9 – Borders around pictures’ is closed to new replies.