Portfolio image sizing on home page

[Laura]

How do I reduce the size of the portfolio images so each row takes only 2/3 of the width of the site page?

http://mysbiz.com/tempfirm/
template: industrial

[Laura]

The images on the home page are blurry, but the images on the internal portfolio page view correct. That is why I wanted to shirk the images on the home page, but any solutions you can recommend I would appreciate.

[Sonl Sinha]

Hi Laura,

Kindly go to Appearance>>Theme Options>>Basic Settings>>Custom CSS Box:

Add this code there:

#Grid .mix { width:25%; height:337px;}
#Grid .mix img { min-height:337px;}

.page #Grid .mix { width:33.3%; height:349px;}
.page #Grid .mix img { min-height:349px;}

Regards,
Chris

[Laura]

Thank you, that worked. But now there is 4 images per line. Is there a way to keep 3 images per line and have white space on the sides?

Is there a way to have the entire image show with no cut off at the bottom?

[Sonl Sinha]

Hi Laura,

Kindly go to Appearance>>Theme Options>>Basic Settings>>Custom CSS Box:

Add this code there:

Remove last CSS:

#Grid .mix { width:25%; height:337px;}
#Grid .mix img { min-height:337px;}

.page #Grid .mix { width:33.3%; height:349px;}
.page #Grid .mix img { min-height:349px;}

And this CSS

#photo-gallery .container { width:1170px;}
#Grid .mix { width:33.3%; height:390px}
#Grid .mix img { min-height:390px;}

@media screen and (max-width:1169px) {
#photo-gallery .container { width:100%;}
}

Regards,
Chris

[Laura]

Thank you. That worked. I have only one more question. Are all of the portfolio images supposed to show on the home page, not just the 6 we have showing?

[Sonl Sinha]

Hi Laura,

If you want to show all the images in gallery then remove the show=”6″ option from the shortcode. So it should be

[photogallery filter="true"]

Regards,
Chris

[Laura]

Is there a way to have a “see more” button in place of the portfolio menu?

https://snag.gy/VKMLBQ.jpg

[Sonl Sinha]

Hi Laura,

You can use button shortcode. If you do not want to show portfolio filter then add this shortcode:
[photogallery filter="false"]

Regards,
Chris

[Laura]

Thank you, that worked.

[Sonl Sinha]

🙂

[Author]

Posts