Metrônomo e afinador para o seu site
Para colocar um metrônomo no seu site, escolha as opções abaixo, toque em “Copiar código” e cole o código num bloco de HTML da sua página. O afinador funciona do mesmo jeito. É grátis, não precisa de cadastro e o widget não tem anúncios.
Monte o seu widget
Prévia
O link embaixo do widget leva para o MetronoTuner. Você pode tirar, mas ele ajuda o projeto a continuar grátis.
Como colocar no seu site
Copie o código no gerador acima e cole na sua plataforma:
WordPress
- Abra a página ou o post no editor.
- Toque em + e escolha o bloco “HTML personalizado”.
- Cole o código e publique.
Wix
- No editor, toque em “Adicionar elementos” (+) › “Incorporar código” › “Incorporar HTML”.
- Escolha “Código”, cole e toque em “Atualizar”.
- Aumente a caixa até o widget caber inteiro.
Blogger
- No editor do post, troque para a “Visualização em HTML”.
- Cole o código onde o widget deve aparecer e volte para a visualização normal.
- Para a barra lateral: “Layout” › “Adicionar um gadget” › “HTML/JavaScript”.
Notion
- Aqui, toque em “Copiar só o endereço” (o Notion não aceita código HTML).
- Na página do Notion, digite /embed e escolha “Embed”.
- Cole o endereço e confirme.
HTML
- Cole o código dentro do <body>, no ponto da página onde o widget deve aparecer.
- O widget ocupa a largura disponível, até o máximo que está no código.
Para quem prefere editar o código
O endereço do widget aceita estes parâmetros, iguais em todas as línguas (os nomes e os valores ficam assim mesmo, sem tradução):
-
bpm - Andamento do metrônomo, de 30 a 250. Exemplo:
bpm=90 -
compasso - Compasso e agrupamento dos acentos. Exemplo:
compasso=7/8:2+2+3 -
instrumento - Instrumento do afinador (sem ele, o afinador é cromático). Exemplo:
instrumento=ukulele -
afinacao - Afinação do instrumento (sem ela, a padrão). Exemplo:
afinacao=drop-d -
tema - claro, escuro ou auto (segue o aparelho). Exemplo:
tema=escuro -
tamanho - compacto mostra só o essencial. Exemplo:
tamanho=compacto -
fundo - transparente deixa o fundo do seu site aparecer. Exemplo:
fundo=transparente
As ferramentas completas
Perguntas frequentes
O widget é grátis?
Sim. Qualquer site pode usar: blog, site de professor, de escola ou de banda. O widget não tem anúncios e não precisa de conta.
Funciona no celular?
Sim. O widget se ajusta à largura da tela e funciona nos navegadores do celular, do tablet e do computador.
Precisa de cadastro?
Não. É só copiar o código e colar no seu site: não há conta, chave nem login.
O microfone funciona dentro do widget?
Sim, no afinador. O código já vem com allow="microphone", que libera o microfone dentro do iframe, e na primeira vez o navegador pergunta a quem visita se pode usar. O som é analisado no aparelho e não é gravado nem enviado. O seu site precisa estar em HTTPS; em plataformas que põem o código dentro de outra moldura, como o Wix e o Notion, o navegador pode bloquear o microfone.
Posso mudar a cor?
Você escolhe o tema claro, o escuro ou o automático, que segue o aparelho de quem visita, e pode deixar o fundo transparente para o widget se misturar ao seu site. As cores dos botões são as do MetronoTuner.
O widget deixa o meu site mais lento?
Não. O código usa loading="lazy": o widget só carrega quando chega perto da tela. O som e a análise do microfone rodam no aparelho de quem visita.