Cara Membuat Efek Musik DiBlog

Hai Sahabat Blogger...
Diartikel kali ini aku akan memberi tahu caranya membuat efek musik didalam blog. Mungkin sahabat Blogger sudah pernah melihat dan mendengar beberapa blog diberi efek music tanpa mempengaruhi kecepatan loding blog dan efek music tersebut tidak terlihat alias tersembunyi.

Sebagai contoh bisa anda lihat di blog saya. Nah, setelah anda melihat contohnya aku akan menjelaskan bagaimana cara membuatnya.Pertama-tama, Anda harus memiliki file music yang beformat swf. Jika kalian ingin mengconvert file musik yang berekstensi MP3 menjadi SWF tapi belum memiliki aplikasinya sobat blogger bisa download Disini

Setelah sobat blogger berhasil mengconvert file music yang berekstensi MP3 menjadi SWF silahkan kalian upload terlebih dahulu file SWF tersebut. Web yang menyediakan jasa upload file SWF bisa sobat kunjungi Web yang menyediakan Jasa upload file swf DISINI

Lalu Bagaimana cara Memasukannya ke dalam halaman blog tanpa terlihat..?? itu menjadi pertanyaan para sahabat blogger kan..??

Ok, berikut ini cara menempatkannya di dalam blog.
Cara penempatanya kalian bisa memilih mau ditempatkan di setiap postingan atau di tempatkan di tampilan depan(HOMEPAGE) blog anda.
Jika anda ingin menempatkan efek musik di dalam postingan Copy Code Berikut ini tepat diakhir Postingan anda:

<embed align="MIDDLE" autostart="TRUE" height="0" loop="TRUE" src="LINK MUSIC SWF ANDA" width="0"></embed>

Keterangan :
Ganti Tulisan yang berwarna biru dengan Link Swf anda.

Jika anda ingin menempatkan Efek Musiknya di halaman depan( Home Page)blog anda, tinggal Copy Code yang diatas dan Masuk keDashboard sobat pilih Layout>>Add Gadget>>HTML and Java Script dan pastelah code diatas tersebut lalu Save.(Penempatan terserah mau dimana aja)
Kemudian lihat dan sobat dengar hasilnya. Semoga artikel ini bermanfaat sobat blogger sekalian.

Indahnya berbagi...

Salam Blogger....!!!

Cara Membuat Tulisan Mengikuti Kursor di Blog

Hai sob.........

Diartikel kali ini aku akan kasih tau cara Cara Membuat Tulisan Mengikuti Kursor di Blog. Kalau para blogger masih ada yang sedang memperindah blognya aku sarankan bisa mengikuti metode yang satu ini. Ywd langsung aj ya...

Cara Membuat Tulisan Mengikuti Kursor di Blog : 
1. Masuk ke dashbor blog sobat.
2. Klik Tata Letak (Layout) >> Tambah Gadget (AddGadget)>> Pilih HTML/Java Script.
3. Copy code berikut ke dalam box HTML/Java Script tadi

