Add background image to rich text section

Store Design
,

Topic summary

Goal: Add a background image to the “Was ist KP?” rich text section on a Shopify site.

How to implement:

  • Target the specific section’s CSS class: .section-template–17904032514316__811dcafe-2424-4f44-b0d7-eed3a00159d4-padding.
  • Add in theme CSS: Online Store > Theme > Edit code > Assets > base.css, then paste: .section-template–17904032514316__811dcafe-2424-4f44-b0d7-eed3a00159d4-padding { background-image: url(“YOUR_IMAGE_URL”); }
  • The image URL can be taken from the uploaded media library.
  • (Alternative) To affect all rich-text sections, add background-image to the general rich-text class instead.

Notes:

  • CSS (cascading style sheets) controls visual styling; background-image sets an image behind the section content.
  • A concrete CSS snippet and file path were provided; this code snippet is central to the solution.

Status: Actionable steps given; no confirmation of results. One participant criticized Shopify’s reliance on custom code versus drag‑and‑drop customization; no platform changes or resolution reported.

Summarized with AI on January 9. AI used: gpt-5.
1

Hi there,

I want to add a background image to a rich text section on my website https://taneraskin.com/

Particularly the white “Was ist KP?” section. Can somebody tell me what css code to add?

Best,

Isa

2

You can add:

background-image: url(“the link of your image”);

To the rich-text class

if you only want to add it to “Was ist KP?” section than add the code above to this class “section-template–17904032514316__811dcafe-2424-4f44-b0d7-eed3a00159d4-padding”

3

Thank you! So where exactly do I have to enter it? And can the URL be pasted from the uploaded media?

4

You can go to you CSS and search for “section-template–17904032514316__811dcafe-2424-4f44-b0d7-eed3a00159d4-padding” then add it inside the blocks.

Yes the URL can be uploaded media.

5

Hello @isabellemaria

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

.section-template--17904032514316__811dcafe-2424-4f44-b0d7-eed3a00159d4-padding {
    background-image: url("add your image url");
}
1 Like
6

Why does every solution to Shopify require custom code? All the most up to date applications including Divi, Wordpress, Elementor, and others are drag and drop solutions. These top solutions also require one payment, not monthly subscriptions. Why do we have to pay for Shopify monthly yet have to become programmers and write custom code for virtually EVERY solution??? Makes no sense. Maybe Shopify should take some of the millions in revenue and improve the platform so it’s easy for users to customize it!!!

1 Like