Portafolio Home Grid

ossaluis · October 2016

Hi, i am setting up my portfolio site, the portfolio page its all right, but at the homepage, i put a portfolio grid with some of my work. Actually, this grid is showing all of the works together, with no space between them. Can you please help me telling me hoy to make some spaces between the works at the home page?

I see where i can change this option but only for the portfolio page, not for the aplication at home page trough the muffing builder portfolio grid.

Actually.

What i need:

Thanks a lot.

Albert · October 2016

Hi,

please send us link to page where you got these portfolio items so we can have a look on it first.

ossaluis · October 2016

Hi, the links is www.panoramica.com.co.

there you can find the portfolio grid thah i need to change.

Thanks

Albert · October 2016

Ok. So to add space between images, please use:

.one.column_portfolio_grid li, .three-fourth.column_portfolio_grid li, .four-fifth.column_portfolio_grid li, .five-sixth.column_portfolio_grid li, .vc_col-sm-9 .portfolio_grid li, .vc_col-sm-10 .portfolio_grid li, .vc_col-sm-12 .portfolio_grid li { width: 23% !important; margin: 1% !important; }

ossaluis · October 2016

Hi, where should i add this command?

Albert · October 2016

Each css need to be put under Theme options > Custom CSS & JS > Custom CSS section.

ossaluis · October 2016

Hi, Thanks a lot, it works great.

Albert · November 2016

You are welcome!

timfurnish · November 2016

I used the above css code to add a gap between my portfolio items, but get these weird dot artifacts occur at corner. How do I get rid of these? I'm using the Portfolio grid.

Also, is it possible to have the title of each portfolio item show up below the item instead of inside?

screen shot here.
http://camillecothrondesign.com/wp-content/uploads/2016/11/Screen-Shot-2016-11-21-at-8.43.30-PM.png

Albert · November 2016

@timfurnish Please send us link to page/s where you would like to do above changes first so we can have a look on it first.

timfurnish · November 2016

http://camillecothrondesign.com/interiors/

I also want the thumbnails for each of these to be the same size/aspect ratio. How is that done? Can it be done within the template functions or do I need to upload files of the same size.

Thank you.

Albert · November 2016

@timfurnish Above css has nothing to these dots. You got them because you are using VC plugin and this plugin adds them for all list types. So to remove list type style, you need to use the following css:

.column_column ul li, .column_helper ul li, .column_visual ul li, .mfn-acc ul li, .ui-tabs-panel ul li, .the_content_wrapper ul li, .post-excerpt ul li { list-style: none !important; }

But to make them all same size, you need to use same size or even proportion images.

timfurnish · November 2016

That CSS worked nicely. Thank you. I will choose images of the same proportions for the Featured images. Is it possible to do the titles of the portfolio pieces below the thumbnails as shown on this sample site? http://www.westhovendesign.com/residential/

Albert · November 2016

@timfurnish Sorry but we do not have similar portfolio style included unfortunately.

Portafolio Home Grid

Comments