<style type='text/css'>
#outerCircleText {
font-style: italic;
font-weight: bold;
font-family: &#39;comic sans ms&#39;, verdana, arial;
color: #ff840a;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<script type='text/javascript'>
//<![CDATA[
;(function(){
// Pesanmu di sini, bahasa sundanya yaitu "Pesan anjeun di dieu.." hehehe... (QUOTED STRING)
var msg = "TULISAN YANG INGIN DITAMPILKAN";

// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 25;
// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;
// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;
// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;
// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.2;
// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;
// BERHENTI NGEDITNYA..! Parantos cicing di dieu! Ulah diteraskeun..! //
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement :
document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) +
'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
//]]>
</script>

Ket: Ganti tulisan yang berwarna merah dengan tulisan/teks yang sobat inginkan.

4. Simpan dan lihat hasilnya.

Mudah Bukan...???

Indahnya berbagi..

Salam Blogger

Sumber : Disini

Cara Membuat Artikel Terkait dengan Thumbnail

Cara Membuat Artikel Terkait dengan Thumbnail - Cara memberi/menciptakan related post dengan thumbnail gambar atau cara menjadikan artikel terkait muncul dengan gambar. Lihat Gambar Diatas.

Hai Sob,,,
Diartikel kali ini aku akan kasih tau tentang cara membuat related post dengan thumbnail(gambar) di blog. Silahkan dibaca: cara membuat related post atau artikel terkait. Tapi, membuat related post dengan thumbnail gambar pastinya lebih keren dan membuat pengunjung lebih betah di blog kita, silahkan lihat contoh di atas. Nah, bagi yang tertarik untuk membuatnya, silahkan ikuti langkah-langkah di bawah ini:

1. Login ke akun Blogger sobat.
2. Klik Template >> Edit HTML >> Lanjutkan (jangan lupa centang Expand Template Widget).
3. Dengan menggunakan CTRL+F atau F3, cari kode berikut: </head>
4. Pastekan kode di bawah tepat di atas kode nomor 3 di atas

<!--Related Posts with thumbnails Scripts and Styles Start-->
<!-- remove --><b:if cond='data:blog.pageType == "item"'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, Times New Roman , Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}
#related-posts a:hover {
background-color:#d4eaf2;
}
</style>
<script type='text/javascript'>
var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4Zxm7WAOwRFW1sMLJHuD_zxmMpZSyu9nhyphenhyphenDURFZIKrtHujBc0ClfmYPaMeJ4UHFcwfPlwEczSp0sgVWV63MlBXUH0HZXWDQvvUZTyPYaB_wETa-_38hnYw6VcnfqcQTzXGnUb6GscnHk/s400/noimage.png";
var maxresults=5;
var splittercolor="#d4eaf2";
var relatedpoststitle="Related Posts";
</script>
<script src='http://infonetmu.googlecode.com/files/related-posts-with-thumbnails-for-blogger-pro.js' type='text/javascript'/>
<!-- remove --></b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

5. Lanjutkan dengan mencari kode <data:post.body/> dan pastekan kode berikut tepat di bawah kode <data:post.body/> tadi

<!-- Related Posts with Thumbnails Code Start-->
<!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
</script>
</div><div style='clear:both'/>
<!-- remove --></b:if>
<!-- Related Posts with Thumbnails Code End-->

6. Simpan template sobat dan lihat hasilnya

Keterangan :
var maxresults = 5 adalah jumlah artikel akan ditampilkan di related post blog sobat.
var relatedpoststitle="Related Posts"; kamu bisa ganti kata Related Posts atau kalimat lain yang sobat inginkan.

Demikianlah posting mengenai cara membuat artikel terkait dengan thumbnail. Semoga bermanfaat buat semua.

Sumber : Disini

Cara Memasang Yahoo Messenger di Blog

Hai Sob,
Diartikel kali ini aku akan kasih tau Cara Memasang Yahoo Messenger di Blog, kalau bisa dibilang status ym kita di blog. Caranya mudah kok, pasti masih ada yang belum memasang status ym diblog kamu kan..??kl belum aku kasih tau dech Caranya Memasang Yahoo Messenger di Blog. Langsung aja ya...
Cara Memasang Yahoo Messenger di Blog
1. Masuk ke dashbor blog sobat.
2. Klik Tata Letak (Layout) >>> Tambah Gadget (Add Gadget)>>> Pilih yang HTML/Java Script.
3. Lalu masukkan script code dibwah ini:

<a href="ymsgr:sendIM?Id_yahoo_kamu"><img src="http://opi.yahoo.com/online?=Id_yahoo_kamu&amp;m=g&amp;t=0&amp;2=us"/>

4. Ubah Text yang berwarna Merah dengan Id Yahoo kalian, Sedangkan Text yang berwarna Biru ganti dengan Code gambar Berikut:

