2.12.13

Como Centralizar o Music Player e Posiciona-lo igual ao Meu e como colocar ele la em Cima






Ola pessoas lindas vou mostrar pra vocês como colocar music player no blog a pedido de Bunny Crazy..<3



Vá em Design > Elementos da página > Procure por ]]></b:skin> Cole acime dele esse código abaixo.


.music {
padding:12px;
border-bottom-right-radius:5px;
background:#ffffff;
}
#ytube {
text-align: center;
position:fixed;
left:43px;
top:-55px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-0-transition: all .5s ease-in-out;
z-index:999;
}
#ytube:hover {
top:-10px;
}
#pict {
height:35px;
background: #ffffff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
width: 50px;
align:center;
}

Vá em Design > Elementos da página > Adicionar um gadget > Gadget HTML/JavaScript

<div id="ytube">
<div class="music">
Code youtube korang
</div>
<div id="pict"><br/><img src="Code icon comel korang" />
</div></div>


<div id="ytube">
<div class="music">
<center><object width="60" height="25"><param name="movie" value="http://www.youtube.com/v/PsO1UsFMuaY?version=2&amp;autoplay=1&amp;hl=en_US&amp;color1=ffffff&amp;amp;color2=ffffff " /><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><embed src="http://www.youtube.com/v/PsO1UsFMuaY?version=2&autoplay=1&hl=en_US&amp;color1=ffffff&amp;amp;color2=ffffff "" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="60" height="25"></embed></object></center>
</div>
<div id="pict"><br /><img src="http://sl.glitter-graphics.net/pub/122/122842r9l2jjtjaf.gif" /></div></div>

Esse que esta de Vermelho coloque o código do video do youtube como esse exemplo na imagem
abaixo
Foi neste Blog que eu peguei duniaphotoscape



  Esse código e para posicioná-lo:
<div style="position: absolute; margin-top: -132px; left:135px;"><center>Código aqui para centralizá-lo</center>

Este e o site para você personaliza-lo como quiser.

http://flash-mp3-player.net/players/mini/

Para você colocar o código e so clicar em Generator e em Html code você personalize as cores nesta Tabela de cores.


Prontinho diverta-se muito :) obrigada e volte sempre e se for colocar no seu coloque crédito viu...

6 comentários:

  1. Ah boa dica O:
    Pode ser que eu faça isso um dia (:

    Segue aí? *o*
    http://words-by-ricci.blogspot.pt/

    ResponderExcluir
  2. Obrigada por fazer o tutorial Ari-chan, me ajudou muito. :3

    ResponderExcluir
  3. Obrigada pelo tuto! Com certeza vou usar nos meus blog's!
    http://lovenator.blogspot.com.br/
    teawithdevils.blogspot.com.br

    ResponderExcluir
  4. Obrigada pelo tuto! Com certeza vou usar nos meus blog's!
    http://lovenator.blogspot.com.br/
    teawithdevils.blogspot.com.br

    ResponderExcluir
  5. Obrigada pelo tuto! Com certeza vou usar nos meus blog's!
    http://lovenator.blogspot.com.br/
    teawithdevils.blogspot.com.br

    ResponderExcluir

✖♥Seja educado, não use palavras ofensivas ;
✖♥Comente algo relacionado ao post, para pedidos use a ask onde esta no menu Peça Aqui...
✖♥ Obrigada e volte sempre!!!!