[Resolved] View is not showing in grid colums

[Author]

Posts

[adriS]

Tell us what you are trying to do? Just to display a view in a grid with 3 columns, but it is displaying single colums

Is there any documentation that you are following? Can not find something related

Is there a similar example that we can see?

What is the link to your site? hidden link

[Minesh]

Hello. Thank you for contacting the Toolset support.

That is really strange. I will have to see what is going wrong with your setup.

Most probably I can see that you are using the Beaver Builder so the issue could be from there.

Can you please share admin access details and let me investigate whats going wrong with your setup.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.

[Minesh]

Can you please check now: hidden link

I've added the following CSS code to your view's custom CSS section:

#wpv-view-layout-1006 .tb-grid {
grid-template-columns: 1fr 1fr 1fr;
}

More info:
- https://toolset.com/course-lesson/adding-custom-css-to-templates-archives-and-views/#steps-for-adding-css-to-a-view

[adriS]

Thank you Minesh

It is show correct on the bigger screens now but the phone should only show one?

[Minesh]

Can you please check now: hidden link

To display different columns per device you will have to add media query as given under:

@media only screen and (min-width: 992px)   {
    
#wpv-view-layout-1006 .tb-grid {
grid-template-columns: 1fr 1fr 1fr !important;
}
    
}

@media(max-width: 767px) {
#wpv-view-layout-1006 .tb-grid {
grid-template-columns: 1fr;
}
    
}

Feel free to adjust the above CSS to to your view's custom CSS section as required.

[adriS]

My issue is resolved now. Thank you!

[adriS]

Sorry, I'm not able to replicate it. Somewhere something is still missing, I'm still not able to do wat you did

[adriS]

My issue is resolved now. Thank you!