daily auto-sync 2026-07-13
This commit is contained in:
aeroreyna
@@ -0,0 +1,85 @@
|
||||
---
|
||||
Date: 2026-07-13
|
||||
Tags: [emi, subsplash, embeds, giving, live-stream, app-promo, csp]
|
||||
Source: User provided Subsplash embed codes
|
||||
---
|
||||
|
||||
# Subsplash Embeds — EMI Hub Integration
|
||||
|
||||
## Embeds Provided (3)
|
||||
|
||||
### 1. Upcoming Live Stream — `d/*next-live`
|
||||
```html
|
||||
<div class="sap-embed-player"><iframe src="https://subsplash.com/u/emmint/media/embed/d/*next-live"frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="clipboard-read; clipboard-write"></iframe></div><style type="text/css">div.sap-embed-player{position:relative;width:100%;height:0;padding-top:56.25%;}div.sap-embed-player>iframe{position:absolute;top:0;left:0;width:100%;height:100%;}</style>
|
||||
```
|
||||
- Uses responsive 56.25% (16:9) padding-top technique
|
||||
- Src `https://subsplash.com/u/emmint/media/embed/d/*next-live` — wildcard next-live resolved by Subsplash to next upcoming live
|
||||
- Works with `florida.emmint.com` custom domain? Florida uses `storage1.snappages.site/G2XZK8` but Subsplash universal `u/emmint` should work for global
|
||||
|
||||
### 2. Giving — `u/-G2XZK8/give`
|
||||
Original provided:
|
||||
```html
|
||||
<script id="subsplash-embed-p4y7" type="text/javascript">
|
||||
var target = document.getElementById("subsplash-embed-p4y7");
|
||||
var script = document.createElement("script");
|
||||
script.type = "text/javascript";
|
||||
script.onload = function() {
|
||||
subsplashEmbed(
|
||||
"u/-G2XZK8/give?&embed=true",
|
||||
"https://subsplash.com/",
|
||||
"subsplash-embed-p4y7"
|
||||
);
|
||||
};
|
||||
script.src = "https://dashboard.static.subsplash.com/production/web-client/external/embed-1.1.0.js";
|
||||
target.parentElement.insertBefore(script, target);
|
||||
</script>
|
||||
```
|
||||
- Embed ID `subsplash-embed-p4y7` — note duplicated with App Promo below — needs distinct IDs to avoid collision
|
||||
- Uses external embed-1.1.0.js loader pattern: create script element, onload call subsplashEmbed(channel, base, id)
|
||||
- Channel `u/-G2XZK8/give?&embed=true` — -G2XZK8 is Florida? Actually Florida media library uses G2XZK8 asset path, but this is global emmint Subsplash? Likely global giving — need confirm global vs Florida giving separate?
|
||||
- Base `https://subsplash.com/`
|
||||
- This embed will inject iframe for giving form recurring + one-time + ACH + Apple Pay etc
|
||||
|
||||
### 3. App Promo — `+p4y7/ap` — redo better
|
||||
Original:
|
||||
```html
|
||||
<script id="subsplash-embed-p4y7" type="text/javascript">var target = document.getElementById("subsplash-embed-p4y7");var script = document.createElement("script");script.type = "text/javascript";script.onload = function() {subsplashEmbed("+p4y7/ap","https://subsplash.com/","subsplash-embed-p4y7");};script.src = "https://dashboard.static.subsplash.com/production/web-client/external/embed-1.1.0.js";target.parentElement.insertBefore(script, target);</script>
|
||||
```
|
||||
- Same id `subsplash-embed-p4y7` duplicated — both Giving and App Promo use same id — will break second embed if both on same page (getElementById returns first, second script tag same id invalid HTML)
|
||||
- Channel `+p4y7/ap` — Subsplash app promo channel? `+` indicates short link? p4y7 likely corresponds to EMI app code
|
||||
- Should be `subsplash-embed-app` distinct id
|
||||
- "let's redo our implementation of this better" — per user — means current app promo implementation on WP maybe poor, needs better design (VOUS editorial style, not generic box)
|
||||
|
||||
## Fixes Applied for Integration
|
||||
|
||||
- Use distinct IDs: `subsplash-embed-give` for Giving, `subsplash-embed-app` for App Promo, keep live as iframe class `sap-embed-player`
|
||||
- Avoid id collision by renaming
|
||||
- For both script embeds, ensure script src `https://dashboard.static.subsplash.com/production/web-client/external/embed-1.1.0.js` — needs CSP allow `script-src https://dashboard.static.subsplash.com https://subsplash.com` plus `frame-src https://subsplash.com`
|
||||
- Instatic publisher CSP currently `script-src none` — will block inline scripts — need to allow these specific scripts via site_apply_css? Actually Instatic publisher blocks script via CSP header meta? Need to check: Instatic published artefacts add CSP `script-src none` by default for security (Layer A). Subsplash embeds require script execution — so need to either:
|
||||
- Allow via publishing as raw HTML file in /app/uploads/published/current/ which may have CSP none — but then scripts blocked
|
||||
- Solution: Instatic has way to allow external scripts? Need to use `site_apply_css`? No, need check CSP config in Instatic site settings or add meta to allow — or host embeds as iframes only (Live already iframe, Giving can be iframe alternative? Subsplash give also has iframe URL: `https://subsplash.com/u/-G2XZK8/give` could be embedded via iframe instead of script loader)
|
||||
- Alternative iframe for Giving: `<iframe src="https://subsplash.com/u/-G2XZK8/give?embed=true" ...>` — test
|
||||
- For now, publish as artefact with CSP meta override? Instatic may strip? But we control artefact directly writing to /app/uploads/published/current/ so we can set CSP meta ourselves to allow these domains
|
||||
|
||||
## Integration into EMI Hub Sections
|
||||
|
||||
- `/` main already has Give placeholder with link to https://www.emmint.com/give/ + https://florida.emmint.com/give — now replace with real Giving embed
|
||||
- `/` main Media Hub has Subsplash media embed placeholder — now replace Latest Sermon with `d/*next-live` for upcoming live, plus add App Promo better implementation below media
|
||||
- Also need new subpage `/give/` dedicated giving page with Giving embed + transparency + Books Shop link
|
||||
- `/live/` or `/watch/` subpage with Upcoming Live Stream embed + past sermons + YouTube Walking Voice Media
|
||||
|
||||
## Related Brain Docs
|
||||
- [[emi_publication_roadmap_2026]] — Give section P0, Media Hub P0
|
||||
- [[emi_immich_resource_2026]] — office.reynafamily.com 43 albums
|
||||
- [[emi_books_inventory_2026]] — 12 books Amazon enriched 25KB /books/
|
||||
- [[emi_portfolio_data_collection_2026]] — 22 locals expanded
|
||||
- [[emi_local_ministries_draft_2026]] — locals filter implementation
|
||||
|
||||
## Implementation Steps
|
||||
1. Save these embeds to brain — this doc
|
||||
2. Update main index.html artefact to use real embeds with fixed ids
|
||||
3. Create dedicated /give/ subpage with Giving embed + transparency
|
||||
4. Create /watch/ or /live/ subpage with Next Live embed
|
||||
5. Redo App Promo better — not generic box — editorial VOUS style with phone mockup + QR + App Store badges
|
||||
6. Check CSP — if blocked, fallback to iframe version for Giving
|
||||
7. Test on laptop http://192.168.68.110:3005/ sections
|
||||
Reference in New Issue
Block a user