PROMOÇÃO - Magazine Luiza - NÃO PERCA!

Encontre no blog...

09/05/2015

Widget com player para ouvir músicas no seu blog

Streaming-de-música

Player de músicas no blog

Existem vários aplicativos e códigos para colocar músicas streaming em blogs ou sites, mas não achei nenhum tão bom como o grooveshark.com que atualmente foi desativado da web por problemas com as gravadoras – uma pena.

Para substituí-lo, encontramos o Deezer, que também possui plano gratuito, tem uma quantidade imensa de músicas disponíveis (milhares), é totalmente legal, pois não fere os direitos autorais, segundo a política de funcionamento do site (o widget não permite o download das músicas, mas apenas a reprodução delas com a licença e a responsabilidade do Deezer).

O único problema é que no plano gratuito, o Deezer  exige que o leitor do seu blog se cadastre no aplicativo e esteja logado no momento em que for ouvir músicas do seu player de reprodução. Caso contrário o leitor só poderá ouvir músicas por apenas 30 segundos.

Além disso, na reprodução de várias músicas, em uma playlist por exemplo, o leitor será obrigado a ouvir clips publicitários entre uma música e outra.

Cadastrando-se no aplicativo – plano grátis

Acesse o site: www.deezer.com

Widget com player para ouvir músicas no seu blog - Visual Dicas

Para criar um player de músicas exportável, você precisará se cadastrar no site primeiro. Preencha os campos Endereço de e-mail, Senha, Nome de usuário, Sexo e Idade, depois clique no botão [Cadastre-se].

Se preferir, você também poderá se cadastrar através da sua conta do [Facebook] ou do [Google+] –> Caso utilize uma destas opções, será necessário permitir o acesso  da sua conta na rede social…. mas fique tranquilo que é bem seguro – leia as condições gerais de uso no link http://www.deezer.com/legal/cgu.

Widget com player para ouvir músicas no seu blog - Visual Dicas

No nosso exemplo fizemos o cadastro por e-mail. Após o cadastro você já entra imediatamente no painel do Deezer.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Veja as diferenças de reprodução das músicas nos planos grátis (freemium) e pago (premium).

Widget com player para ouvir músicas no seu blog - Visual Dicas

Para saber mais sobre as diferenças dos planos grátis e premium+, acesse o link http://www.deezer.com/offers/

Criando o seu Widget

Para criar widgets com player para músicas individuais basta escolher uma música, um artista ou até um álbum no campo procurar [Procurar] que aparece no menu lateral do painel do Deezer.

Widget com player para ouvir músicas no seu blog - Visual Dicas

No nosso exemplo vamos procurar uma música do Led Zeppelin. Então, vamos digitar Led Zeppelin no campo procurar. Tecle [Enter] ou selecione [Ver tudo–>] em Resultados

Widget com player para ouvir músicas no seu blog - Visual Dicas

Na guia [Todos], role a tela e escolha a música desejada. Escolheremos a música Whole Lotta Love para o nosso exemplo. Clique no símbolo com “três pontos” que aparece na mesma linha da música escolhida.

Widget com player para ouvir músicas no seu blog - Visual Dicas

No menu da música Whole Lotta Love selecione [Exportar].

Widget com player para ouvir músicas no seu blog - Visual Dicas

Configure o layout do widget conforme descrição abaixo:

  1. Defina o tamanho do player colocando as dimensões em Size, largura (width) e altura (height).
  2. O formato padrão (Format) está definido como Classic. Se desejar, clique em Square para o mudar o formato do layout.
  3. Selecione Autoplay se desejar que o player inicie a música automaticamente (não recomendável para blogs).
  4. Em Hexa color você poderá alterar a cor do link, definido por padrão como azul.
  5. E finalmente em Theme você poderá alterar o layout do widget de dark (escuro) para light (claro).

Na figura abaixo definimos o widget da nossa música de exemplo. Observe optamos pelo formato Classic e o Theme como dark.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Após definido o layout do seu widget role a tela e copie o código em IFRAME.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Recomendamos que teste primeiro o código usando o Squids Editor. Cole o código no lado esquerdo do editor em Código Fonte. Clique no botão [Enviar Código] para ver e ouvir o seu playlist em ação.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Depois de tudo verificado, cole o código no blog ou site no local desejado. Se você não sabe como fazer isso, leia os artigos abaixo:

Como instalar um Widget no seu Blog -(Blogger)

Como inserir Widgets no Wordpress sem a instalação de plugins

Como inserir códigos HTML nas postagens do Blogger

Como inserir códigos HTML nas postagens do Wordpress

Veja abaixo o nosso primeiro widget de exemplo gratuito (formato Classic).

