Adding Transparent Background Image To Categories

How would I go about adding images as the background for categories?

I’ve tried various ways using known tricks such as pseudo elements like ::after and ::before to control the transparency of the image without affecting the main content, which I’ve targeted via the data-category-id attribute, but this didn’t seem to work. Instead it was covering the full category table and/or creating an empty space at the beginning or end of the category’s row.

I’m wanting to be able to control this via css so that I can replace images easily or change the opacity.

Below is a screenshot of what I’m trying to achieve without the obvious issue of the text fading as well.


The main trick I tried using is discussed here, but I am open to other options if there are any.

Anybody have any ideas on how to accomplish this?