WordPress.org

Support

Support » Plugins and Hacks » [Resolved] Mystile: Images resized and enlarged. how can I fix it?

[Resolved] Mystile: Images resized and enlarged. how can I fix it?

Viewing 14 replies - 1 through 14 (of 14 total)
  • Hi Graccurris,

    For your single product try adding this custom css. <- this assumes that you will be uploading the correct size image as you want and that images will not be dynamic in value just a fixed width and height.

    .images img {
        -moz-box-sizing: border-box;
        background: none repeat scroll 0 0 #FFFFFF;
        border: 1px solid #E6E6E6;
        padding: 0.618em;
        width: inherit;
    }

    this change it to correct size for me.

    and for your product list here

    ul.products li.product img {
        -moz-box-sizing: border-box;
        background: none repeat scroll 0 0 #FFFFFF;
        border: 1px solid #E6E6E6;
        display: block;
        height: auto;
        margin: 0 auto 1em;
        padding: 0.53em;
        width: inherit;
    }

    Thank you for the answer.

    I’ve added those codes at the end of the file “layout.css”, but it doesn’t work for me. The images have the same sizes when I refresh (having emptied the cache) the page.

    Any other hint?

    Thanks!

    Ive tested the code on my install and it works fine. <- in Chrome & Firefox.

    It needs to be added to your custom.css file and not your layout.css file because this is called first and will be over-written by your grey.css which is where they are being redefined.

    we need to make this in the last outputted css file which for mystile is custom.css.

    OR you can add it directly in to the theme options box where it says “Quickly add some CSS to your theme by adding it to this block.”

    ^ Go to Theme Options -> General Settings -> Display Options…

    add it in there 🙂

    Thanks

    Ah, so I was doing it in the wrong css file. Sorry, I am not used to Woo themes, and this is my first one.

    Thank you very much, it works perfectly now!!!

    Not a problem :).

    My pleasure!

    Hi again,

    I thought this issue was resolved but it seems it is not, provided in single products the size now is reduced: http://bit.ly/W98QGJ

    Additionally, when clicked onto the image, the image appears twice (once as the lightbox and another as the “prettyPhoto”. Is there any option where I can remove one of them so it just happens once?

    Thanks again for the help!

    The issue is only this one:

    I thought this issue was resolved but it seems it is not, provided in single products the size now is reduced: http://bit.ly/W98QGJ

    I already found the option for the lightbox 🙂

    Thanks for any help!

    It looks like you have your thumbnail options set incorrectly in the woocommerce admin..

    you have the product thumbnail set to 150×71 but your original image is 202×202.

    You must have them set to force cut. You can change your settings in admin.

    http://cl.ly/image/3K3i2a1P2W47

    Thanks so much! This is fixed!

    Thanks Samuel! I had the same problem, but your solution worked fine for me.

    Now there’s only one thing left: the thumbnails in the product-gallery (look below the big image http://www.duger.se/v4/butik/kuddfodral-2/). I guess you need to write some code after ‘.images .thumbnails’, but I don’t understand what to write.

    Can you please help me with this?

    Thanks in advance!
    //Emil

    Hey Emil,

    I clicked on your link above and noticed you found out how to fix the thumbnail problem you asked about… I’m curious as to how you did it? Any help would be appreciated!

    – Matt

    Samuel: I am catching up on this thread as it spoke to me directly. I am using the solution you suggested to Graccurris for the featured image at the website http://www.flowersinmemory.com , but would like the image to be approximately twice what it is now (assuming what you see has not been retrofitted through my designer overnight but about the size of my main image) What would the code be to get it twice your previous? Thanks

    Daitx – the code above assumes that you have uploaded the full size image, what size images are you trying to achieve?

    Well, did some research and have the image size that I like as for now, with the code as:

    .images img {
         width: 260px;
         height: 260px;
    }

    That said, I don’t know what I am doing, but it worked for me. They seem like large sizes, but look fine without being too grainy. Any suggestions would be appreciated. I am sure your code is proper, but the image size I have there is the one I need. I am now trying to downsize banner and enlarge title. Thanks for reply.

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘[Resolved] Mystile: Images resized and enlarged. how can I fix it?’ is closed to new replies.