5. Simpan.

Mudah kan..??? 

Indahnya Berbagi...Salam Blogger...

Cara Membackup Template DiBlog

Hai Blogger,,
Diartikel ini aku akan memberi tahu Cara Membackup Template DiBlog. Fungsi Dari Membackup template itu sangat penting. Terkadang ketika mengutak-ngatik HTML template blog, baik itu sewaktu mengeditnya maupun pada saat menambahkan script lain ke dalam template tersebut, terjadi keruksakan pada template blog kita. Tentu saja hal ini akan membuat penampilan blog kita jadi kurang menarik dan bahkan bisa jadi terlihat ancur amburadul.

Makanya aku mau kasih tau Cara Membackup Template DiBlog untuk sobat blogger semua.
Nah Langsung aj ya..

 Cara Membackup Template DiBlog:

• Masuklah keDashbor sobat Blogger
• Pilih Rancangan (Template) Lihat Gambar Dibawah:

• Lihat Dibagian pojok kanan atas. Disana ada tulisan Backup/Restore. Lalu Kliklah.

• Nanti akan muncul tampilan seperti berikut:

• Setelah itu pilihlah Download Full template. Dan simpanlah Backup template blogger ditempat yang aman. Selesai dech...
• Jika kalian ingin merestore Backupan tadi tinggal pilih yang Choose File dan Upload.

Nah, jadi jika para blogger ingin mengutak-atik html atau template sobat ga perlu khawatir lagi dech jika sudah melakukan proses backup ini..

Semoga artikel ini bermanfaat untuk para Blogger baru yang ingin menjelajahi dunia Blogger.

Indahnya Berbagi,

Salam Blogger...!!!

Cara Membuat Sticky Social Pada Blog

Hai Blogger...

Diartikel kali ini aku mau share Cara Membuat Sticky Social Pada Blog. Sobat Blogger ada yang tahu Sticky Social? Sticky Social ini adalah widget yang serupa dengan social widget yang sering kita lihat diblog2 para blogger. Cuma,Sticky Social ini posisinya tidak vertical melainkan horizontal. kl bisa dibilang seperti stardock di desktop pc.

Nah,Bagi kamu yang tertarik dan ingin memasang Widget Sticky Social ini diblog kamu, ikutin cara - cara dibawah ini:

Cara Membuat Sticky Social Pada Blog:

• Masuk lah keHalaman Dasbor Sobat, pilih Rancangan (Template) - Edit HTML. Dan jangan lupa diExpand dulu ya. (Sebelum melakukan metode ini diharapkan untuk membackup template sobat sekalian untuk berjaga - jaga. Kalau masih ada yang belum tahu caranya bisa lihat Disini.)
• Masukkan lah script dibawah. dan letakkan di bawah kode <body>:

<!--stickysocial_dock--> 

<style type='text/css'> 

.stickysocial { 

background: transparent; 

position: fixed; 

top: 35%; 

left: 0.25%; 

z-index: 100; 

vertical-align: bottom; 

width: 37px; 

text-align: center; 

} 

.stickysocial a:hover { 

opacity: .73; 

-moz-opacity: .73;

filter: alpha(opacity=73); 

} 

</style> 

<div class='stickysocial' id='stickysocial_dock'> 

<a href='https://plus.google.com/USERID' target='_blank' title='Follow us on Google+'><img alt='Google+' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-google.png' style='position:relative; width:37px'/></a>

<a href='http://www.facebook.com/USERNAME' target='_blank' title='Follow us on Facebook'><img alt='Facebook' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-facebook.png' style='position:relative; width:37px'/></a> 

