Jetengine Listing Grid: Custom Column Numbers
- By
- John Doe
- Sept 17, 2024
- 7 min read
Short Intro:
Control the number of columns on a Jetengine listing grid
Problem:
The Jetengine listing grid column number is limited from 1-10 and Auto. There is no way to input a specific number or width for the column.
Solution:
If you want more control over the number of columns in the listing grid, you can add this to the listing grid widget:
selector .jet-listing .slick-list {
overflow: visible;
max-width: 67% !important;
}
You can set the max width to how big or how many columns you want. For example, if you want 3 columns, you can use 33%. You can also use pixels that are more responsive because, at smaller screens, it will automatically occupy 100%. Note: Make sure that you also set media queries if you want to change the column number for smaller screens.
if you want to hide the overflow on one side, you can add this to the container:
selector {
clip-path: inset( 0 -100vw 0 0 );
}
Contact details
More solutions
by ilias
You're using JetFormBuilder and want to make sure users are at least 18 years old based on their birthday input.
by ilias
Roweij Spices wanted to have a filter that can choose number of products display per pagination
by ilias
This article will show you how to add dynamic code to your templates using the Elementor Shortcode widget and custom PHP code.
