Cara Merubah Warna Text Selection

Sebelum Di Rubah Warna Text Selection :

 

Sesudah Di Rubah Warna Text Selection :

Jika Kalian menyeleksi sebuat tulisan pada Postingan Blog Kalian, maka akan keluar warna Biru atau Putih, itu Default. Dan kali ini Saya akan memberikan cara menggantinya sesuai dengan warna yang Kalian inginkan.

Jika Kalian tertarik, ikuti langkah-langkah berikut :

[1]. Seperti biasa Login dulu ke Blog Kalian.

[2]. Trus cari Rancangan --> Edit HTML.

[3]. Trus cari Code "body {" (Tanpa Tanda Petik) Biar Gampang Mencarinya Tekan Saja (CTRL + F).

[4]. Kalo sudah Copy dan Paste-kan Code di bawah ini di atas Code yang tadi.

::-moz-selection { 

background: #CC3399;

color: #ffffff;}

NB :

- Kalian bisa mengganti Warna Text Highlight di atas (#CC3399), dengan Warna yang Kalian suka.

[5]. Simpan Dan Lihat Hasilnya.

Kalo Kalian dingung mencari Code Warna tidak usah kuatir, klik saja DI SINI.


Semoga Berhasil....!!! ^_^

Tips and Trick Blog

Daftar Kode Warna HTML Lengkap

#FFFFFF	#FFFFCC	#FFFF99	#FFFF66	#FFFF33	#FFFF00
#FFCCFF	#FFCCCC	#FFCC99	#FFCC66	#FFCC33	#FFCC00
#FF99FF	#FF99CC	#FF9999	#FF9966	#FF9933	#FF9900
#FF66FF	#FF66CC	#FF6699	#FF6666	#FF6633	#FF6600
#FF33FF	#FF33CC	#FF3399	#FF3366	#FF3333	#FF3300
#FF00FF	#FF00CC	#FF0099	#FF0066	#FF0033	#FF0000
#CCFFFF	#CCFFCC	#CCFF99	#CCFF66	#CCFF33	#CCFF00
#CCCCFF	#CCCCCC	#CCCC99	#CCCC66	#CCCC33	#CCCC00
#CC99FF	#CC99CC	#CC9999	#CC9966	#CC9933	#CC9900
#CC66FF	#CC66CC	#CC6699	#CC6666	#CC6633	#CC6600
#CC33FF	#CC33CC	#CC3399	#CC3366	#CC3333	#CC3300
#CC00FF	#CC00CC	#CC0099	#CC0066	#CC0033	#CC0000
#99FFFF	#99FFCC	#99FF99	#99FF66	#99FF33	#99FF00
#99CCFF	#99CCCC	#99CC99	#99CC66	#99CC33	#99CC00
#9999FF	#9999CC	#999999	#999966	#999933	#999900
#9966FF	#9966CC	#996699	#996666	#996633	#996600
#9933FF	#9933CC	#993399	#993366	#993333	#993300
#9900FF	#9900CC	#990099	#990066	#990033	#990000
#66FFFF	#66FFCC	#66FF99	#66FF66	#66FF33	#66FF00
#66CCFF	#66CCCC	#66CC99	#66CC66	#66CC33	#66CC00
#6699FF	#6699CC	#669999	#669966	#669933	#669900
#6666FF	#6666CC	#666699	#666666	#666633	#666600
#6633FF	#6633CC	#663399	#663366	#663333	#663300
#6600FF	#6600CC	#660099	#660066	#660033	#660000
#33FFFF	#33FFCC	#33FF99	#33FF66	#33FF33	#33FF00
#33CCFF	#33CCCC	#33CC99	#33CC66	#33CC33	#33CC00
#3399FF	#3399CC	#339999	#339966	#339933	#339900
#3366FF	#3366CC	#336699	#336666	#336633	#336600
#3333FF	#3333CC	#333399	#333366	#333333	#333300
#3300FF	#3300CC	#330099	#330066	#330033	#330000
#00FFFF	#00FFCC	#00FF99	#00FF66	#00FF33	#00FF00
#00CCFF	#00CCCC	#00CC99	#00CC66	#00CC33	#00CC00
#0099FF	#0099CC	#009999	#009966	#009933	#009900
#0066FF	#0066CC	#006699	#006666	#006633	#006600
#0033FF	#0033CC	#003399	#003366	#003333	#003300
#0000FF	#0000CC	#000099	#000066	#000033	#000000
#465584	#EEF2F7	#3A4F6C	#00D	#434951	#555
#777	#DFE6EF	#345487	#F5F9FD	#3860BB	#BCD0ED
#C2CFDF	#F0F5FA	#D1DCEB	#003	#900	#CCE9FD
#E4EAF2	#4C77B6	#DFE6EF	#EEF2F7

Semoga Bermanfaat Ya...!!!

Tips and Trick Blog

Cara Membuat Read More Di Blog V.01

Read More atau Baca Selanjutnya, adalah tombol yg sangat berguna apabila kita membuat Postingan yg lumayan panjang. Dan mungkin Kalian sudah mengetahuinya,  dan Saya memberikan Cara Membuatnya. OK langsung saja ke tutornya ya..

[1]. Seperti biasa Login dulu ke Blog Kalian.

[2]. Trus cari Setelan --> Format.

[3]. Cari tulisan "Template Entri" kan ada kotak kosong tuh.

[4]. Isikan kotak kosong tersebut dengan Script di bawah.

<span class="fullpost">

</span>

[5]. Lalu Simpan Setelan.

[6]. Trus coba Kalian buat sebuat Entri, lihat gambar di bawah.

 

[7]. Pasti ada menu seperti di gambarkan, cara kerjanya lihat pada gambar di bawah.

[8]. Selesai

Semoga Berhasil Ya...!!!!!

Tips and Trick Blog

Cara Menambahkan Kotak Komentar Menarik Di Blogger

Bagaimana cara membuat DISQUS COMMENTS di blogger ?, simak terus lanjutannya.

[1]. Buka http://disqus.com/, pilih Sign Up untuk mulai mendaftar.

[2]. Pada halaman selanjutnya isikan informasi tentang Blog dan Profile Kalian, pilih Continue untuk melanjutkan ke step selanjutnya. lihat gambar di bawah...

[3]. Lanjut ke stepp ke 2... Select bahasa yang kalian suka, lalu continue,... lihat gambar di bawah.....

 

[4]. Pada steep ke 3, pilih Blog,... lihat gambar di bawah.

[5]. Lanjut Ke steep ke 4, klik tulisan "Add side 'blog rakasa' to Blogg".... lihat gambar di bawah....

[6]. Kemudian akan masuk ke http://www.blogger.com/add-widget, klik " MENAMBAHKAN WIDGED", lihat gambar di bawah....

[7]. Selesai,....

Semoga Berhasil Yaw...!!!

DOWNLOAD ARTIKEL :

1. Ms. Office Word 2003
2. Ms. Office Word 2007

Tips and Trick Blog

Cara Membuat Effect Bubble Cursor Pada Blog

Tips kali ini, kita akan membahas tentang Effect pada kursor. Ada banyak sekali Effect kursor untuk Blog, tapi Saya memberikan yang Effect Bubblenya. Nah jika Kalian tertarik dengan Tips kali ini, silahkan ikuti langkah-langkah berikut ini :

[1]. Login dulu ke Blog Kalian.

[2]. Trus cari Rancangan --> Tambahkan Gadget --> HTML/javascript.
[3]. Copy Code Bubble Cursor di bawah, kemudian Paste-kan di dalamnya

<script type="text/javascript" src="http://jmk-js.googlecode.com/files/Bubble%20Kursor%20JmK.js"></script><script type="text/javascript">

// <![CDATA[

var colours=new Array("#0066FF", "#0066FF", "#0066FF", "#0066FF", "#0066FF"); // colours for top, right, bottom and left borders and background of bubbles
var bubbles=100; // maximum number of bubbles on screen


var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var bubb=new Array();
var bubbx=new Array();
var bubby=new Array();
var bubbs=new Array();
window.onload=function() { if (document.getElementById) {
var rats, div;
for (var i=0; i<bubbles; i++) {
rats=createDiv("3px", "3px");
rats.style.visibility="hidden";
div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="1px";
div.left="0px";
div.bottom="1px";
div.right="0px";
div.borderLeft="1px solid "+colours[3];
div.borderRight="1px solid "+colours[1];
div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="0px";
div.left="1px";
div.right="1px";
div.bottom="0px"
div.borderTop="1px solid "+colours[0];
div.borderBottom="1px solid "+colours[2];
div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.left="1px";
div.right="1px";
div.bottom="1px";
div.top="1px";
div.backgroundColor=colours[4];
div.opacity=0.5;
if (document.all) div.filter="alpha(opacity=50)";
document.body.appendChild(rats);
bubb[i]=rats.style;
}
set_scroll();
set_width();
bubble();
}}
function bubble() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<bubbles; c++) if (!bubby[c]) {
bubb[c].left=(bubbx[c]=x)+"px";
bubb[c].top=(bubby[c]=y)+"px";
bubb[c].width="3px";
bubb[c].height="3px"
bubb[c].visibility="visible";
bubbs[c]=3;
break;
}
}
for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
setTimeout("bubble()", 40);
}
function update_bubb(i) {
if (bubby[i]) {
bubby[i]-=bubbs[i]/2+i%2;
bubbx[i]+=(i%5-2)/5;
if (bubby[i]>sdown && bubbx[i]>0) {
if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
bubb[i].width=bubbs[i]+"px";
bubb[i].height=bubbs[i]+"px";
}
bubb[i].top=bubby[i]+"px";
bubb[i].left=bubbx[i]+"px";
}
else {
bubb[i].visibility="hidden";
bubby[i]=0;
return;
}
}
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sleft;
x=(e)?e.pageX:event.x+sdown; }
window.onresize=set_width;
function set_width() {
if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (typeof(self.innerHeight)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
else {
swide=800;
shigh=600;
}
}
window.onscroll=set_scroll;
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
return (div);
}
// ]]>
</script>

