可以加背景图像的块

Blocks That Support Background Images in WordPress Gutenberg

In the WordPress Block Editor (Gutenberg), some blocks allow you to set a background image directly. Here are the best options:

1️⃣ Cover Block (Best for Full-Width Backgrounds)

✅ Supports: Background images & videos

✅ Best for: Hero sections, headers, call-to-action areas

🔹 How to Use:

1. Add a “Cover” block (+ → Search for “Cover”).

2. Click “Upload” or choose an image from the Media Library.

3. Adjust the opacity, overlay, and text color for better readability.

4. Add any content inside it (text, buttons, etc.).

5. Resize to fit your layout.

📌 Tip: You can also use a video background with the Cover block! 🎥

2️⃣ Group Block (For Multiple Blocks with Background)

✅ Supports: Background images & solid colors

✅ Best for: Wrapping multiple blocks inside one background

🔹 How to Use:

1. Add a “Group” block (+ → Search for “Group”).

2. Click on the block and go to Block Settings → Styles.

3. Select Background → Image and upload/select an image.

4. Add blocks inside it (paragraphs, buttons, headings, etc.).

📌 Tip: Works well for sections with multiple blocks sharing a background.

3️⃣ Columns Block (Background for Multiple Columns)

✅ Supports: Background images via the Group Block

✅ Best for: Side-by-side layouts with different content sections

🔹 How to Use:

1. Add a Columns block.

2. Wrap it inside a Group block.

3. Set a background image on the Group block.

4. Add content inside each column.

📌 Tip: Great for grid layouts with a background.

4️⃣ Media & Text Block (Image on One Side, Text on Another)

✅ Supports: Background images on the media side

✅ Best for: Content sections with text + image side-by-side

🔹 How to Use:

1. Add a Media & Text block.

2. Upload an image on the left (or right).

3. Add text on the other side.

📌 Tip: Ideal for feature sections or service descriptions.

5️⃣ Buttons Block (Add Background via Group Block)

✅ Supports: Background images if wrapped inside a Group Block

✅ Best for: Call-to-action (CTA) sections

🔹 How to Use:

1. Add a Group block → Set background image.

2. Inside, add a Buttons block with a CTA (e.g., “Learn More”).

📌 Tip: Great for stylish call-to-action sections.

🎯 Best Option for You?

• ✅ Full-page background? → Cover Block

• ✅ Section with multiple blocks? → Group Block

• ✅ Grid layout with background? → Columns Block

• ✅ Side-by-side layout? → Media & Text Block

• ✅ CTA with a background? → Group + Buttons Block

Need help with styling or responsiveness? 😊