Como inserir audios no Blogger com o Dropbox

Está procurando uma forma de colocar áudios nas suas publicações no Blogger? Acompanhe a seguir como inserir áudios no seu blog com o Dropbox.

Acompanhe o tutorial em vídeo:

Através do Dropbox você pode inserir áudios numa publicação com facilidade. Você adiciona os arquivos de áudio na sua conta, cria o link e cola na sua postagem. 

Nesta publicação veremos como fazer isso na plataforma Blogger.

Localizando os arquivos no servidor

Caso você não tenha ainda uma conta no Dropbox, acompanhe nesta publicação como criar uma conta e configurar para adicionar facilmente arquivos, criando uma pasta no seu computador.

Acessando pelo navegador, selecione o menu Meus Arquivos (recomendo adicionar os arquivos de áudio direto na pasta padrão, evitando nomes com espaços ou acentuações).

Clique em Compartilhar em cada arquivo de áudio que desejar inserir no seu blog, para criar um link.

Na janela que abrirá, clique em Criar um link - o link que você usará na publicação para localizar o áudio e reproduzir.

Copie o link na área de transferência com a opção Copiar link. Você pode colar num editor de texto para usar depois no blog ou colar direto na publicação. Veja mais adiante como o onde colar.

Inserindo no Blogger

Para inserir no Blogger o player ou reprodutor de áudio, é preciso usar a tag HTML de audio. Em primeiro lugar, na página da postagem que você quer inserir o áudio no Blogger, mude a edição para HTML, como na ilustração abaixo:

A tag HTML para funcionar o reprodutor de áudio é criada com linhas em destaque abaixo (você pode copiar e colar, substituindo depois o link):

<audio controls="">
  <source src="https://www.dropbox.com/s/81u1es7i547dz36/NomeDoArquivo.mp3?dl=1" type="audio/mpeg"></source>
O player de áudio não funciona neste navegador. Experimente abrir em outro...</audio>

O reprodutor de áudio aparecerá na sua publicação no trecho onde você colocar as linhas acima. Se sua publicação tiver muito texto, ficará muito confuso no modo HTML. Use o atalho Ctrl + F e digite no campo de pesquisa para localizar um trecho específico da sua publicação, como um título ou palavra próximo de onde você quer colocar o áudio). 

Detalhe importante: as linhas de código do áudio não aparecem na visualização normal (a visualização do botão Escrever, ao lado de HTML). Para colocar espaço antes e depois, adicione <br> antes de <audio controls=""> e depois de </audio>. 

Entre as haspas de src=" " é onde você deverá colar o link copiado na "nuvem" da sua conta do Dropbox (substitua o 0 no final do link pelo número 1):

Visualize a postagem para ver o resultado. Deverá aparecer o reprodutor de áudio como na imagem abaixo:

Note que aparecerá o tempo do áudio em questão, se estiver tudo em ordem. Repita o processo para colocar outros áudios.