89 lines
2.2 KiB
Markdown
89 lines
2.2 KiB
Markdown
# Installing the Kiosk Dashboard
|
|
|
|
## Step 1: Copy Dashboard YAML
|
|
|
|
1. Open Home Assistant
|
|
2. Go to **Settings > Dashboards**
|
|
3. Click **+ ADD DASHBOARD**
|
|
4. Choose **Start with an empty dashboard**
|
|
5. Name it: `Kiosk Dashboard`
|
|
6. Click the **⋮** (three dots) menu > **Edit Dashboard**
|
|
7. Click **⋮** again > **Raw configuration editor**
|
|
8. Copy the contents of `dashboard-kiosk-improved.yaml` and paste it
|
|
9. Click **SAVE**
|
|
|
|
## Step 2: Set Up RSS Feed for Fox News
|
|
|
|
### Option A: Using HACS (Recommended)
|
|
|
|
1. Install HACS if not already installed
|
|
2. Go to HACS > Integrations
|
|
3. Search for "RSS Feed" or "Feedparser"
|
|
4. Install the integration
|
|
5. Restart Home Assistant
|
|
6. Add to `configuration.yaml`:
|
|
```yaml
|
|
rss_feed_template:
|
|
fox_news_breaking:
|
|
url: "https://feeds.foxnews.com/foxnews/latest"
|
|
scan_interval: 300
|
|
```
|
|
|
|
### Option B: Manual RSS Feed Setup
|
|
|
|
1. Install `feedparser` custom component
|
|
2. Add to `configuration.yaml` (see `setup-rss-fox-news.yaml`)
|
|
3. Restart Home Assistant
|
|
|
|
## Step 3: Enable Auto-Scroll
|
|
|
|
### Option A: Install Auto-Scroll Card (Best)
|
|
|
|
1. Install via HACS: `auto-scroll-card`
|
|
2. Update dashboard YAML to use `type: custom:auto-scroll-card`
|
|
3. Configure scroll speed
|
|
|
|
### Option B: CSS Injection (Quick)
|
|
|
|
Add this to your dashboard's card-mod style or use a custom card:
|
|
|
|
```yaml
|
|
card_mod:
|
|
style: |
|
|
ha-card {
|
|
animation: scroll 120s linear infinite;
|
|
}
|
|
@keyframes scroll {
|
|
0% { transform: translateY(0); }
|
|
100% { transform: translateY(-100%); }
|
|
}
|
|
```
|
|
|
|
### Option C: Browser Console (Temporary)
|
|
|
|
Open browser console (F12) and run:
|
|
```javascript
|
|
setInterval(() => window.scrollBy(0, 1), 50);
|
|
```
|
|
|
|
## Step 4: Customize Entities
|
|
|
|
Edit the dashboard YAML to:
|
|
- Add/remove entities
|
|
- Adjust card sizes
|
|
- Change colors and fonts
|
|
- Add more sections
|
|
|
|
## Step 5: Set as Default Dashboard
|
|
|
|
1. Go to **Settings > Dashboards**
|
|
2. Find "Kiosk Dashboard"
|
|
3. Click **⋮** > **Set as default on this device**
|
|
|
|
## Troubleshooting
|
|
|
|
- **RSS not showing**: Install RSS feed integration first
|
|
- **Auto-scroll not working**: Install `auto-scroll-card` or use CSS
|
|
- **Cards too small**: Increase font-size in card-mod styles
|
|
- **Missing entities**: Check entity IDs match your setup
|