Essential Grid: sort by title in masonry grid

Hi there,

I created a page where I display the staff of a company. For that reason I chose to use the Essential Grid which displays my Portfolio Items. That works fine. Since I want do display Name and Job Title I had to chose the Masonry Grid style instead of the Even.
I tried to sort the items by Title (which means the first letter of the name). But it doesn’t work throughout all of them (see screenshot).

Do you have any idea how I could get rid of that problem? I know it’s caused by the Masonry layout because it automatically fills up that there is no gap. But when I choose Even the text below the images will only show on hover.

This is the URL to the specific page: http://neu.kss.ch/ueber-uns/team/

Best,
Christian

Hey Christian

It’s not possible for the Even grid to show the content (name and title) because the content varies in height the grid won’t be even anymore in that case.

Since you need to stick with masonry grid, try enabling the Column’s Advanced Mode and then set a Min Height for the Content. Try a big value at first like 200 so you’ll see the effect. Also, set a different value per screen size.

Hope that helps.

Hi Christian,

thank you for your suggestion. As soon as I increase the value it switches in the way that it only displays 3 instead of 4 columns. It solves the issue with the sorting but maybe there’s another way to achieve my goal.

The only difference in my items is that some of the job titles are longer and they spread over two lines. Would it be possible to set it in a way that there is always space for two lines in that meta element?

Best,
Christian

Hey Christian,

Try editing the skin of your grid using the Skin Editor. Specifically, edit the text layer and set the Min Height.

Hope that helps.

Hi Christian,

That’s perfect. I think that way it will work for me.
Thanks a lot for your help.

Best,
Christian

You’re welcome :slight_smile:.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.