<a href='http://twitter.com/USERNAME' target='_blank' title='Follow us on Twitter'><img alt='Twitter' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-twitter.png' style='position:relative; width:37px'/></a> 

 <a href='http://www.myspace.com/USERNAME' target='_blank' title='Follow us on MySpace'><img alt='MySpace' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-myspace.png' style='position:relative; width:37px'/></a>

 <a href='http://softpcdownloads.blogspot.com/2013/02/cara-membuat-sticky-social-pada-blog.html' target='_blank' title='Get Widget'><img alt='SoftPcDownloads' src='http://i563.photobucket.com/albums/ss76/peace_enes/neon-rss-feed.png' style='position:relative; width:37px'/></a> 

 </div>

• Ganti Tulisan yang Bewarna Merah dengan nama ID atau UserName Akun Social Sobat Blooger Ubahlah ukuran top dan left-nya sesuai keinginan.
• Jika sudah selesai, Simpanlah (Save template) dan Lihat lah Hasilnya.
• Jika kamu menginginkan, kamu juga bisa menambah atau mengurangi icon-icon social network lainnya.

Semoga Artikel ini berguna untuk Sobat Blogger Semua.

Indahnya Berbagi,

Salam Blogger...!!!

Cara Untuk Membuat Like Facebook Melayang DiBlog

Hai Blogger Semuanya...

Diartikel kali ini aku akan kasih tau cara untuk membuat  Like Facebook melayang diblog. Sebelumnya aku sudah pernah Post tentang Cara membuat Yahoo Messenger diblog, makanya aku buat pasangan untuk Siyahoo tersebut diblog supaya tidak kesepian..hahaha.... Ywd dech langsung aj ya. kalau kebanyakan pembuka ga cukup ntar box post nya..hehehe..:)

Cara Untuk Membuat Like Facebook Melayang DiBlog:

1. Masuk keDashBoard Blogger kalian.

2. Setelah itu pilih Template>>Edit Html. Jangan lupa Diexpand ya..

3. Cari Kode </head> biar lebih mudah Ctrl + F aj trus masukin dech Keyword </head>.Setelah ketemu copy Script yang ada dibawah ini diatas kode </head> tadi:

<script src='http://jmk-js.googlecode.com/files/Fans%20Page%20FB.js' type='text/javascript'/>

4. Lalu Klik Save template.
5. Nah Setelah itu kita lanjut ketahap selanjutnya dengan cara pilih Layout>>AddGadget>>Pilih yang HTML/JavaScript.
6. Stelah itu masukkan Script yang ada dibawah ini:

<script type="text/javascript">

//<!--

$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});

//-->

</script>

<style type="text/css">

