# Music Player Settings

> **What You’ll Learn**
>
> * How to enable and customize the music player
> * How to upload and link your own audio files
> * How to use optional disk art, hover bars, and song list styles

***

### 📂 Access Music Player Settings

1. From your Shopify Admin, go to **Online Store > Themes**
2. Click **Customize** next to your active Plain Jane theme
3. In the Theme Editor, open the **Theme Settings** panel (paintbrush icon)
4. Select **Music Player** from the menu

***

### 🎧 Enable the Music Player

* Toggle **Show Music Player** to enable it on desktop
* Optional: Enable **Show Music Player on Mobile**
* You can choose to display a rotating disc image by enabling **Show Disk**
* Upload a custom **Disk Cover Image** to personalize your music UI
* Customize the **Music Player Button Color**

***

### 🎶 Upload Your Tracks

> ⚠️ **Streaming services are not supported**
>
> You must use a **direct .mp3 file link** — Spotify, Apple Music, SoundCloud, and other streaming URLs will not work.

#### To upload a song:

1. Go to **Shopify Admin > Content > Files**
2. Click **Upload Files** and select your `.mp3` file
3. Once uploaded, click the **Link icon** next to the file
4. Copy the link URL
5. Paste it into any **Music URL** field in Theme Settings

> 🔹 You can upload up to 6 songs using the **Music URL 1–6** fields 🔹 Use the **Track Name** fields to label each song (e.g. artist - title)

***

### 🔊 Song Bar Options

* Enable the **Song Bar** to show the current track name on hover
* Use **Center Song Bar** to center the label under the player
* **Always Show Song Bar** keeps the track visible at all times

Customize your song bar:

* **Song Bar Text Color**
* **Sound Bar Color** (gradient or solid)
* **Font Size** for track display

***

### 💲 Additional Options

* Add a track to **Password Animation Unlock Music** to autoplay music when the password screen animation ends
  * You must enable "Password Enter Animation" in the Timer section on your Password page for this to take effect

***

### 🔊 Tips

* Use short track names to avoid UI overflow
* Make sure your `.mp3` files are compressed to reduce site load time
* Test playback across devices

> 📢 Music will only play once the user interacts with the page due to browser auto-play rules

***

### **Need Help?**

* 💬 **Join our community on Discord:** <https://discord.gg/hcc2GvgZc6>
* 📧 **Email us at:** <support@openspaces.design>
* 💻 **Live chat with us:** Available Monday–Friday, 10AM–6PM EST, directly on our website


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.openspaces.design/plain-jane-interactive/theme-settings/music-player-settings.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
