Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #456378

    Hi,
    I need to adjust the size of the small preview pic, and I can’t seem to get it to work.

    On the main page, I’m using a plugin to display the list of posts, but there are other things it’s conflicting with (http://www.thestylestudiobykb.com/).

    I’m working with this blog page (http://www.thestylestudiobykb.com/blog-2/) and am trying to get the small preview pics on this page to be as close to the size on the home page as possible, but nothing I’m doing is working.

    Any guidance would be greatly appreciated.

    Thanks!

    #456704

    Hi Taryn!

    use this code in Quick CSS field for first image:

    img.attachment-no.scaling.wp-post-image {
    width: 20%;
    }
    

    for the other images:

    img.alignnone.size-full {
    width: 25%;
    }
    

    You could also try to work with the plugin simple image sizes.

    Cheers!
    Andy

    #456931

    Thank you, but that’s not quite what I was after. It made the small preview pic extremely small, which is not what I want. I was able to get the grey background placeholder the right size, and using the plugin you suggested, I made a custom image and sized it, but as you can see, the image doesn’t fit in the space it needs to. (.fusion-button.button-flat.button-round.button-large.button-custom.button-2).

    The layout I have, I have one full post at the top, and then a listing of subsequent posts below that. It’s just this listing that I want to mess with – the full post at the top is fine the way it is. If you could guide me in the right direction to get the small preview images to fill up the space for the grey box/hover effect, that would be awesome.

    Thanks!

    #457114

    Hi!

    Did you change the size of the square thumbnail in the simple image size plugin? The default is 180x180px, in your installation, looks like it is using the original thumbnail size. You can set the width and height to 100% but it will distort some of the images:

    .small-preview img, .big-preview img {
      width: 100%;
      height: 100%;
    }

    Cheers!
    Ismael

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.