CSS Greenshift blocks
CSS for the Greenshift blocks
The CSS on this page is specifically for the WordPress Greenshift blocks builder. There is a lot of customization in the Greenshift blocks, but not everything; that’s why CSS exists!
Keep in mind that the way to integrate the CSS code or classes is slightly different for each WordPress theme. Themes like Kadence, Astra, Blocks, and actually most modern themes, all have an option to use CSS-code and classes.
Keep in mind that the way to integrate the CSS code or classes is slightly different for each WordPress theme. Themes like Kadence, Astra, Blocks, and actually most modern themes, all have an option to use CSS-code and classes.
CSS wider Query loop filter dropdown
This CSS code allows you to adjust the width of the Query loop builder dropdown menu.
Motivation: the standard dropdown filter menu is quite narrow. That means that (a) it is not pretty and (b) a somewhat longer text often gets a break, so 2 lines. That’s when to use this code. Place the code in a code plug-in, for example.
You can, of course, adjust the 150px value.
Motivation: the standard dropdown filter menu is quite narrow. That means that (a) it is not pretty and (b) a somewhat longer text often gets a break, so 2 lines. That’s when to use this code. Place the code in a code plug-in, for example.
You can, of course, adjust the 150px value.
/* CSS wider Query loop filter dropdown */
.gspb_drop_item {
width: 150px;
}Now that you know how to ‘target’ this dropdown filter menu, you can of course also adjust other properties. Like font size, color, alignment, etc.
Integrate CSS on a website
Do you want to know how your CSS code integrates on your WordPress website? The way you integrate the code is important for a predictable and good result. Look here.