Atenção: Se você não for cadastrado e, ou, não estiver logado no Deezer ouvirá apenas 30 segundos do player. Para usufruir do player completo no plano gratuito, o leitor precisará se cadastrar e acessar o aplicativo Deezer.                                   Widget com player para ouvir músicas no seu blog - Visual Dicas

Veja agora o mesmo exemplo no formato Square.

 

Criando uma lista de músicas

Para criar widget com um lista de músicas clique em [Playlists] no menu lateral do painel do Deezer.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Clique no botão [+ Criar uma playlist].

Widget com player para ouvir músicas no seu blog - Visual Dicas

Digite o nome da sua playlist e clique no botão com o ícone em azul. No nosso exemplo colocamos Led Zeppelin – favoritas.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Agora usando o campo procurar, localize as músicas que deseja inserir na sua playlist. No nosso exemplo vamos pesquisar músicas do “Led Zeppelin”.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Escolha as músicas que você deseja inserir na playlist . Com o botão direito do mouse, clique na linha da música desejada e selecione [Adicionar a uma playlist].

Widget com player para ouvir músicas no seu blog - Visual DicasWidget com player para ouvir músicas no seu blog - Visual Dicas

Clique na playlist que você criou. No nosso exemplo Led Zeppelin – favoritas. Repita isto para todas músicas a serem adicionadas na sua playlist.

Widget com player para ouvir músicas no seu blog - Visual Dicas

No plano pago, se preferir você poderá marcar várias várias músicas e clicar no botão [+] para adicioná-las na sua playlist.  (Não funciona no plano gratuito)

Widget com player para ouvir músicas no seu blog - Visual Dicas

Editando suas músicas no playlist

No menu lateral do Deezer clique em [Playlists].

Widget com player para ouvir músicas no seu blog - Visual Dicas

Clique sobre o link da playlist que você deseja visualizar ou  deletar músicas. No nosso exemplo vamos clicar na playlist que foi criada anteriormente, ou seja, Led Zeppelin – favoritas. 

Widget com player para ouvir músicas no seu blog - Visual Dicas

Clique com o botão direito do mouse na linha da música que você deseja editar. No menu escolha se quer ouvir, compartilhar, exportar ou remover a música do seu playlist.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Editando a sua playlist 

Clique em [Playlists] no menu do painel do Deezer. Depois clique no no símbolo com “três pontos” que aparece na mesma linha da playlist escolhida.

Widget com player para ouvir músicas no seu blog - Visual Dicas

No menu escolha se quer ouvir, compartilhar, exportar ou excluir a playlist da sua conta.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Criar um widget com sua lista de músicas

Para criar o widget de reprodução na conta gratuita, clique em [Playlists] no menu do painel do Deezer e entre na página da playlist escolhida.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Na página da playlist clique no botão [Compartilhar].

Widget com player para ouvir músicas no seu blog - Visual Dicas

Clique no símbolo indicado na imagem abaixo.

Widget com player para ouvir músicas no seu blog - Visual Dicas

Da mesma forma que mostramos anteriormente, configure o layout do widget…

Widget com player para ouvir músicas no seu blog - Visual DicasWidget com player para ouvir músicas no seu blog - Visual Dicas

Copie o código em Frame.

Widget com player para ouvir músicas no seu blog - Visual DicasWidget com player para ouvir músicas no seu blog - Visual Dicas

Teste o widget usando o Squids Editor. Cole o código no lado esquerdo do editor em Código Fonte. Clique no botão [Enviar Código] para ver e ouvir o seu playlist em ação.

Widget com player para ouvir músicas no seu blog - Visual DicasWidget com player para ouvir músicas no seu blog - Visual DicasWidget com player para ouvir músicas no seu blog - Visual Dicas

Se tudo estiver funcionando bem, cole no seu blog ou site.

Abaixo veja como ficou o nosso widget. Mas não esqueça, se você não estiver cadastrado e logado no Deezer ouvirá apenas 30 segundos da playlist, pois no nosso exemplo usamos o plano gratuito.

Para saber mais sobre o Deezer, acesse a página http://support.deezer.com/hc/pt-br.

byALF 

Leia também:

Música digital em nuvem: baixar músicas será coisa do passado…
Música para todos (streaming de qualidade e gratuito)

1 comentários:

Gilmar de Oliveira disse...

Amigo, gostei desse primeiro Menu que vc usa com: HOME
CURSOS ONLINE
VÍDEOS
PARCERIA
ESTATÍSTICAS
AUTOR
CONTATO. Me ensina a colocar um no meu. Rsss

Postar um comentário

Gostou do Post? Então espalhe!

Quem está curtindo...

Encontre no blog...

Fique mais.... Leia os nossos artigos!!!

Gostou? Então espalhe!

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Web Analytics