Follow +
Dashboard
LINK NAME
LINK NAME
LINK NAME
Home ⌂

Navigation

Welcome


Hello there. You can insert anything here as your introduction into your world of blogging. So tell me, y you love to blog? Bye

  You can put anything here as well!

love blossom


Credits

   Full template by: miraaaa90    Blogskin: BubbleGum90


Music Player

Sunday, February 3, 2013 @ 12:35 AM
0 Comment(s)

Mini version of music player. 

Before and after hover. Situated on top of the blog. Like this.


Since youtube isn't allowed us to change their code to a smaller version, so here's another way that you can use and a much better petite music player. 

Copy this code below.
#music {
text-align: center;
font-size: 13px;
position:fixed;
left:20px;
top:-55px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;z-index:999;
} 
#music:hover {
top:-10px; 
}
#song {
background:#48cccd;
padding: 20px 0 5px 0;
border:1px solid #eee;
border-radius:8px;
z-index: 9999;
position:fixed;
font-family:Tahoma;
font-size:8px;
-webkit-transition:1s;
}
Below the #entry { . . . . . . . . . . . .  }
e.g:

#entry {
font-family: georgia;
font-size: 9pt;
position: absolute;
top: 300px;
left: 370px;
width: 700px;
padding: 0 10px 0 10px;
background-color: #ffffff;
}

#music {
text-align: center;
font-size: 13px;
position:fixed;
left:20px;
top:-55px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;z-index:999;
#music:hover {
top:-10px; 
}
#song {
background: #48cccd;
padding: 20px 0 5px 0;
border:1px solid #eee;
border-radius:8px;
z-index: 9999;
position:fixed;
font-family:Tahoma;
font-size:8px;
-webkit-transition:1s;
}
It doesn't mean that ur code is #entry it maybe #post or any other thing. Just make sure to paste it below the #(anything)

Change the bold code into any color code you like.

Next, copy this code below.

div id="music"> 
<div id="song"><center><div style="float:right; margin-right:5px;"> Tokens? </div><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="15" height="25"><PARAM NAME=movie VALUE="http://www.strangecube.com/audioplay/online/audioplay.swf?file=http://media.irondj.net/mix/file/30821/Primadonna_Girl_-_Marina_and_the_Diamonds__Lyrics__HD-_www_flvto_com_.mp3&auto=yes&sendstop=yes&repeat=0&buttondir=http://www.strangecube.com/audioplay/online/alpha_buttons/negative_small&bgcolor=0xffffff&mode=playpause"><PARAM NAME=quality VALUE=high><PARAM NAME=wmode VALUE=transparent><embed src="http://www.strangecube.com/audioplay/online/audioplay.swf?file=http://media.irondj.net/mix/file/30821/Primadonna_Girl_-_Marina_and_the_Diamonds__Lyrics__HD-_www_flvto_com_.mp3&auto=yes&sendstop=yes&repeat=0&buttondir=http://www.strangecube.com/audioplay/online/alpha_buttons/negative_small&bgcolor=0xffffff&mode=playpause" quality=high wmode=transparent width="15" height="25" align="" TYPE="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></object><div id="player"><br>♫ ♬♫ ♬</div> </center></div> 
</script>
<div></div>
<script type="text/javascript"> 
$('body').hide();
$('body').fadeIn(2000);
</script>
</div> 

Paste this code below </head> Now, time to change ur song choice :D

Go to this website.  Then, search for you song choice in the search bar.



Click on the song that you want. Then, slide down a bit till you find html embed column. On the small box contain the code, scroll on it till you find



Click on the down arrow once,


Now copy the code starting after file/. . . . 
for example 

http://media.irondj.net/mix/file/31876/Taylor_Swift_-_I_Knew_You_Were_Trouble_Lyrics.mp3

Only copy the one that I've bold it. ONLY!

Then, go back to the template. Replace the bold code with the one that you've copied.

<div id="music"> 
<div id="song"><center><div style="float:right; margin-right:5px;"> Tokens? </div><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,0,0" width="15" height="25"><PARAM NAME=movie VALUE="http://www.strangecube.com/audioplay/online/audioplay.swf?file=http://media.irondj.net/mix/file/30821/Primadonna_Girl_-_Marina_and_the_Diamonds__Lyrics__HD-_www_flvto_com_.mp3&auto=yes&sendstop=yes&repeat=0&buttondir=http://www.strangecube.com/audioplay/online/alpha_buttons/negative_small&bgcolor=0xffffff&mode=playpause"><PARAM NAME=quality VALUE=high><PARAM NAME=wmode VALUE=transparent><embed src="http://www.strangecube.com/audioplay/online/audioplay.swf?file=http://media.irondj.net/mix/file/30821/Primadonna_Girl_-_Marina_and_the_Diamonds__Lyrics__HD-_www_flvto_com_.mp3&auto=yes&sendstop=yes&repeat=0&buttondir=http://www.strangecube.com/audioplay/online/alpha_buttons/negative_small&bgcolor=0xffffff&mode=playpause" quality=high wmode=transparent width="15" height="25" align="" TYPE="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed></object><div id="player"><br>♫ ♬♫ ♬</div> </center></div> 
</script>
<div></div>
<script type="text/javascript"> 
$('body').hide();
$('body').fadeIn(2000);
</script>
</div> 

And tadaaaa u're done :) Well truthfully, there's quite a lot of step but believe me you'll be satisfied. Toodles~ 

Labels:


Add Object

Monday, December 31, 2012 @ 5:07 AM
0 Comment(s)



Assalamualaikum.
Today Mira nak ajar macam mana nak Add Object dekat blogskin. What i mean by object is macam gambar, youtube player and so on. 

Lets begin! |Youtube Player|
Firstly korang pergi lah log in Blogger > Template. Macam biasa lah kan. Then cari code <body> Copy code dekat bawah ni and paste it under the code <body> 


<div style="position: fixed; top:490px; left: 930px; bottom: 30px; z-index:2;filter:alpha(opacity=85); background-color:transparent;"><object width="200" height="25"><param name="movie" value="http://www.youtube.com/v/noLrCDzAp5M?fs=1&amp;autoplay=1&amp;hl=en_US&amp;color1=0xD462FF&amp;color2=0xD462FF" /><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/noLrCDzAp5M?fs=1&amp;autoplay=1&amp;hl=en_US&amp;color1=0xD462FF&amp;color2=0xD462FF" type="application/x-shockwave-flash" width="200" height="25" allowscriptaccess="always" allowfullscreen="true"></embed></object></div>

This is the code. Korang boleh edit code ni dengan cara yg korang nak lah kan.

Blue - The object position. fixed (the object position won't change at all)or absolute (the object position will follow as u scroll downwards or upwards)
Purple - The object position on the blog. Just change the numbers.
Green - Size of youtube player.
Pink - Youtube player code. Just change the music code.


Replace the pink code with the blue highlight code. 
Orange - Color of youtube video. Just change the html color code. Google it.

Thats All~

Labels: