Incorporare podcast da BuzzSprout

Supporto
1

Sto cercando di incorporare il codice da un popolare lettore di podcast, ma nessuna impostazione che cambio riesce a visualizzare il player. Il codice è molto semplice. Gli iframe erano facili. Questo invece non riesco proprio a capire.

2

Puoi pubblicare il codice rilevante (esclusi eventuali dati privati)?

3

FireShot Capture 157 - Buzzsprout - www.buzzsprout.com
FireShot Capture 157 - Buzzsprout - www.buzzsprout.com378×208 11.8 KB

4

OK, per quanto riguarda la CSP, dovresti semplicemente aggiungere https://www.buzzsprout.com alla tua CSP, come segue:

image
image1354×304 34.7 KB

Assicurati però che questo embed sia posizionato anche nel posto giusto del tuo tema.

5

OK, ho aggiunto l’URL ma non viene comunque visualizzato. Non sono sicuro di come modificare il tema. Stavo semplicemente incollando il codice all’inizio dei post relativi ai podcast nella community.

6

Ah, non puoi inserire un tag <script> in un post normale; se lo permettessimo, gli utenti potrebbero facilmente creare disordine sul tuo sito. Hai provato a inserire solo l’URL del podcast su una riga separata? Abbiamo una funzione chiamata oneboxing che potrebbe funzionare nel tuo caso, senza bisogno di incorporamenti complessi.

7

OK, cercherò quella informazione.

8

Ciao Penar,

Ho appena provato e non genera la casella unica:

https://www.buzzsprout.com/1306987/5209720-000-presentacion-empezamos-la-semana-que-viene.mp3

Dato che l’uso del loro tag script non è possibile, ho altre opzioni?

9

Lo script è qualcosa che può essere incorporato una volta nel tema del sito, o deve essere adiacente all’iframe?

modifica: ho risposto da solo alla mia domanda, è specifico per l’iframe, non è proprio molto utile da parte loro.

10

Si tratta di un file MP3 diretto; in tal caso, puoi utilizzare il tag audio HTML:

<audio controls><source src='https://www.buzzsprout.com/1306987/5209720-000-presentacion-empezamos-la-semana-que-viene.mp3'></audio>
11

@pmusaraj È davvero utile. Grazie!

Ciao @Stephen,

Cosa intendi per specifico per iframe? Questo è quello che forniscono:

<div id='buzzsprout-small-player-1306987'></div>
<script type='text/javascript' charset='utf-8' src='https://www.buzzsprout.com/1306987.js?container_id=buzzsprout-small-player-1306987&player=small'></script>

In realtà, @Aaron_Norris, ho appena capito che posso seguire quello script JS e semplicemente eseguire io stesso la decodifica:

unescape(decodeURI("%0A%0A%3Ciframe%20src=%22https://www.buzzsprout.com/1306987/5209720-000-presentacion-empezamos-la-semana-que-viene?client_source=small_player&amp;iframe=true&amp;referrer=https%253A%252F%252Fwww.buzzsprout.com%252F1306987.js%253Fcontainer_id%253Dbuzzsprout-small-player-1306987%2526player%253Dsmall%22%20width=%22100%25%22%20height=%22200%22%20frameborder=%220%22%20scrolling=%22no%22%3E%3C/iframe%3E%0A%0A%0A")); 
// restituisce questo iframe
<iframe src="https://www.buzzsprout.com/1306987/5209720-000-presentacion-empezamos-la-semana-que-viene?client_source=small_player&amp;iframe=true&amp;referrer=https://www.buzzsprout.com/1306987.js?container_id=buzzsprout-small-player-1306987&player=small" width="100%" height="200" frameborder="0" scrolling="no"></iframe>

Posso aggiungere buzzsprout alla whitelist in allowed iframes e funziona perfettamente:

image
image1063×332 44.3 KB

12

Puoi spiegarlo in modo che anche persone come me, un po’ meno esperte, possano capire? Vorrei poter riprodurre questo contenuto direttamente nel nostro forum (nota: non si tratta di un file .mp3 come sopra):

https://www.buzzsprout.com/1717287/8537076

13

Ciao Nathan,

Ecco i passaggi:

  1. Vai alla console di amministrazione e cerca “allowed iframes”

  2. Aggiungi https://www.buzzsprout.com e clicca sulla spunta per salvare la modifica

  3. Aggiungi questo al tuo post:

    <div data-theme-iframe="no-scroll">
<iframe src="https://www.buzzsprout.com/1717287/8537076?client_source=small_player&amp;iframe=true&amp;referrer=https://lacomunidad.deliberatespanish.com?player=small" width="100%" height="200" frameborder="0" scrolling="no"></iframe>
</div>

Il <div> circostante è opzionale, ma lo uso perché non voglio le barre di scorrimento nei miei iframe. Se desideri attivarle, devi seguire altri due passaggi:

  1. Vai sul tuo tema attivo, clicca su “Modifica CSS/HTML” e seleziona la scheda <head>
  2. Incolla questo codice e salva:
    <script type="text/discourse-plugin" version="0.8.42">
  api.decorateCookedElement(post =>
    post.querySelectorAll('div[data-theme-iframe="no-scroll"] iframe').forEach(iframe => {
      iframe.setAttribute('scrolling', 'no');
    }),
    { 
      id: 'iframe-decorator',
      onlyStream: true,
    }
  );
</script>
14

Fantastico! Rimuovere lo scorrimento lo migliora davvero.

Grazie per la guida chiara - super utile!!