Jumat, 07 September 2012

Tata cara membuat Label melayang layang di blog

Filled under:

Salam blogger,selamat pagi sahabat ku semua....Saya dari komunitas kediri akan berbagi ilmu tentang blog,kali ini saya akan mengajarkan cara membuat label berputar-putar di blog,sebener nya sudah banyak sih blog blog yang mempostingan tentang ini,tapi gak papa,siapa tau kalau ada orang yang belum mengerti cara nya membuat label berputar putar di blog,oke sekarang langsung saja kita praktekkan langkah langkah nya.....pertama tama seperti biasa login terlebih dahulu di akun blog kalian.Pilih rancangan/desing dan klik edit HTML lalu lanjut.

Centang Expand Template Widged,untuk menghindari apa bila terjadi ke salahan.
lalu cari kode tersebut: 

Untuk Template lama cari kode ini : <b:section class='sidebar' id='sidebar' preferred='yes'>
Untuk Template baru Cari Kode ini: <b:section-contents id='sidebar-right-1'>

Kalau sobat sudah menemukan kode di atas tadi,letakkan kode di bawah ini tepat di bawah kode yg tadi:

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a>and<a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "300", "200", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

Kode yang berwarna hijau adalah lebar widget,sobat bisa menggantinya menurut selera.
Kode yang berwarna Merah adalah tinggi widget.sobat juga bisa menggantinya.

Lalu Klik Save atau Simpan kalau kurang yakin sobat bisa mempratinjau terlebih dahulu.

sekian pembahasan kali ini semoga postingan saya ini bermanfaat buat sobat sobat semua pengunjung blog saya.salam komunitas kediri.

Posted By RONI RUSMANA18.21

Cara Pasang Anti Klik Kanan di Blog

Filled under:



Sobat, jumpa lagi dengan saya dalam postingan kali ini yang ingin memberikan informasi tentang cara memasang anti klik kanan pada blog. Anti klik kanan ini sangat berguna bagi para sobat yang tidak ingin postingannnya di copas sama orang lain.
Untuk cara pemasangannya di blog sobat, simak dan praktekkan cara di bawah......





1. Log in ke blogger sobat
2. Pergi ke Rancangan>Elemen Laman. Di sana, klik Tambah Gadget, lalu tambahkan HTML/Java Script.
3. Pada kotak konten masukkan kode di bawah:

<script language="JavaScript1.2"> var msgpopup="Blog gue anti klik kanan bro......"; function pmb(){       if(alertVis == "1") alert(message);           if(closeWin == "1") self.close();           return false; } function IE() {      if (event.button == "2" || event.button == "3"){pmb();} } function NS(e) {      if (document.layers || (document.getElementById && !document.all)){           if (e.which == "2" || e.which == "3"){ pmb();}      } } document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("alert(msgpopup);return false") </script>


Pada kode berwarna hijau ganti dengan kata-kata sobat sendiri. Tulisan tersebut yang akan muncul ketika ada yang mengklik kanan blog sobat..

4. Klik simpan, dan lihat hasilnya....

Posted By RONI RUSMANA18.19

Rabu, 05 September 2012

Cara Merubah Ukuran Halaman Blog, Blogspot

Filled under:

Umumnya template default yang disediakan blogger, tidak memiliki lebar halaman yang penuh. Jika anda ingin memperlebar ataupun mempersempit halaman posting, sidebar, dll-nya anda tinggal edit kode HTML Silakan bisa anda praktekkan jika anda ingin memperlebar / mempersempit halaman :

  • Login ke blog anda Klik DISINI, silakan isi email dan password blog anda
  • Pilih ‘TATA LETAK’
  • Klik "Edit HTML"
  • Agar aman, silakan anda Download dulu template anda (klik Download Template Lengkap), Pada bagian atas
  • (gunakan Ctrl + F) Cari kode  Yang mirip dibawah ini :
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

#main-wrapper {
width: 410px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
  • Silakan edit keterangan ukuran dibawah ini, sesuaikan dengan keinginan anda :
#outer-wrapper --> kode untuk lebar halaman blog.
#main-wrapper --> kode untuk lebar postingan blog
#sidebar-wrapper --> kode untuk lebar sidebar blog.
  • Semoga Bermanfaat

Posted By RONI RUSMANA19.27

Cara Pasang Kotak Pencarian / Search pada Blog

Filled under:

otak Pencarian / Search ini mempunyai fungsi supaya pengunjung blog kita lebih mudah memperoleh artikel yang inign dibaca. Mereka hanya mengetikkan kata kunci (keyword) artikel yang dimaksud, dan hasilnya akan ditampilkan artikel-artikel dalam blog kita yang memuat kata kunci yang dicari. 

Kotak pencarian ini bisa anda letakkan dimana anda suka misalnya pada sidebar dan lainnya.
Contoh di bawah ini adalah kotak pencarian yang dimaksud :



Langkah-langkah memasang kotak pencarian  :
  1.  Login ke blog Anda
  2.  Pilih Layout/Tata Letak, Elemen Halaman, Add Gadget/Tambah Gadget
  3.  Pilih HTML/Javascript
  4.  Copy kode di bawah ini, dan paste ke dalam kotak yang disediakan !
  5. <form action="http://xxxxxxxxxxxx.blogspot.com/search" method="get"> <input class="textinput" name="q" size="25" type="text"/> <input value="search" class="buttonsubmit" name="submit" type="submit"/></form>
  6.  Ganti yang berwarna pink dengan alamat url blog anda !
  7.  Simpan!, Selesai

Posted By RONI RUSMANA19.25

Cara Merubah Cursor Blog Blogger

Filled under:

tutorial ini saya bagi menjadi 2, yaitu untuk blogger baru dan lama.

Tutorial Mudah Merubah Cursor Untuk Blogspot Baru

