Neste tutorial, explicaremos o processo de edição e utilização de um template de contagem regressiva para o nosso player.
Nota: Recomendamos utilizar um editor de código como VS Code para realizar ajustes no código sem afetar o template.
- Download e Extração: Faça o download do arquivo .zip anexado e extraia o arquivo.
- Após extrair o arquivo, encontre um arquivo com nome index
e uma pasta com nome src
.
- Abra o arquivo index com seu editor de texto. Neste tutorial utilizaremos o VS Code.
- Na linha 17 do código com o id=titulo. Troque 'contagem regressiva" pelo título que deseja que apareça no template.
- Após isso pode salvar o arquivo. É possível valvar apertando Ctrl + S ou na parte superior do editor selecionando "File" e em "Save"
- Após isso abra a pasta src
- Terá uma imagem com nome background com um tamanho de 1920x1080. É possível substituir essa imagem de background por qualquer imagem que prefira, é necessário que a nova imagem tenha o mesmo nome da atual background e que o formato seja .jpg.
Para trocar a animação que aparecerá ao final da contagem regressiva, é possível fazer o mesmo processo com o arquivo fogos.gif. Garantindo que o novo arquivo tenha o mesmo nome e esteja também em formato .gif.
- Abra o arquivo script.js com o editor de código.
- Na linha 9, troque 2025 pelo ano em que irá ocorrer o final da contagem regressiva.
Na linha 10, troque January pelo mês em que a contagem regressiva encerrará, garantindo que o mês esteja escrito em inglês e com a primeira letra maiúscula.
No campo 00:00:00, insira a hora, minuto e segundo em que a contagem regressiva será finalizada.
- Na linha 35, onde está escrito Felicidades!, troque pela mensagem que deseja que apareça ao final da contagem regressiva. É necessário manter as aspas " " no texto.
- Agora basta salvar a alterações. Clicando Ctrl + S ou selecionando no menu superior "File" e "Save".
- Compacte novamente a pasta src e o arquivo index.html da forma que estava originalmente.
- Faça o upload do arquivo .zip creado ao 4yousee Manager como um conteúdo normal. Após isso adicione o conteúdo a playlist do player que deseja mostrar a contagem regressiva.