ps. Forgot one thing, is it possible to make sure the thumbnails are in the same format even though some pictures are landscape and others are portraite.. ds

Hey Hoggo,

1. Enter this into the Custom CSS box located in your Salient Options panel to remove the title/date:

.portfolio-items .work-item.style-3 .vert-center {
  display: none!important;
}

2. If you meant to say 4 pics per row, all you need to do is check the option for “Constrain Max Columns to 4” in your portfolio element http://i.imgur.com/RsW19ic.jpg

3. As long as you’re supplying images that are at least 600×400 they will get cut appropriately if you’re using the featured image option on each project

Ok thanks for the code to remove the date/title, but I still can´t find the changes to make it look in the example I was posting to you (doesnt look like in your print screen). Please have a look at this section =)

Portfolio > Portfolio Columns > Portfolio Style Three

Just want a simple grid with thumbnail pictures where you can just click on the first one, it then enlarges and change to next pic by clicking an arrow to the right.. Very simple set up with 4 columns.

One Example but with more columns… http://www.petterjohansson.se/event/

All the best =)

Hoggo

Hey again Hoggo!

If it doesn’t look like my screenshot I would need to ideally log in to see what’s going on and why you’re missing the options added with Salient 4.0 – can you open a ticket in regards with you credentials at http://themenectar.ticksy.com/

Cheers

I think we missunderstand each other and I am a complete lamer at programing as well =) This is how it looks like now: http://pagfy.se/portfolio/ (One pic that you have to click on and then you have all the other pics on the right hand side..)

All I want is a nice grid with like 4-5 columns. I have clicked on Salient > Portfolio Options and changed to 3 columns… Well well I try to open a ticket whatever that is…

If you’re only trying to use the portfolio to display a gallery and you have no use for the single project page – here’s what I’d recommend. Simply go to your portfolio edit page remove the portfolio page layout (in the page attributes box on the right hand side) and assign the default layout again. Now click on the visual composer button above your editor and add the “Image Gallery” element. Use this to choose the image grid option and add your images as needed.

This will be the route i’ll take for you if you can provide me admin access

Ok big thanks =) How should I supply the access to my site to you? Do you have an email?

PS: This is only happening in the full width content version in the visual editor. it works fine in the container section

and also, in the nectar slider. i cant select slide ordering, it just says “Choose your slider location below and simply drag your slides up or down – they will automatically be saved in that order.” and nothing shows up below? is there a reason for this?

Interestingly as well in mobile view the headline, paragraph and button are not exactly central to the screen they range slightly right, you can see this when you look at the arrow now…

Hey again!

1. Try adding [data-full-width=”true”] into the selector like this when dealing with the font sizes:

  html body .nectar-slider-wrap[data-full-width="true"][data-fullscreen="false"] .swiper-slide .content h2 

2. If you do a load of the page when it’s in the mobile size as opposed to loading it in desktop and dragging it smaller you shouldn’t see off-centering of the text

Awesome thanks point 1 fixed, point 2 sent you a screen in an email to show you

Hey pyramus99!

It would require an additional media query at the bottom of the responsive.css file to set the correct percent on the portfolio items to change it into 6 cols and then an additional conditional in the init.js file to query for that screen size and set the column number. The JS mod would take place in the “reLayout” function also near the bottom

THANKS so much for the direction, will try to make that happen and let you know

One little request related to that: could you please make the images size functions ‘pluggable’ in functions.php? Specifically these ones:

add_image_size( 'blog-widget', 50, 50, true );
add_image_size( 'portfolio-thumb', 600, 403, true );        add_image_size( 'portfolio-widget', 100, 100, true );

Just hate to have to edit your original code and miss out on updates!

Thanks for the suggestion – if nothing else I’ll try to make it easily over writable via the child theme

great! that would make someone happy for sure

Cheers

Hey I just noticed the portfolio items in the “recent work” slider don’t ‘listen’ to a change of the thumbnail sizes. I now overwrote this with a hardcoded width for the body .portfolio-items .work-item selector, but of course this solution isn’t particularly wonderful. Any tips? Or maybe a suggestion for a future update?

Hey!

If you check out the shortcode-processing.php file you’ll see the images are still using the “portfolio-thumb” size so it should work – anyway you could share the URL to that page so I can see what size it’s getting served at?

Working locally ATM. Will make a ticket for this when I deploy to staging…

Sounds good

Hey about this issue: I think you might have misunderstood me – the problem wasn’t with the size of the actual images, but the button container: https://www.dropbox.com/s/uriwkklwnvw004e/Screenshot%202014-04-29%2015.35.12.png See my CSS selector above for the specific object I’m talking about

Hey again,

the work item div should simply inherit the parent li.col width – which is set to be a percent based on how many columns are shown. It looks like your images may just be too small to reach the edge but if you added something like:

.row .col img {
  max-width: none!important;
}

it might allow the upscaling anyway

Hey there, thanks for your reply. actually, the images are the correct size – that isn’t (and never was) a problem.

The DIV (.work-item) around it that does the hover is acting funny. I solved it by assigning a static width (the same as my ‘portfolio-thumb’ size) to the body .portfolio-items .work-item. but of course, this is not really an elegant solution.

Any better ideas?

Are you at the point where you can share a URL? I will be able to help a lot more when I can see it all live

Hey there, I just pushed it to a staging server. URL is in your mail!

Note: the hover tiles in recent work carousel on front page will look fine, because I overwrote the width of .work-item. Please disable that if you wanna see how it looks by default.

Hey – as I was mentioning earlier, the issue is indeed that your images are not big enough to fill the columns. If you can’t provide images a little wider – please remove your custom css setting the width and use this to see how it should look:

 .portfolio-items .col img {
    width: 100%!important;
    max-width: none!important;
}

I’m actually uploading thumbnails at 500×500 resolution, but wanna use 350 max in the main portfolio. Is the size of thumbnails in this carousel separately defined? Otherwise, I guess this kind of comes back to my earlier question about “pluggable” functions for the images sizes: any update on that?

The size of the carousel is set in the init.js file – currently it’s set to 500px, but if you change that to a smaller number the column number should change (it’s already dynamic based on screen width but it seems you need one more column for desktop view to make your images fit).

Open up the init.js and change this line:

var colWidth = ($(this).parents('.carousel-wrap').attr('data-full-width') == 'true') ? 500 : 353 ;

Just play with the 500 to make adjustments.

Cheers

all right, that’s a great tip thanks for now and please keep me posted about the pluggable / over-writable image size functions!

also, i’m sad to report this tip didn’t have any result… but it’s okay. please keep me posted about the pluggable / over-writable image size functions!

Will do