Image Size in Portfolio

Posted in : Read WP
MarkerMaker
Participant
11 February 2014 at 20:04
#12215

I cannot seem to get my images that I add to the portfolio to display at full size, instead all images are reduced. Does anyone know what is happening here as the CSS suggests the images should display at 100% their actual size?

http://wp.mjcdesign.co.uk/portfolio/mycoracle/

Mehmet S.
Keymaster
12 February 2014 at 06:22
#12226

Do you have any code in your custom css box?

MarkerMaker
Participant
12 February 2014 at 14:53
#12268

Yes at the moment I have this but the second line does nothing…

<code>h1.site-title a { border-bottom: none; }
body.home .site-intro { font-size: 5em; }</code>

ahmetsali
Keymaster
15 February 2014 at 01:32
#12331

Hi, do you have any custom js code in your External JS box, then delete it and try again.

bluewhisky23
Participant
27 February 2014 at 11:25
#12700

Hi,

I have a similar query. I was wondering if it was possible for me to set the size of portfolio items to be smaller than it currently is. If you check out my website’s portfolio page (http://pinakespress.com/books-2/), you’ll see that having a smaller image would work better. I tried reducing the featured image before upload, but it seems to then get enlarged again automatically?

Cheers,
ahmetsali
Keymaster
27 February 2014 at 18:10
#12710
Hi @

– you need to edit columns sizes for portfolio page. Edit js/main.js (in theme folder) in a text editor and find line : 351, you will see column sizes;
```
			var viewports = [ {
					width : 1600,
					columns : 6
				}, {
					width : 1200,
					columns : 5
				}, {
					width : 900,
					columns : 4
				}, {
					width : 500,
					columns : 3
				}, { 
					width : 320,
					columns : 2
				}, { 
					width : 0,
					columns : 2
				} ];
```
increase columns per row value to decrease item’s width;
```
			var viewports = [ {
					width : 1600,
					columns : 7
				}, {
					width : 1200,
					columns : 6
				}, {
					width : 900,
					columns : 4
				}, {
					width : 500,
					columns : 3
				}, { 
					width : 320,
					columns : 2
				}, { 
					width : 0,
					columns : 2
				} ];
```
bluewhisky23
Participant
27 February 2014 at 23:54
#12721

Excellent. Took me a while to get what the numbers meant, but it works now on larger screens :)