Cara Memasang Lagu Sendiri di Blog

Pagi sobat Skyser..
Saya akan menepati janji saya kemarin di postingan ini hehehe
Oke Langsung ikutin step di bawah ini

Step :

1. Instal MP3 to SWF Converter, kalau belum punya bisa download di sini
2. Buka MP3 to SWF Converter kalian
3. Klik Add File

4. Kalau sudah setting optionnya terserah kalian, buat saya ga begitu penting

Setingan saya seperti ini

5. Lalu Klik Convert All

6. Kalau Sudah Upload filenya ke sini
7. Copy linknya

8. Lalu pastekan di blog kalian dengan code seperti ini
<embed autostart='true' height='0' loop='true' src='Link Lagumu' width='0'/> 9. Ganti text yang berwarna merah dengan link lagu anda tadi.

Semoga Bermanfaat ^_^

*Untuk yang tidak berhasil atau gagal silahkan baca cara ke 2 di sini

Tutorial Membuat Tombol Social Media Keren Di Blog

Dengan memasang widget sosial media pada blog, sobat dapat mengundang pembaca/pengunjung blog untuk terlibat dalam jejaring sosial sobat, dan tentunya dapat meningkatkan reputasi blog sobat. Namun hal itu tak akan terjadi jika pengunjung tidak mengklik tombol follow pada widget jaring sosial sobat, dan mereka hanya akan mengklik atau mengikuti update blog sobat kecuali mereka merasa atau menemukan hal yang berguna dan bermanfaat pada blog sobat. Widget ini tidak otomatis dapat meningkatkan follower blog sobat diberbagai jaring sosial tapi setidaknya kita dapat memancing mereka untuk setidaknya mengklik sekali pada tombol dengan membuat/menampilkan tombol widget ini lebih menarik dan memiliki efek hover yang meluas, mulus dan rapih . Efek hover ini kita buat dengan bantuan CSS3 transisi.

Fitur Dari Widget Ini :
  • Meliputi empat tombol jejaring sosial yang paling sering digunakan dan ditambah ikon RSS
  • Efek memperluas ke samping
  • Penggunaan CSS sprite
  • Sangat rapi dan bersih
  • Tidak ada JavaScript. JQuery No. Ini murni CSS

Oke langsung ke Step :
  1. masuk ke tata letak
  2. Tambah Gadget
  3. pilih HTML / JavaScript
  4. Lalu Masukan Kode Di Bawah Ini..
<style>
#tbisose{list-style:none; text-decoration:none; font-size:0.9em; font-family:trebuchet ms,sans-serif;}
#tbisose a{text-decoration:none; font-family:trebuchet ms,sans-serif;}
#tbisose li{position:relative; height:38px; cursor:pointer; padding: 0 !important;}
#tbisose .facebook, .googleplus, .pinterest, .rss, .twitter{position:relative; z-index:5; display:block; float:none; margin:10px 0 0; width:210px; height:38px; border-radius:5px; background:url(https://lh4.googleusercontent.com/-l0EYSSxxuc8/UFd37FdwjzI/AAAAAAAAG2E/CDbmwPO4haA/s800/sprites.png) no-repeat; background-color:rgba(217,30,118,.42); -webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px; -moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px; box-shadow:rgba(0,0,0,.28) 0 2px 3px; color:#141414; text-align:left; text-indent:50px; text-shadow:#333 0 1px 0; white-space:nowrap; line-height:32px; -webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out; -moz-transition:width .25s ease-in-out,background-color .25s ease-in-out; -ms-transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-transition:width .25s ease-in-out,background-color .25s ease-in-out; transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;}
#tbisose li:after{position:absolute; top:0; left:50px; z-index:2; display:block; height:38px; color:#141414; content:attr(data-alt); line-height:32px;}
#tbisose .icon{overflow:hidden; color:#fafafa;}
#tbisose .facebook{width:32px; height:32px; background-color:rgba(59,89,152,0.42); background-position:0 0;}
#tbisose .twitter{width:32px; height:32px; background-color:rgba(64,153,255,0.42); background-position:0 -33px;}
#tbisose .googleplus{width:32px; height:32px; background-color:rgba(228,69,36,0.42); background-position:-3px -66px;}
#tbisose .pinterest{width:32px; height:32px; background-color:rgba(174,45,39,0.42); background-position:0 -95px;}
#tbisose .rss{ width:32px; height:32px; background-color:rgba(255,102,0,0.42); background-position:-3px -126px;}
#tbisose li:hover .icon,
.touch #tbisose li .icon{width:210px;}
.touch #tbisose li .facebook, #tbisose li:hover .facebook{background-color:rgba(59,89,152,1);}
.touch #tbisose li .twitter, #tbisose li:hover .twitter{background-color:rgba(64,153,255,1);}
.touch #tbisose li .googleplus, #tbisose li:hover .googleplus{background-color:rgba(228,69,36,1);}
.touch #tbisose li .pinterest, #tbisose li:hover .pinterest{background-color:rgba(174,45,39,1);}
.touch #tbisose li .rss, #tbisose li:hover .rss{background-color:rgba(255,102,0,1);}
</style>
<ul id="tbisose">
<li data-alt="Follow us on Facebook"><a class="icon facebook" href="http://www.facebook.com/SevenSkysBlog">Follow us on Facebook</a></li>
<li data-alt="Follow us on Twitter"><a class="icon twitter" href="http://www.facebook.com/SevenSkysBlog">Follow us on Twitter</a></li>
<li data-alt="Follow us on Google+"><a class="icon googleplus" href="http://www.facebook.com/SevenSkysBlog">Follow us on Google+</a></li>
<li data-alt="Follow us on Pinterest"><a class="icon pinterest" href="http://www.facebook.com/SevenSkysBlog">Follow us on Pinterest</a></li>
<li data-alt="Subscribe with RSS"><a class="icon rss" href="http://www.facebook.com/SevenSkysBlog">Subscribe with RSS</a></li>
</ul>
<small><div style="font-size:80%; text-align:right; text-shadow:2px 2px 2px #adadad;"><a href="http://www.sevenskys.blogspot.com/2013/03/tutorial-membuat-tombol-social-media.html" target="_blank" title="Widget Follow Us">+ Get This Widget Here</a></div></small>
      5. Simpan ^_^

Keterangan :
  • Kode yang berwarna Orange, ganti dengan masing-masing alamat social media sobat..
Semoga Bermanfaat ^_^

Komentar

  1. Salam sobat.. ^-^
    Artikel yang sangat bermanfaat :-)
    Blog nya juga keren jadi betah nih disini :D haha
    Jangan lupa ya sobat berkunjung juga di Putra-Community | #14 . Terimakasih.. ^-^

    BalasHapus

Posting Komentar