[dijac]

Hi. I have a few issues.
1) How can I have the theme show ALL my product gallery images. It currently shows a max of 3 plus part of a 4th one.
2) How can I increase the size of the main product image (only seems to increase when I remove the sidebar)
3) Can the width of the sidebar be reduced? It takes up 1/3 of the page width
4) How do I get the product description (under the product image on the product listing pages) to show fully. At the moment most are over 4 lines, (including the price) but the 3rd line is cropped in half.

thanks

[Althemist]

Hi dijac,

1. Not really sure what do you mean. Could you, please provide a link to your site, so we can see the problem “live”?

2. The main product image would take all the space available. When there is a sidebar, the page width is 300px smaller, so it’s absolutely normal that the image size drops too.

3. The only way to change this would be a CSS customization. This would require a serious CSS knowledge and experience.

4. I guess you are talking about the product list view. There is a limit set to preserve the layout. I am afraid it’s not possible to show the entire description.

Regards,
Dimitar

[dijac]

This reply has been marked as private.

[Althemist]

Hi dijac,

The problem with the images is caused by the large number. What you can do is move the additional images bellow the main image. This way they will be all visible AND also the main image will be a bit bigger as it would take the freed space. The CSS code to achieve this will be as follows:

div.product div.images, #content div.product div.images {
        padding: 0;
}
span.onsale {
        top: 30px;
        left: 30px;
}
div.product div.images ol.flex-control-nav, #content div.product div.images ol.flex-control-nav {
        width: 100%;
        position: relative;
        padding-top: 20px !important;
        text-align: left;
}
div.product div.images ol.flex-control-nav li, #content div.product div.images ol.flex-control-nav li {
        margin-right: 5px;
}

You can place the code in Appearance > Customize > Additional CSS

For the product name – the space there is limited in order to preserve the columns layout. You can increase the space a bit with the following CSS:

div.prod_hold .name {
    height: 50px;
}

Hope this helps.

Regards,
Dimitar

[dijac]

it did. thank you so much 🙂

[Author]

Posts