Home
Tutoriais
Efeitos
Ilustrações
Menus
Psds
Vagas
F.A.Q
Mapa
Layout free

Tutorial: Music Player


Olá, como vai você?
~Momento PC Siqueira e_e
Hoje eu trouxe um tutorialzinho que foi à pedido da minha ASK.FM, me pediram o tutorial do Music Player que eu uso no meu blog. 
Não gente, não é aquele gigantesco que alguns blogs deixam encima de tudo ou abaixo de tudo - ou aqueles que usam no tumblr - é um fofinho, super pequenininho e mega cute *--*
A única coisa ruim dele, é que só dá pra se colocar uma música e ponto.
Gostou?
É meio complicadinho, requer uma certa atenção, então preste atenção ai pessoal!

Primeiramente, devemos pegar o código da música que ficará na caixinha.
Vá no 4SHARED e clique em Music. Localize sua música lá e abra-a em uma nova guia.
CTRL+U e vai abrir todo o HTML da página. Dê CTRL+F e procure por:
preview.mp3
Quando achar, copie todo o código desde a primeira " até o final:
Deixe aquele código já selecionado e vá até ESSE site. 
Agora vamos aprender à personalizar as cores do player, colocar a música pra funcionar e como instala-lo no blogger.
Quando você entra no site, o player tem uma cor nada haver e uma música... tontinha.
Vamos começar mudando a música, onde está escrito "mp3" você cola o código copiado do HTML do 4shared. Se quiser dar play, verá que a música foi mudada.
Agora passemos a alterar as cores. Onde está escrito "Category" altere de General para Colors.
Eu fiz uma montagem muito mal feita e super corrida de o que significa o que naqueles espaços:

Ai é só você ir alterando conforme as cores do seu blog pedem ou usando as cores DESSA paleta e pronto. Ah, lembrando de que não precisa colocar o # na frente dos códigos, senão não irá funcionar.
Conforme você for mudando os códigos as cores mudarão também.
Depois de tudo isso é só copiar o código que aparecerá abaixo e aplicar num gadget de HTML/JavaScript do seu blog ;)
Espero ter ajudado.
Beijoos!

10 comentários:

  1. pode pegar músicas do tumblr também?

    ResponderExcluir
    Respostas
    1. Não amore, tem que pegar do 4shared mesmo senão não vai funcionar =/

      Excluir
  2. Muito obrigada :D Estava tentando achar esse tutorial a muito tempo kkkk :)

    ResponderExcluir
  3. Ha menina venha me dar um abraço.... finalmente eu consegui!!
    Ha sera que você pode me ajudar? eu tava querendo gadget separados como na no Blog ...... não sei se você me entendeu... mas me ajuda a como fazer isso

    ResponderExcluir
  4. Ha menina venha me dar um abraço.... finalmente eu consegui!!
    Ha sera que você pode me ajudar? eu tava querendo gadget separados como na no Blog ...... não sei se você me entendeu... mas me ajuda a como fazer isso

    ResponderExcluir
  5. Yeah, finalmente consegui, já tinha pegado esse tuto em outros blogs, só que não dava certo, o seu foi o mais fácil de entender kkk cara eu quero te dar um abraço de urso agora c:

    ResponderExcluir
  6. você sabe como eu faço para colocar no gadget de texto ?

    ResponderExcluir
  7. sabe quando clica no preview dai aparece aquele outro blogger? então eu coloquei um html mas não consegui mexer, e fiquei apaixonada tbm por dois htmls de vcs, e esse do preview eu adorei tbm, vcs podem mandar o código dele?? please ele é lindo demais!!!

    ResponderExcluir
  8. Muito cute, muito mais legal o que aquelas coisas gigantes. Amei o tuto <3
    Princess Diana ♔ || Imagine Directioner

    ResponderExcluir