Como Inserir No Meu Site o Reprodutor Oferecido Pela DonWeb para Minha Radio

DattaRadio
Inicio > DattaRadio > Consultas Tecnicas >
Como inserir no meu site o reprodutor oferecido pela

DonWeb para minha radio?
Tags: DattaRadio, jPlayer, reproductor, streaming de audio
Alem dos links que permitem aos visitantes escutar sua radio atraves dos seus reprodutores favoritos (iTunes, Windows
Media, VLC, Real Media, Winamp, etc.), a DonWeb oferece para voce um reprodutor Flash/HTML para que possa inclui-
lo no seu site, assim podem escutar tambem a sua radio sem precisar de um reprodutor instalado no seu PC/MAC/Linux ou
dispositivo movel.
Subindo alguns arquivos na sua hospedagem e colando um pouco de codigo no seu site, voce podera fazer que seus
visitantes escutem a sua radio rapidamente e aumentar a quantidade de ouvintes.
Funcionamento
O reprodutor que oferecemos para voce esta baseado no jPlayer (jPlayer.org). jPlayer e um reprodutor de Audio e Video
Open Source, desenvolvido para funcionar com o jQuery, HTML5 e Flash.
Um dos principais beneficios do jPlayer e que utiliza tecnologia HTML5 para reproduzir audio, e se a versÃ£o do
navegador e antiga e nÃ£o suporta o HTML5, automaticamente incluira um reproductor em Flash para que o visitante nÃ£o
fique sem escutar o radio.
Hoje, a maioria dos navegadores dos dispositivos moveis suportam HTML5, con o qual, os visitantes moveis poderÃ£o
escutar a sua radio no momento de visitar seu site.
InstrucÃµes paraÂ para inserir no seu site.

1
Descarregar os arquivos necessarios a partir daqui.
2
Descomprimir e colar a pasta jplayer a raiz da hospedagem do seu site (no arquivo demo.html,
incluido no arquivo que descarregou, voce encontrara codigo de exemplo).
3
Agora, e preciso inserir os codigos necessarios na pagina do seu site onde estara o reprodutor:
<link href="/jplayer/skin/dattaradio/jpl
type="text/javascript" src="http://ajax.
type="text/javascript" src="/jplayer/js/
Este codigo deve ser colado dentro das etiqueta HEAD do codigo HTML da pagina.
4
Imediatamente depois do codigo de acima, colar o seguinte codigo:
<script type="text/javascript">
$(document).ready(function(){
var stream = {
title: "MI Radio",
mp3: "http://200.58.101.247:8000/;stream/1"
},
ready = false;
$("#jquery_jplayer_1").jPlayer({
ready: function (event) {
ready = true;
$(this).jPlayer("setMedia", stream);
},
pause: function() {
$(this).jPlayer("clearMedia");
},
error: function(event) { if(ready && event.jPlayer.error.type === $.jPlayer.error.URL_NOT_SET)
{
// Setup the media stream again and play it. $(this).jPlayer("setMedia",
stream).jPlayer("play");
}
},
solution: 'flash, html',
swfPath: "js",
supplied: "mp3",
preload: "none",
wmode: "window",
keyEnabled: true
});
});
</script>
E preciso que voce substitua http://200.58.101.247:8000 pela combinacÃ£o IP/Porto da sua radio.
Esta informacÃ£o pode ser encontrada no menu Enlaces rapidos do seu painel de controle.
Para que a sua radio comece a se reproduzir assim que o visitante chegar ao site, mude o codigo
anterior pelo seguinte. Caso contrario o visitante devera clicar no botÃ£o PLAY para comecar a
escutar a radio.
<script type="text/javascript">
$(document).ready(function(){
var stream = {
title: "Minha Radio",
mp3: "http://200.58.101.247:8000/;stream/1"
},
ready = false;
$("#jquery_jplayer_1").jPlayer({
ready: function (event) {
ready = true;
$(this).jPlayer("setMedia", stream).jPlayer("play");
},
pause: function() {
$(this).jPlayer("clearMedia");
},
error: function(event) { if(ready && event.jPlayer.error.type === $.jPlayer.error.URL_NOT_SET)
{
// Setup the media stream again and play it. $(this).jPlayer("setMedia",
stream).jPlayer("play");
}
},
solution: 'flash, html',
swfPath: "js",
supplied: "mp3",
preload: "none",
wmode: "window",
keyEnabled: true
});
});
</script>
5
Finalmente, sera preciso colocar o seguinte codigo HTML no lugar da pagina onde queremos que o
reprodutor figure, sempre dentro das etiquetas <body></body>.
<div id="jquery_jplayer_1"></div>
<div id="jp_container_1">
<div>
<div>
<ul>
<li><a href="javascript:;" tabindex="1">play</a></li>
tabindex="1">pause</a></li> <li><a href="javascript:;" tab
title="mute">mute</a></li> <li><a href="javascript:;" tabi
title="unmute">unmute</a></li> <li><a href="javascript:;"
volume</a></li>
</ul>
<div>
<div></div>
</div>
</div>
<div>
<span>Actualizacion requerida</span> Para escutar a radio com este player, voce deve atualizar seu
browser ou sue <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
</div>
</div> <p>by <a href="https://dattatec.com/site/radio-en-internet-audio-streaming" title="Sua radio na
Internet" target="_blank">DattaRadio</a> Player</p>
</div>
No arquivo que voce tenha descarregado para instalar e configurar o reprodutor, tem um arquivo
chamado demo.html onde voce encontrara todo este codigo de exemplo pronto para usar.
Alem do maisâ€¦
Se voce tiver alguns conhecimentos do HTML e CSS, voce podera criar seu proprio skin ou modificar aquele que
oferecemos para adaptar o reprodutor ao estilo do site onde seja inserido.
Alias, se voce tem conhecimentos do JavaScript e jQuery, pode visitar a web do reprodutor jPlayer.org para potenciar o uso
dele.

Como Inserir No Meu Site o Reprodutor Oferecido Pela DonWeb para Minha Radio

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Como Inserir No Meu Site o Reprodutor Oferecido Pela DonWeb para Minha Radio

Enviado por

Direitos autorais:

Formatos disponíveis

DattaRadio

Inicio > DattaRadio > Consultas Tecnicas >

Como inserir no meu site o reprodutor oferecido pela

InstrucÃµes paraÂ para inserir no seu site.

Você também pode gostar