Openspaces Labs
  • 🏠 Getting Started
    • Installing the Plain Jane Theme
    • Theme Versions + Features Table
  • 🧰 Theme Settings
    • Announcement Bar
    • Animations
    • Cart Drawer
    • Clock Settings
    • Collection Layout Settings
    • Cursor Settings
    • Footer Settings
    • Global Menu Settings
    • Music Player Settings
    • Logo Settings
    • Skip Home Screen
    • SEO Settings
    • Main Theme Color
    • Typography Settings
  • 🗂 Pages & Menus
    • Homepage + Menu
      • Center Menu
      • Side-Aligned Menu
      • Compact Menu Layout (Global Menu)
    • Collection Page
      • Classic Collection
      • Sidebar Collection
    • Collection List Page
    • Product Page
      • Product Section (Showcase)
      • Product Section (Thumbnail)
    • About Page
    • Contact Page
    • Lookbook Page
      • 🛠 How to Create a Lookbook Page
      • 🗂 Creating a Lookbook Archive
      • ⚙️ Lookbook Settings & Features
    • Password Page
      • How To Password Lock Store
      • How To Add and Set Timer
      • How To Collect Emails + SMS
      • Using The Store Unlock Animation
  • 🧩Sections and Features
    • Blog Feed Section
    • Collection Display Section
    • Collection List Section
    • Email Signup (Popup)
    • Email Signup (Embed)
    • FAQ Section
    • Hero Section
    • Image Selector Section
    • Image Stream Section
    • Marquee Section
    • Preloader Section
    • Product Carousel Section
    • Text Block Section
    • Video Spotlight Section
  • 🏷️Advanced
    • How to Add Size Charts to Each Product
    • Setting Up Color Swatches
    • Setting Up Model Info
    • Setting Up Pre-Orders
  • 👥Customer Accounts
    • How To Setup Customer Accounts
    • Login Page
    • Register Page
    • Account Dashboard Page
    • Address Management Page
  • 🌎Languages & SEO
    • Language Files (Locales)
    • Update Favicon
    • Meta Descriptions
  • ⭐️Plain Jane Interactive
    • How to Create an Interactive Space
    • Setting The Background
    • Adding Interactive Points
    • Using Transition Arrows
    • Best Practices for Mobile + Spacing
  • 💬 FAQ & Troubleshooting
Powered by GitBook
On this page
  • What You’ll Learn
  • 1. Open the Background Block
  • 2. Upload a Background Image
  • 3. Mobile Responsiveness
  • 4. Multiple Interactive Spaces?
  • Need Help?
  1. ⭐️Plain Jane Interactive

Setting The Background

What You’ll Learn

🖼️ How to upload a background for your Interactive Space 📐 Recommended dimensions and aspect ratios 🎯 Tips for centering, resizing, and mobile optimization


1. Open the Background Block

  1. In the Theme Editor, go to the page with your Interactive Space

  2. In the left sidebar, expand the Interactive Space section

  3. Click the Background block

This is the canvas where all your interactive points and arrows will sit.


2. Upload a Background Image

Click Select image to upload a new background.

⚠️ Important: Your background must be in a 16:9 aspect ratio for best layout and alignment.

Recommended Sizes:

  • 1280 × 720 (HD)

  • 1920 × 1080 (Full HD)

  • 2560 × 1440 (2K)

  • 3840 × 2160 (4K)

💡 Use a design tool like Figma, Photoshop, or Canva to create an image with the correct aspect ratio. This prevents stretching or cutoff issues on different devices.


3. Mobile Responsiveness

The image will auto-scale for mobile but:

  • Avoid placing critical hotspots near the edge

  • Test your design on both desktop and mobile in the Theme Editor

🧪 Save and refresh if things look off-center — the layout recalibrates after saving.


4. Multiple Interactive Spaces?

Each Interactive Space page can have its own unique background. Just assign the right image in each page's Interactive Space section.

💡 This is great for building themed “rooms” or categories (e.g. one space for men’s products, one for women’s, etc.)


Need Help?

  • 📧 Email us at: support@openspaces.design

  • 💻 Live chat with us: Available Monday–Friday, 10AM–6PM EST, directly on our website

PreviousHow to Create an Interactive SpaceNextAdding Interactive Points

Last updated 4 days ago

💬 Join our community on Discord:

https://discord.gg/hcc2GvgZc6