[4]. Save dan Lihat Hasilnya.

NB :
- Code yang berwarna Biru, menunjukan Warna Bubblenya, Kalian bisa menggantinya dengan warna yang Kalian suka.
- Dan kalau Kalian bingung mencari Code Warna, tidak usah kawatir klik saja DI SINI.

Semoga Berhasil...!!!

DOWNLOAD ARTIKEL :

1. Ms. Office Word 2003
2. Ms. Office Word 2007
3. Download Script/Code

Tips and Trick Blog

Cara Menambahkant Efek Meteor Jatuh Di Blog

Efeect meteor, hemm Tips kali sangat unik bukan...??? kalau Kalian penasaran dengan Tips kali ini, kalau penasaran, kita langsung masuk ke langkah-langkahnya. Silahkan ikuti langkah-langkah di bawah.

[1]. Seperti biasa Login dulu ke Blog Kalian.

[2]. Trus cari Rancangan --> Add Widget --> HTML/JavaScript.

[3]. Lalu Copy dan Paste-kan Code di bawah ini.

<script language="javascript">
nd_mode="meteor";
nd_sound="on";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_top";
</script>
<script language="javascript" src="http://jmk-js.googlecode.com/files/Meteor%20JmK.js">
</script>

[4]. Terakhir Simpan.

