Resizing issue – photos in blog posts too small
-
Hi there,
I am currently using the Zuki theme. I have a question regarding the images that are shown on my posts. They’re much smaller than they used to be on a previous theme, and when ever I upload them they are always automatically made smaller.
Take for example this image that I upload using the image URL (https://farm8.staticflickr.com/7761/17499713934_3c3f0bfe0f_b.jpg) but on this blog post the image has decreased in size since switching themes (https://lifeofanarthistorian.wordpress.com/2015/05/26/paris-welcomes-roland-garros-2015/)
Is there any chance you can make it go back to the original size? – as it is losing quality and not as good on my webpage. It’s very frustrating!
Or is there anyway I can change the sizing just once CSS which will then change all the photos, rather than having to change them once at a time?
Thanks!
The blog I need help with is lifeofanarthistorian.wordpress.com.
The blog I need help with is: (visible only to logged in users)
-
Hi there!
What I can see is your image is cropped. The reason is your image has a max-width parameter fixed to 840px. But it’s inside another element not wide enough to show the whole image (Those 840px width). There is another one here, isn’t it?
You can reset these images width to 100% (That means 100% of their parent or container element). This can be done by using .entry-content img as selector.
.blog .entry-content img, .single .entry-content img { max-width: 100%; }If you do that, the image will be shown complete with the same width as your content (your entry text). Your entry-content is 640px width so your pic will be complete but smaller!
Just in case you would like to widen this area, you could do it with this code. (It widen width to 840px with a 40px right padding, because right now the blog already has a 40px padding to the left).
.entry-content, .entry-summary, .blog .entry-meta, .single-post .entry-meta, #comments, #disqus_thread { max-width: 840px; padding-right: 40px; }I hope this helps!
-
-
-
Hi,
I have a question similar to the original poster, so I’ll borrow this thread. My current theme (Scrawl) on my website http://deepruts.com/ have a standard image width of 1000px. I want to change it to 1200px. I tried changing Media Width to 1200px but after the page loads the images in 1200px the theme scales them down to 1000px again. Is there a simple solution to this?
-
Hi.
Yes, your pics are harcoded to be 1000px wide, so you need to override this parameter. In adition, you will need to change margin-left to have your pics centered. Currently your margin-left is -150px and you need to subtract to it half the pixels you add to your pic width. Let me write several examples:
NOW: margin-left: -150px; and width: 1000px !important;
If you want 1200px width, you could use this css code:
@media screen and (min-width: 68em) img.size-big { margin-left: -250px; width: 1200px !important; }or 1100px width:
@media screen and (min-width: 68em) img.size-big { margin-left: -200px; width: 1100px !important; }I hope this helps. :)
If you have additional questions or problems, please let us know.
-
@media screen and (min-width: 68em) img.size-big { margin-left: -250px; width: 1200px !important; }I pasted this in my CSS window and it didn’t seem to do anything. I don’t know almost anything about CSS so maybe I need some more specific direction on how to solve this. Thanks. :)
-
Hi.
Yes… the code didn’t work and it’s not because of your CSS knowledge, but because I forgot two brackets… :S
Sorry about that. The code you should use is this:
@media screen and (min-width: 68em){ img.size-big { margin-left: -200px; width: 1100px !important; } }I hope this helps.
-
- The topic ‘Resizing issue – photos in blog posts too small’ is closed to new replies.
WordPress.com Forums 