.w2bslikebox{background: url("http://s20.postimage.org/wudckp49p/facebook_copy.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}

.w2bslikebox div{border:none;position:relative;display:block;}

.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}

.w2bslikebox span a{color: #000000;text-decoration:none;}

.w2bslikebox span a:hover{text-decoration:underline;}

</style><div class="w2bslikebox" style=""><div>

<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/Softpcdownloads &amp;width=245&amp;colorscheme=dark&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=240" scrolling="yes" frameborder="" style="border: medium none; overflow: hidden; height: 240px; width: 246px;background:#000000;"></iframe></div></div>

7. Perhatikan Script diatas!!! Tulisan yang bewarna merah wajib diganti dengan url facebook sobat. Sedangkan yang bewarna biru untuk mengatur warna background.
8.Selesai juga akhirnya.

Mudah2an Artikel ini bisa membantu kalian yang ingin Membuat Like Facebook Melayang DiBlog. Semoga bermanfaat ya...Kalau ada yang mau ditanyakan bisa memberikan komentar dibawah. kl tidak ad halangan pasti langsung dibales..: )

Indahnya Berbagi..
Salam Blogger...!!!

Cara Membuat Link Otomatis Diartikel Blog

Cara Membuat Link Otomatis Saat Artikel Kita Di Copy Paste Orang Lain. Kenapa demikian?? Betapa pentingnya membuat Link sumber otomatis untuk blog kita, dimana ketika ada seseorang yg mengcopy paste artikel dari blog kita.
Maka di postingan copaster tersebut akan muncul sumber url postingan dari blog kita. Nah, Gimana?? Apakah sobat tertarik untuk membuatnya? Oke langsung saja ikuti cara saya berikut ini :

1. Masuk ke alamat ini Tynt.Com

2. Pilihlah Get Code. Lihat Gambar Dibawah:

3. Lalu isilah formulir seperti dibawah ini dgn lengkap dan klik SUBMIT:

4. Setelah itu kalian akan masuk ketempat dimana script disediakan, dan copy lah script terserbut:(NB: Hanya yang Dilingkari saja yang dicopy ya...??Selain itu jangan dicopy)

5. Lalu masuklah kedasboard Blogger kalian, lalu pilih template >>edit HTML dan jangan lupa expand ya...trus cari kode </head> letakan script yang kita dapet dari Tynt tadi diatas kode </head>

6. Finish.....Mudah bukan...??

Semoga Bermanfaat untuk kalian semua!!!

Salam Blogger...

Cara Membuat Scroll Pada Link List diBlog

Hai Blogger,

Diartikel kali ini aku mau share Cara Membuat Scroll Pada Link List diBlog.

Bagi kamu yang ingin membuat scroll pada Linklist-nya dapat mengikuti langkah-langkah berikut:

Dari halaman Dashbor, pilih Tata Letak (template) - Edit HTML.
Berikan tanda centang pada Expand Template Widget.
Kemudian cari kode type='LinkList' (NB: Gunakan Control F).
Perhatikan Code yang ada di bawah:

<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>

Lalu tambahkan perintah style='overflow:auto; height:200px' pada kode yangberwarna biru (NB:Harus didalam tanda kurung), sehingga menjadi seperti ini:

<b:includable id='main'>
 <b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content' style='overflow:auto; height:200px'> 

Untuk Mengatur ukuran tinggi (Height)-nya Ubahlah sesuai kebutuhan Sobat.
Save Template. Sebelum diSave bisa dipreview dulu kok. Dan Cara diatas bisa juga untuk Widget2 tambahan lainnya.Cuma, harus menyesuaikan nama widget yang ingin di ubah.

Semoga artikel ini bermanfaat untuk sobat blogger yang baru membangun blognya.

Indahnya Berbagi,

Salam Blogger....!!!

Cara membuat Link Dikolom komentar

Hai blogger,
Diartikel kali ini aku mau kasih tau Cara membuat Link Dikolom komentar. Metode ini juga bisa membuat link yang akan kita masukkan di kolom komentar, dan tersembunyi dibalik sebuah nama, pasti lebih rapihkan..???
Dan fungsi dari kita meletakkan link dikolom komentar banyak loh,,selain menaikkan rank dialexa atau sebagainya kita juga bisa saling berkunjung kesesama blogger dan saling sharing artikel. Nah, Langsung aj dech ya…
Cara membuat Link Dikolom komentar:
Sebenarnya sederhana saja, anda tinggal menyimpan link dengan menulis kode tag HTML pada kolom komentar, caranya tulis tag alamat dan Nama link blog anda.
Contoh :

<a href="http://softpcdownloads.blogspot.com/">SoftPcDownloads</a>, maka hasilnya akan  terlihat seperti ini : SoftPcDownloads

Anda juga dapat menambah efek huruf tebal dengan tag <b> dan </b>.
Contoh :

<b><a href="http://softpcdownloads.blogspot.com/"> SoftPcDownloads</a></b>, maka akan terlihat seperti ini : SoftPcDownloads

Teks berwarna merah anda gantikan dengan nama blog dan teks anchor blog anda.
Ini hanyalah salah satu tag yang dapat anda manfaatkan sebagai pemanis tampilan agar lebih rapi.
Semoga Cara Membuat Link di Kolom Komentar ini bermanfaat.

Indahnya Berbagi...