Dan lihat hasilnya Blog Kalian di timpa Meteor Jatuh, Hehehe...

Satu Lagi Untuk Meng-Off-kan Efect itu Klik saja di Bawah Pojok Kanan Blog Kalian....

Semoga Berhasil...!!!

DOWNLOAD ARTIKEL :

1. Ms. Office Word 2003
2. Ms. Office Word 2007
3. Download Script

Tips and Trick Blog

Cara Membuat Navbar Blog Auto Hide

Menyembunyikan Navbar pada Blog, apa itu navbar..???, Navbar adalah bagian yang terlihat pada bagian teratas Blog Kalian. Yang mana pada bagian tersebut terdapat tulisan Posting Baru, Kostumisasi, dan Keluar. Seperti pada judul postingan kali ini, Saya akan memberikan Cara Menyembunyikan Navbar Blog (Auto Hiden Navbar). OK langsung saja, berikut langkah-langkahnya :

[1]. Seperti biasa Login dulu ke Blog Kalian.

[2]. Trus cari Rancangan --> Edit HTML.

[3]. Cari Kode body { (Tanpa Tanda Petik).

[4]. Trus Copy Code dibawah ini.

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

[5]. Pastekan Code yang tadi di Copy di ATAS Code body {.

[6]. Terahir tinggal SAVE.

Sekarang coba arahkan Cursor Mose ke atas tempat Navbar, dan lihat hasilnya...

Semoga Berhasil...!!!

Tips and Trick Blog