Hi Ed,
I didn’t get a notification on this unfortunately, didn’t realize I had to subscribe. Sorry for the delay.
I wish it were so simple! That rule is already in place, but doesn’t help. Here’s why.
We’re actually not using the archive description to display content above, rather, we made a shop page to display richer content above the fold. But still, the idea behind this fix won’t work, because the content in question is /after/ div.woocommerce-count-wrap and form.woocommerce-ordering. This is the real problem.
For example, on a category product archive page, I’m using html in the category description, which has the css rule you mention already in place, to no effect:
.term-description, p.archive-description {
clear: both;
padding-top: 20px;
}
These elements are locked into the html template, and the woocommerce_archive_description action is called after these elements are outputted (line 186 in archive-product.php).
The only CSS trickery that would work was forcing them below the existing element using position:absolute, since they’re actually earlier in the DOM, so no clearing is going to work, you have to take the elements out of the DOM flow and hack them in below the element in question.
Even something as simple as moving line 186 up to line 145 (the do_action call) places page content ahead of the output of the ordering and result counts, and allows proper styling, since these elements really should always be attached to the product results themselves, and the archive_description is getting between these two things.
This is a start, but it still means using CSS to hide the sorting, for example, rather than removing it via a remove_action on woocommerce_catalog_ordering. since those 2 actions are now hardcoded (woocommerce_result_count, and woocommerce_catalog_ordering, since there’s no more woocommerce_before_shop_loop call now)
Still, it would save me (and anyone else trying to style these things and use archive and category page headers) a ton of trouble. I have probably 50 lines of css (across various responsive stylesheets) to account for the height of the header element (which changes as the page shrinks, so the top value on the result-count div has to change). It’s actually already broken on pagination (where the header disappears for some reaon). It would be a big relief if it could just fixed at the source.
I think I subscribed properly this time, so I’ll answer more quickly, sorry about that!
.