I have a site where I love using galleries but I hate having to define their width. That’s something I hate about WordPress’ Gallery shortcode, you have to define a width, otherwise it’s all one column. Ugly ugly.
The way that WordPress handles these columns also sucks. It puts in clear breaks:
<br style="clear: both" />
And frankly I hate that too.
But I don’t do that with this other software I use. In fact, I have it all nicely coded in to show all my images, and then toss one final clear break at the bottom, to … clear the breaks. And what that does for me is gives me an adaptive width gallery that will expand and contract with my content.
So how can I do that with WordPress?
The easy part is something I already do in EDD, and that’s to use a fake column value of zero: gallery columns="0"
That gives me a handy new column class: gallery-columns-0
And that is very easy for me to style, by overriding the width from 100% to auto (the !important is dreadful), and set up the padding I want.
/* Gallery */
.gallery-columns-0 dl.gallery-item {
width: auto!important;
padding: 0;
margin: 0 10px 0 0;
}
But what about the ‘break’ afterwards? If you only need to support IE 8 and up, then it’s as simple as this CSS:
.gallery-columns-0:after {
content: "";
display: table;
clear: both;
padding-bottom: 10px;
}
The padding on the bottom is to make it match my site, adjust as needed. I’m sure I could use the post_gallery filter hook and the same code from the gallery_shortcode function but with my br modification, but 0.017% of people visit this site using IE 7 or less, and at that percentage, so much of the site will look terrible anyway.
The only real downside is that I have to manually enter the shortcode in text mode, since I can’t select ‘0’ as an option from the dropdown.
Comments
4 responses to “Gallery Columns Zero”
You know another thing that drove me crazy about WP Galleries is the fact that natively you can’t enter in a custom link (URL) for each image in a gallery! This to me seems like a no brainer thing that people would need galleries for!
Years ago, I had found a custom code to plop into functions.php that did the job wonderfully. Then within the last two years or so a plugin finally came out for this and I use this on just about every site I have. Its a must have plugin!
@Mike Price: I use this: https://wordpress.org/plugins/wp-gallery-custom-links/
It drives me crazy too :/
@Ipstenu (Mika Epstein): Yes exactly! that is the plugin that I now use since it came out originally! before that it was the functions.php code! ha!
Where there is a will^h^h^h^h HalfElf there is a way 🙂