I have has some amazing support setting up this list for our website....
hidden link
which now looks great and works really well for us. BUT we would like to create a list view of this so people can switch if possible?
hidden link I created this list, i have a couple of small issues below....
1. Headers for each column. If i put it within the view it repeats above every entry, so put it above and hid from mobile view as it stacks..... assume thats right...
2. In mobile view it stacks the columns which is fine but how do i reduce the gap between each record?
Lastly... and the main question, can i set my main view on the first link to also have this layout and a dropdown so people can view as tumbs or as this list or shoul di just add a link to the 2nd page?
Thanks
Neil
Dear Neil,
Q1) You are right, since in mobile, the table header row will not be useful, and will break the layout, so it is hidden with CSS codes:
@media only screen and (max-width: 599px)
.tb-container[data-toolset-blocks-container="e0eab7be06ff409e32a3752e44d3be79"] {
display: none;
}
You can setup CSS codes to override it, and display those table headers.
Q2) You can use CSS codes to reduce the gap, for example:
div.wp-block-columns {
margin-bottom: 0px;
}
Q3) I assume you are going to switch the View block layout by a drop down menu, if it is, there isn't such kind of built-in feature with Toolset Blocks/Views plugin, you are right, as a workaround, you can add a link to 2nd page.
My issue is resolved now. Thank you!
Apologies on question 2 will this CSS just adjust the mobile view?
On question 2, the CSS codes I provided will take effect on both desktop and mobile devices, if you want to take effect only on mobile, you can try below CSS codes:
@media only screen and (max-width: 599px){
div.wp-block-columns {
margin-bottom: 0px;
}
}
More help:
hidden link
