Skip to content

Discussion: Including images in FSE HTML templates #31815

Open

Description

What problem does this address?

I have received the question "How do I include images in templates?" a few times the past two weeks.

To include images -not placeholders- in HTML templates, the image needs to be remote or uploaded to the media library.
This becomes a problem when a theme is distributed as the link may break.

Remote resources are also not allowed in the theme directory. This is to prevent that the images used on peoples websites are suddenly switched to ads, or worse.

So why can't theme designers just use empty blocks?

Because we might be creating a niche theme that relies heavily on the topic of the image,
or have a visual design that is built around specific patterns and colors.

If a theme can not include for example a default header with a cover block background image,
it will be more difficult for users to pick a theme they like and start writing, instead they have to rebuild the theme by replacing all these empty image blocks.

Ways around it

-Add the images using the themes custom CSS. The problem with this is, how do users replace it?
-Leave templates blank and place all images inside block patterns. The problem is that the user has to assemble all the patterns.

What is your proposed solution?

I don't have one, let's try to find solutions together.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Assignees

No one assigned

    Labels

    [Feature] Site EditorRelated to the overarching Site Editor (formerly "full site editing")[Feature] ThemesQuestions or issues with incorporating or styling blocks in a theme.[Type] DiscussionFor issues that are high-level and not yet ready to implement.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions