[4.0] Not possible to style background image in custom module 'Options'

[Scrabble96]

Problem identified

1. Create a custom module
2. Go to options and select a background image
3. Discover that there is no option to specify background image styling such as cover, no-repeat, background-position etc, The default output is simply to output the image's URL which will repeat the image at its actual size if it's smaller than its container.
4. There are only two ways to override the style: one is by adding a pre-existing class to the module, if one exists with the required parameters, and two: by adding CSS to the template's style sheets. However, if a user is a front-editor only then they won't have access to these files.

Proposed solution

1. Either remove this option and expect people to have the knowledge to add background images to divs manually using html and inline code in the code editor, or
2. Add further background image style choices (background-colour, background-position, etc etc). This still generates inline styles, but that can't be helped here.

I know from reading other posts that many are against inline styles, but for non-techy users who just want a single background image behind some text, it's unlikely that they'd know anything about styling or and even less likely to start using relative and absolute positioning of images instead.

Open questions

Do you agree and if so should it be suggested as a feature request? Thanks.

[brianteeman]

or 3. Leave it as it is

[Scrabble96]

or 3. Leave it as it is

Possibly, but I don't think it's much use as it is.

[bembelimen]

But isn't that a template thing?

If your template uses a framework, you can work with the module suffixes.

[Scrabble96]

But isn't that a template thing?

If your template uses a framework, you can work with the module suffixes.

Well, yes, I could add a new class that includes the image name and do the whole background image in a user.css file. But it might not be me creating the module and wanting to add a background image, e.g. for a one-off event notice. As I said originally, a non-techy front-end user without access to the template's user.css files and without enough/any CSS knowledge to code it in the module editor, wouldn't be able to adjust it. I don't know about your clients, but mine are very non-techy restaurant owners, B&B owners, builders, church volunteers, etc. So if it needs to be styled with CSS, rather than having choices in the Options tab, what's the point of having it as an option?

[brianteeman]

Just checking but isnt this exactly the same in j3?

[Scrabble96]

Just checking but isnt this exactly the same in j3?

Quite possibly, although I’ve never used it. I was testing Cassiopeia and came across it. If it is a J3 ‘feature’ then why not improve it, as many other features have been?

[brianteeman]

I was asking so we could see if its a bug/loss of functionality or a new feature

[Scrabble96]

Just checking but isnt this exactly the same in j3?

Yes, it is exactly the same in J3.