1. Klik Tata Letak
Cara Pasang Widget Jam Di Blogger (http://blog.ahmadrifai.net)

2. Klik Tambah Gadget / Add A Gadget
Panduan Pasang Widget Jam Di Blogger (http://blog.ahmadrifai.net)

3. Pilih Gadget Html/JavaScript
Tutorial Pasang Widget Jam Di Blogger (http://blog.ahmadrifai.net)
4. Masukkan kode nya yang sudah saya sertakan di bawah
5. Simpan

Tutorial Mudah Merubah Cursor Untuk Blogspot Lama

1. Klik Menu Rancangan / Design
Panduan Pasang Widget Jam / Clock Di Blogger
2. Klik Tambah Gadget / Add A Gadget
Panduan Pasang Widget Clock Di Blogger (http://blog.ahmadrifai.net)

3. Pilih Gadget Html/JavaScript
Tutorial Pasang Widget Clock Di Blogger (http://blog.ahmadrifai.net)
4. Masukkan kode yang sudah saya sertakan di bawah
5. Simpan

Kode Cursor Untuk Blogger Yang Harus Di Pasang

Silakan copy dan paste kode berikut:
<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghJGz1jbtxBuLAlGrb7GNsK7ukffGHm2pxTSpQ9FXTeCtY06Pej97MC4IQ31Sm7C_iLMttA2vFUe-xSGp5i_FsdQjoRDWT84599mX05jLUwtHBbcx03jl2nbBbSO2dhKUq7Ei4oW4WCjaW/s1600/jasablogsitus-web-id.gif"), auto;}
</style>
Catatan:
Silakan rubah tulisan yang saya beri warna Merah dengan url gambar cursor yang kamu suka.
Jika kamu menggunakan semua kode yang saya tuliskan di sini (tanpa mengganti bagian yang saya beri warna Merah) maka cursornya terlihat seperti ini
 
Update !!!
Agar corsornya berubah secara permanen walaupun diarahkan kelink silakan gunakan kode seperti ini:



<style type="text/css">
body{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghJGz1jbtxBuLAlGrb7GNsK7ukffGHm2pxTSpQ9FXTeCtY06Pej97MC4IQ31Sm7C_iLMttA2vFUe-xSGp5i_FsdQjoRDWT84599mX05jLUwtHBbcx03jl2nbBbSO2dhKUq7Ei4oW4WCjaW/s1600/jasablogsitus-web-id.gif"), auto;}
body a:hover{cursor: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghJGz1jbtxBuLAlGrb7GNsK7ukffGHm2pxTSpQ9FXTeCtY06Pej97MC4IQ31Sm7C_iLMttA2vFUe-xSGp5i_FsdQjoRDWT84599mX05jLUwtHBbcx03jl2nbBbSO2dhKUq7Ei4oW4WCjaW/s1600/jasablogsitus-web-id.gif"), auto;}
</style>

                                                
Catatan : Yang harus dirubah sama dengan yang sudah saya tuliskan di atas
Selamat mencoba, dan semoga ini bisa mempermudah teman dalam mengganti cursor blog bloggernya.
Jangan Lupa Klik Tombol Like dan Shareya ... :-)
sumber : http://blog.ahmadrifai.net

Posted By RONI RUSMANA19.19

CARA MEMBUAT TULISAN BERGERAK DI BLOG

Filled under:



kepingin buat tulisan seperti ini untuk memeprindah dan mempercantik postingannya atau di salah satu bagian halaman blog atau webnya?

TULISAN BOLAK BALIK KIRI KANANTULISAN KANAN KE KIRI

atau variasi lainnya?

Mudah kok sob tongkrongin aja tutorial ini, nih saya kasih script / kodenya.

Untuk Tulisan bolak balik kirikanan seperti diatas pakai ini :

<font face='Arial' color='#000000'><marquee behavior="alternate">TEXT</font></marquee>

Kanan Ke Kiri :
<font face='Arial' color='#000000'><marquee>TEXT</font></marquee>

Kiri Ke Kanan :
<font face='Arial' color='#000000'><marquee direction="right">TEXT</font></marquee>

Ke 
Atas :
<center><font face='Arial' color='#000000'><marquee direction="up">TEXT</font></marquee></center>

Ke Bawah :
<center><font face='Arial' color='#000000'><marquee direction="down">TEXT</font></marquee></center>

Ke Atas Bawah Atas Bawah :
<center><font face='Arial' color='#000000'><marquee direction="up" behavior="alternate">TEXT</font></marquee></center>

ZigZag :
<font face='Arial' color='#000000'><marquee behavior="alternate" direction="up" width="80%"><marquee direction="right">TEXT</font></marquee></marquee>

kiri kanan Zigzag :
<font face='Arial' color='#000000'><marquee behavior="alternate" direction="up" width="80%"><marquee direction="right" behavior="alternate">TEXT</font></marquee></marquee>



Catatan :
- Arial adalah Jenis huruf, bisa sob ganti dengan yang lain seperti time news roman, monotype corsive, dll
- TEXT bisa diganti dengan kata atau kalimat yang ingin kamu tulis warna dan bergerak tersebut.
- #000000 adalah contoh warna tulisan hitam, jika ingin mengganti silahkan pilih warna seperti yang saya sediakan di bawah. Misal untuk membuat tulisannya berwarna biru, #000000 diganti dengan kode #0000ff


pilihan warna :
-----------------
merah : ff0000kuning : ffff00hijau : 00cc00ungu : ff00ffbiru : 0000fforange : ff6600biru muda : 3399ffpink : ff66ff




Posted By RONI RUSMANA19.15

cara membuat widget melayang di blog

Filled under:

Cara membuat widget / gambar bergerak di pojok sangat mudah
Berikut Caranya :
  1. Login blog anda 
  2. Masuk ke rancangan
  3. Edit HTML jangan lupa centang expand template widget
  4. Cari kode ]]></b:skin>
  5. Lalu copy kode di bawah ini dan letakkan diatas kode ]]></b:skin>

#melayang {
position:fixed;_position:absolute;
bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
Tulisan yang berwarna merah dan tebal diatas itu adalah posisi widgetnyabottom adalah bawah jika ingin mnaruh diatas bisa kamu ganti dengan topLeft adalah kiri jika ingin mengganti di kanan bisa kamu ganting dengan right

Langkah selanjutnya taruh code dibawah ini yang merupakan widget sebelum Code </body>

<div id="melayang">
<a href="ISI NAMA BLOG KAMU"> <img src="ISI DENGAN WIDGET SESUKA ANDA"/>
</a>
</div>

Teks warna biru bisa anda ganti dengan link di bawah ini 



http://i548.photobucket.com/albums/ii321/ayasofia/MariposaanimadoT68i.gif


http://i548.photobucket.com/albums/ii321/ayasofia/cat_5.gif


http://i548.photobucket.com/albums/ii321/ayasofia/silahkan.gif


http://i548.photobucket.com/albums/ii321/ayasofia/DRUIDD.gif


http://i548.photobucket.com/albums/ii321/ayasofia/vf.gif
NARUTO Vs SASUKE
NARUTO Vs SASUKE http://i996.photobucket.com/albums/af83/uzumaki_sanras/naruto_vs_sasuke.gif
                                                                     
Naruto VS Sasuke




                                                                         http://i892.photobucket.com/albums/ac124/puppygirl277/naruto-vs-sasuke.gif

sumber : jackcrausher.blogspot.com

Posted By RONI RUSMANA19.11