Images Displaying Small

• 

  mirandatcs · Member · Oct 25, 2013 at 2:42 pm

  • Copy link
  • Add topic to favorites

  I have added a sidebar to my theme, which has made my images smaller (600 size), when they are uploaded at 700 in size. I have went into the CSS to try to make it where my blog width and image size are larger, but the images still look small (at 600). Is there a way to fix this? I had had this issue when I first purchased the theme, and they were able to help me make them larger, but it seems the sidebar has changed that. I just wante them to display at full size, which is 700. Thanks :)

  The blog I need help with is: (visible only to logged in users)

• 

  rachelmcr · Member · Oct 25, 2013 at 4:01 pm

  • Copy link

  Hi there,

  On pages where your blog doesn’t show the sidebar, your images are 700 pixels wide. Here’s an example:

  http://thechicstreet.com/2013/10/23/press-instyle-magazines-reader-of-the-week/

  On pages with the sidebar, though, the image is reduced to 600 pixels automatically to make room for the sidebar. Your theme will automatically resize the image smaller so it fits in the space on the screen.

  To be able to show bigger images on pages with the sidebar, you’ll need to either made the sidebar thinner or make the whole section larger. You can do either one with custom CSS. To add custom CSS, go to Appearance > Customize in your dashboard and select CSS from the Customize tools. In the CSS editor, you can enter the following CSS:

  .row .eight {
  width: 76%;
  }
  
  .row .four {
  width: 19%
  }

  That will make the sidebar smaller so there’s more room to show the images larger. You can adjust those percentages until it looks the way you want it to. If you want to make the whole section larger, you can do that with this CSS:

  .row, .container {
  max-width: 1080px;
  }

  You can adjust that width until it’s the size you want.

  Let me know how that works for you! :)

• 

  mirandatcs · Member · Oct 25, 2013 at 4:34 pm

  • Copy link

  Thanks! I put the codes in, and they work great for my images, which are now the right size. However, my side bar looks a little squished now. I am sure you explained how to make the side bar a bit bigger above, but I am still wort of confused. Sorry. Thanks :)

• 

  mirandatcs · Member · Oct 26, 2013 at 9:15 pm

  • Copy link

  Sorry, but I just need a way to make the full blog bigger,because this code works, but my side bar is very small and I do not want to make my images smaller just to make it bigger. I sthere a way to make the ful blog part bigger in general? Thanks.

• 

  rachelmcr · Member · Oct 28, 2013 at 11:04 am

  • Copy link

  Hi there,

  The first CSS code I gave you will make the sidebar smaller and the blog space where the images are bigger:

  .row .eight {
  width: 76%;
  }
  
  .row .four {
  width: 19%
  }

  If you don’t want the sidebar to get smaller, you can leave out the code above. Instead, you can just make the entire column (both the blog and sidebar) bigger with this code:

  .row, .container {
  max-width: 1080px;
  }

  You can also adjust the number of pixels so it looks the way you want it.

  If you need more advanced CSS help to make your site look the way you want, you can also ask in the CSS Customization forum here:
  https://en.forums.wordpress.com/forum/css-customization

  Both staff and volunteers who are CSS experts help out in that forums and can give you additional tips and help for working with CSS.

• 

  mirandatcs · Member · Oct 28, 2013 at 3:13 pm

  • Copy link

  Thanks! This is just what I wanted ;)

  Miranda