Sela Theme: Images are too small
-
I need some help with an image problem. I run a fashion blog and I’d like to upload some images for a new post. Every time I use the media uploader, the media library doesn’t show the whole image but rather a “compressed” version that’s surrounded by grey space at the top and bottom. In other words, it doesn’t upload the full image (most of them are under 10mb) and so when I try to put the image in the post, it shows up too small. I fooled around with the media settings (not really sure I know how to use it) and made the limits bigger. Made no difference. I’m using Sela theme but I don’t think it’s a theme problem because other blogs using Sela have large images. What am I doing wrong? I’ve uploaded other images from other cameras, iPhone, etc and they all seem to fill up the little thumbnail space fine.
I’d really appreciate some help because I find this all very confusing.
The blog I need help with is: (visible only to logged in users)
-
Every time I use the media uploader, the media library doesn’t show the whole image but rather a “compressed” version that’s surrounded by grey space at the top and bottom.
Can you provide a screen shot showing this effect, the grey space?
In other words, it doesn’t upload the full image (most of them are under 10mb)
I would think that 10mb verges on “mammoth” as blog images go, but even so you should be able to upload the entire image. A note at Add Media > Insert Media says “Maximum upload file size: 1 GB.”
-
-
Ok great. Hopefully, this works. As you can see, the images on the left have all this grey space and the images to the right (white/green dress, etc) completely fill up the little thumbnail space. file:///Users/andreagyenge/Desktop/IMG_5909.JPG
-
There’s something wrong with that image URL. It’s not properly formed. I’ll tag the topic for staff attention.
-
Hi there,
The link you gave for your screen shot is a link to the file on your computer, so we’re not able to view it. Can you upload that image to your site’s media library (under Media > Add New in your WP Admin dashboard) so I can take a look at it for you?
-
Hi! I added the image. It’s a full screen shot that shows all the images that have the grey space and all the images that don’t. Even the screenshot image has the same problem! Thank you so much!
-
Thanks! I took a look at your screenshot and compared it to what I see in your media library. Your images look ok to me, so it’s likely there’s a problem with how your browser is displaying those images in your media library.
Do you have any browser extensions installed? It looks like you have Safari version 7.1.5 — you can manage any browser extensions in that browser with these steps:
https://support.apple.com/kb/PH17200?locale=en_US
If you do have any extensions installed, please try temporarily disabling them to see if that fixes the problem for you.
If you have another browser on your computer (or if you’d like to try another browser), it would also help to know if you’re having the same problem there or if it’s just an issue in Safari.
-
Hi, ok, I’ll check that. My other question was about image sizing. When I look at my photo on my computer, it looks great and when I upload it to the post, it seems limited to a smaller size. I can’t get any of the images to look bigger (I.e., physically take up space in the post). They just look post-card size (even if I choose “full-size”). If I change my media settings, nothing changes. I thought maybe the media library was doing something to compress the images. How do I get a full-size image? Thanks!
-
Your images are limited to the width of the post’s content, so they won’t appear any wider than the column with your post’s text. For example, in your latest post at http://thisissixblog.com/2015/05/27/spoils-of-the-thrift-vintage-gucci-bag-maybe/ I see the Gucci bag image like this on my laptop: https://cloudup.com/cEmJYb_Yt1s
If I click on that image, I can see the full-size image here: https://thisissixblog.files.wordpress.com/2015/05/whole-bag.jpg
Does that image look different to you on your end?
-
Ok so I checked Firefox (and I’m now on a different computer entirely) and the same display problem is happening (grey space). I’m not so sure that the display problem isn’t indicating something with the image when I try to insert into the post. Every single one of the new images in media library (all with the grey space) are inserted as the same sized square. I guess I’m wondering why some images on the blog (in older posts) are larger (rectangular) and all these new ones are just the same sized square. Is it the camera? Do I need to change my theme to get everything to look bigger?
-
@ gyeng002,
When I look at my photo on my computer, it looks great and when I upload it to the post, it seems limited to a smaller size. I can’t get any of the images to look bigger (I.e., physically take up space in the post). They just look post-card size (even if I choose “full-size”).
The Sela theme guide Quick Specs section says,
The main column width is 620 except in the full-width layout where it’s 778.
The four images on your latest post, http://thisissixblog.com/2015/05/27/spoils-of-the-thrift-vintage-gucci-bag-maybe/, each have the file size 3264 x 2448, but due to the constraints of the theme display at 620px × 465px. The ratio remains the same, 4:3. The displayed images are scaled from the full size images to fit the space allowed by the post. They are displaying exactly as they should.
-
Thanks for the help! I guess that means I have to change my theme for one that allows larger images (i.e., layout). Though, it’s still not clear to me why some of the older pictures are posted as long large rectangles and others are small squares.
-
I just checked your Media Library on both Chrome and Firefox. The images are displaying without a grey border around the bottom as shown in this example:
Could you let me know what version of Firefox you were using? You can find out by visiting whatismybrowser.com. I’m wondering if this is an issue with a specific browser version.
Though, it’s still not clear to me why some of the older pictures are posted as long large rectangles and others are small squares.
Could you provide some links to older posts that are displaying different image dimensions so I can take a look?
-
Hi! Yes, here is a link to an older post with both square and long images :http://thisissixblog.com/2015/03/24/mellow-drama/. I’m assuming it has something to do with the way the photo was taken so maybe everything I just shot is a square shot? As for the browser, I’m using Safari 7.1 and Firefox 38. Everything is up-to-date. Both browers show that grey space across a variety of images (as shown in the screenshot).
-
@ gyeng002,
There are no square images on http://thisissixblog.com/2015/03/24/mellow-drama/. The images are all rectangular, with either portrait or landscape orientation.
Most of the images with portrait orientation (more tall than wide) have the file size 3264 x 4912, and are scaled down to 620 x 933 to fit the width limit allowed by the theme. The one exception I found is the image dsc59671, which has the full size 3264 X 4157 pixels and is scaled to 620 x 790.
The images with landscape orientation (more wide than tall) each have the file size 4912 x 3264, and are scaled down to 620 x 412 to fit the width limit allowed by the theme. The landscape images, therefore display at a smaller area size than the portrait images because of the orientation.
-
@gyeng002 – @musicdoc1 broke this down in his post. Just to provide an example of how this works, let’s look at this image in the post you mention:
Naturally, this image is 3264 × 4912. You can see that on the media item here:
https://thisissixblog.wordpress.com/wp-admin/upload.php?item=359
As mentioned previously, the Sela theme has a width limit of 620px on posts. So, the theme does a good bit of scaling to make the image fit. Since the max width is 620px, the width of the image will automatically be scaled to 620px. To prevent the image from being distorted, we change the height the same percentage.
620px (allowed width) / 3264px (image width) = ~19%
4912 px (image height) * 0.19 = 933px
So, the scaled size of the image will be 620×933 as you can see here:
I hope that helps to explain a bit more!
I’m using Safari 7.1 and Firefox 38. Everything is up-to-date. Both browers show that grey space across a variety of images (as shown in the screenshot).
Can you try the following?
1. Downloading a “fresh” browser (Chrome) here?
2. Resetting Firefox as explained here:
https://support.mozilla.org/en-US/kb/refresh-firefox-reset-add-ons-and-settings
- The topic ‘Sela Theme: Images are too small’ is closed to new replies.
WordPress.com Forums 
