0 Cara membuat border kotak area tulisan pada posting

Kreativitas - Sebuah kotak tulisan di posting sangat banyak di gunakan oleh blogger. Terutama untuk tampilan yang bagus agar pengunjung tidak bosan mengunjungi blog kita. Tidak usah bosa-basi langsung aja ke TKP :D
Lihat tulisan dalam kotak area di bawah ini:

TULISAN ANDA

Terkadang dalam posting kita memerlukan kotak seperti di atas untuk memperjelas atau memfokuskan pembaca pada suatu teks yang kita buat. Pernahkah terlintas dalam benak anda untuk membuatnya? Bagaimana cara membuat teks berkotak seperti area di atas ikuti cara berikut:

1. Buka account Blogger anda

2. Buat entri baru, dan pilih Edit HTML.

3. Masukan kode berikut :

<div style="border-bottom: #6c7a7d 1px inset; border-left: #6c7a7d 1px inset; border-right: #6c7a7d 1px inset; border-top: #6c7a7d 1px inset; margin-left: 20px; margin-right: 70px; padding-left: 30px; padding-right: 30px;"> <span style="color: red;">TULISAN ANDA</span></div>

Lalu klik Compose,

Jika langkah anda benar maka hasilnya akan seperti ini:

TULISAN ANDA

Untuk mengedit sesuka anda, keterangannya sebagai berikut :

border-right = garis pinggir kotak sebelah kanan.
border-left = garis pinggir kotak sebelah kiri.
border-top = garis pinggir kotak sebelah atas.
border-bottom = garis pinggir kotak sebelah bawah.
#6c7a7d; #ff0000 = kode warna, rubah sesuai keinginan. Untuk kode warnanya lihat di sini.
1px inset = ketebalan garis pinggir kotak, rubah sesuai keinginan.
padding-right = jarak tulisan dengan garis pinggir kotak sebelah kanan.
padding-left = jarak tulisan dengan garis pinggir kotak sebelah kiri.
margin-right = jarak kotak dengan pinggir posting sebelah kanan.
margin-left = jarak kotak dengan pinggir posting sebelah kiri.
20px; 30px; 70px = satuan jarak, rubah sesuai keinginan.

Sekian info dari saya dan semoga artikel ini bermanfaat bagi sobat..........!!!

0 Cara Membuat Spoiler / Tombol Hide Show Pada Postingan Blog

Kreativitas - Hallo Sobat Blogger dalam postingan kali saya akan membagi sedikit ilmu tentang bagaimana cara membuat spoiler / tombol hide show. Sebenarnya cara ini sudah banyak yang tau namun saya masih mempostingnya karna pasti masih ada teman² kita yang belum bisa membuatnya. Kita sering lihat di forum-forum seperti www.kaskus.us , mereka menggunakan spoiler untuk menyembunyikan gambar/teks/video dll untuk menghemat space. Spoiler ternyata bisa juga diterapkan di blog. Cara membuat spoiler di postingan blog sangat mudah. Ok langsung aja ke tkp :D

1. Buka account Blogger anda
2. Buat entri baru, dan pilih Edit HTML.


 3. Masukan kode berikut

<div>
<div style="margin-bottom: 2px;">
<input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 60px;" type="button" value="Show" /></div>
<div style="border: 0px inset; margin: 0px; padding: 6px;">
<div style="border: 1px dotted #ffffff; display: none;">
Isi Text Anda Disini </div>
</div>
</div>

Lalu klik Compose,


Jika langkah anda benar maka hasilnya akan seperti ini:

Isi Text Anda Disini

Sekian info dari saya dan semoga artikel ini bermanfaat bagi sobat..........!!!

0 Cara Membuat SMS Gratis Pada Blog

Kreativitas - Di kesempatan ini saya akan membagi info kepada sobat yaitu Cara Membuat Sms Gratis Pada Blog. Layanan SMS gratis ini, tidak hanya dapat mengirim pesan singkat ke operator seluler tertentu misalnya Telkomsel, Exis, XL, IM3 dan operator seluler yang lain akan tapi dapat mengirim pesan singkat ke semua Operator Seluler. Pengunjung dapat mengirim SMS ke nomor tujuan mereka hingga 100 SMS. Free sending Short Message Service ini di buat oleh Nix SMS.Widget SMS gratis ini menampilkan Advertisment atau Iklan dari Google. Sobat blogger tidak mungkin tidak tau iklan milik Google ini. Tidak lain dan tidak bukan, iklan Google Adsense.

Cara Memasang Widget SMS Gratis di blog :

• Masuk ke akun Blogger sobat
• Di menu drop down, klik layout/Tata letak --> Add a Gadget dan HTML/JavaScript
• Paste kode berikut di dalam kolom yang tersedia :
<iframe 0"="" height="260&quot; frameborder=" scrolling="auto" src="http://www.freesmsvoip.com/index.php?do=widget" width="475"></iframe>

• Lalu simpan

Tambahan :

1. width="270" adalah ukuran lebar widget, silahkan sobat blogger sesuaikan.
2. height="350" adalah ukuran tinggi widget, rubah saja sesuai selera.
3. frameborder="0" adalah ukuran ketebalan bingkai, seperti di atas, atur juga sesuai keinginan sobat blogger.
4. Widget SMS gratis tidak hanya bias di sidebar blog, akan tetapi dapat juga di pasang di area postingan.

Hasil dari Widget SMS Gratis

Sekian info dari saya dan semoga artikel ini bermanfaat bagi sobat..........!!!

0 Cara Membuat Blog

Kreativitas - Salah satu penyedia blog gratis yang cukup populer saat ini adalah blogspot atau blogger, dimana ketika mendaptar adalah melalui situs blogger.com namun nama domain yang akan sobat dapatkan adalah sub domain dari blogspot, contoh : contohsaja.blogspot.com
Kenapa harus membuat blog di blogger.com bukan pada situs penyedia blog lainnya? Sebenarnya tidak ada keharusan untuk membuat blog di blogger, namun ada banyak kelebihan yang dimiliki blogger di banding dengan penyedia blog lain. Beberapa contoh kelebihan blogger di banding yang lain yaitu mudah dalam pengoperasian sehingga cocok untuk pemula, lebih leluasa dalam mengganti serta mengedit template sehingga tampilan blog sobat akan lebih fresh karena hasil kreasi sendiri, custom domain atau sobat dapat mengubah nama blog sobat dengan nama domain sendiri misalkan contohsaja.blogspot.com di ubah menjadi contohsaja.com, sedangkan hosting tetap menggunakan blogspot dan masih tetap gratis. Perlu ditekankan dari awal bahwa internet itu sifatnya sangat dinamis, sehingga mungkin saja dalam beberapa waktu kedepan panduan membuat blog di blogger ini akan sedikit berbeda dengan apa yang sobat lihat di blogger.com

Untuk mengurangi hal yang tidak perlu di tulis, berikut Cara Membuat Blog

Membuat Email

Salah satu syarat yang harus dipenuhi dalam membuat blog adalah sobat memiliki alamat email yang masih aktif atau di gunakan. Jika anda belum mempunyai alamat email, silahkan daftar terlebih dahulu di yahoo/gmail.

Daftar Blog di blogger

1. Silahkan kunjungi situs http://www.blogger.com
2. Setelah halaman pendaftaran terbuka, alihkan perhatian ke sebelah kanan bawah, ubah bahasa ke Indonesia agar lebih mudah difahami.
   
3. Silahkan langsung masuk/login dengan menggunakan username/nama pengguna serta password/sandi gmail sobat ( akun email sobat bisa untuk login ke blogger).
   
   
   
   
4. Isilah formulir yang ada :
   1. Nama tampilan : isi dengan nama yang ingin tampil pada profile blog sobat.
   2. Jenis Kelamin : pilih sesuai dengan jenis kelamin sobat, misal : pria.
   3. Penerimaan Persyaratan : Beri tada ceklis sebagai tanda sobat setuju dengan peraturan yangtelah di tetapkan oleh pihak blogger. Saran: sebaiknya sobat membaca terlebih dahulu persyaratan yang ada agar sobat tahu dan mengerti apa yang boleh dan tidak diperbolehkan ketika menggunakan layanan blogger.
   4. Klik tanda panah bertuliskan “Lanjutkan”.
      
      
5. Klik tombol “Blog Baru”.
   
   
   
   
6. Isilah formulir :
   1. Judul : Isi dengan judul blog yang di inginkan, misal : Coretan sang penghayal
   2. Alamat : isi dengan alamat blog yang di inginkan. Ingat! Alamat ini tidak dapat di edit kembali setelah dibuat, apabila sobat ingin serius, maka pilihlah nama yang benar-benar sobat inginkan.
   3. Template : pilih template (tampilan blog) yang disukai (ini dapat ganti kembali).
   4. Lanjutkan dengan klik tombol “Buat blog!”.
      
      
      
      
   5. Sampai disini blog sobat telah berhasil di buat.
7. Untuk menghindari spam filter, sebaiknya sobat langsung posting sembarang saja. Klik tulisan “Mulai mengeposkan”.
   
   
   
   
8. Isi judul serta artikel. Akhiri dengan klik tombol “Publikasikan”.
   
   
   
   
9. Silahkan lihat blog sobat dengan klik tombol “Lihat Blog”
10. Selesai.

Kini blog sobat telah tercipta dan dapat di buka di berbagai belahan dunia. Umumkan pada teman-teman sobat bahwa sobat kini telah mempunyai blog.

Sekian info dari saya dan semoga artikel ini bermanfaat bagi sobat..........!!!

0 Free SMS

Kreativitas - Silahkan mencoba SMS Gratis di bawah ini sepuasnya.......!!! :)

0 Cara Membuat Animasi Twitter Terbang Di Blog

Kreativitas - Membuat Burung Twitter Terbang di Blog-Salah satu hal yang tidak kalah penting adalah memasang variasi-variasi pada blog agar blog kelihatan lebih menarik, jika tampilan blog hanya itu-itu saja pengunjung akan jenuh dan sobat akan beresiko kehilangan"pelangggan" blog sobat. Disini saya akan berbagi tips dengan sekian banyak tips yang telah saya bagikan untuk memperindah tampilan blog sobat. Membuat burung twitter beterbangan di blog, tentu saja sobat sering ketika blogwalking ke blog-blog lain sobat melihat burung twitter beterbangan di blog, tinggal ikuti saja langkah singkat dibawah ini untuk menjadikan burung twitter sobat menjadi milik sobat. Ok langsung aja :


1. Login ke akun blogger sobat
2. Kemudian pilih"Opsi Lainya">>Tata Letak>>Tambah Gadget>>HTML/JavaScript
3. Masukkan kode dibawah ini kedalamnya

<!-- floating twitter Bird -->
<script type="text/javascript" src="http://misbahudin-dcaesga.googlecode.com/files/twitter-terbang.js"></script>
<script type="text/javascript">
var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguUuPUFPQQWqUO76mwYOdsBS5W19tu78_YZjrrG4omERvH3jzD5FWOyF1AfebcnFj6IOVcuRb1IrLzth-ut0D5L4GCDdiO-GzcxP-KStj4C-PV6ld3lfz7Al3_V6l0cKfE1ZV0L9A5SuU/s1600/cyan+bird.png";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3",
"h4","p","code","object","a","b","strong","span");
var twitterAccount = "https://twitter.com/#!/ViieCravenvill";
var tweetThisText = "Twitter - UserID http://zyrexart.blogspot.com/";
tripleflapInit();
</script>

Ganti yang berwarna merah dengan ID Twitter sobat,dan untuk yang berwarna biru ganti dengan URL blog sobat.
4. Kalo sudah jangan lupa di"Save"ya sob.
 NB: Kode yang berwarna hijau adalah warna burung twitter sobat. Kalo sobat pengen ganti dengan warna yang lain silakan ganti dengan URL gambar dibawah ini :

Burung Twitter Biru Muda

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguUuPUFPQQWqUO76mwYOdsBS5W19tu78_YZjrrG4omERvH3jzD5FWOyF1AfebcnFj6IOVcuRb1IrLzth-ut0D5L4GCDdiO-GzcxP-KStj4C-PV6ld3lfz7Al3_V6l0cKfE1ZV0L9A5SuU/s1600/cyan+bird.png

 Burung Twitter  ungu

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhl7K339vSlvUU2vsoJPMa1NuoOs338Qc2SLpXGTGBJI8KU0MZUhNJHXug189u442pV8XMBC_4fIOVwwuwJUwDhABrwGCo0OFD_YGOlrqmi_NSZUzIJOT_unYJZ63FR1_RPz0voY7spPRA/s1600/purple+bird.png

Burung Twitter merah

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY0zxSs_HJH9TsVN9EOlIgGSrNnthsE3nUNcBUG5eCmJ2aNjdJ5ujdAJufeT0ZNAepKqGP9EciTgk7DkfLY2Hg-3E97PYMx9s2qIGkI1RUoUDxutYjMBl-UGEWFHBZkVixr2EUcOMYlh8/s1600/red+bird.png

Burung Twitter kuning

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhx0YpBeJTFA-Fvq0z9gjsEhCaPUwJrqZoRVdvBM0eHvU1CHhrs-2fAfghOIAHsy5peh1kIm6Z3BSU-GotLrISzJjyOdetfsFSlnoZ9veJtmjtZP4dwajPVopqUHy_QmtLEb57R6y5_JYA/s1600/yellow+bird.png

Burung Twitter hijau

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYM8kwFOsBxzB7QAAeOkrVAozTlrb-gp6KYwj1gR-iwLNIGKOXXBXWPl781XabT0V4_Ik8lqGBUGo-fE-ygDPq_9wZpO0h_Vcb8vVc37H8Ykaau2MQ4D2M-SKhca403rTDm0BU29cbCyM/s1600/Green+bird.png

Sobat juga bisa mengganti Animasi Twitter lainnya seperti yang ada di bawah ini

1. Stickman Twitter
   
   
   Gunakan Kode :
   https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEHuLXppRXcqipovtHeCwfHssxQK-4LqnmRoloDtXDnuOvNrLqgZ_DtiUdkYx8EWxLkkswQfSPeVfJsJdyvaIUbGW5N6pSllm6ygV6YcjibWsx7Z4crTheS6ndjneJljCAMX13AlkAMT8/s1600/birdsprite_MonozCore_Stickman.png
2. Star Scream Twitter
   
   
   Gunakan Kode :
   https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6fil9k3FFhnvEyfKa2WeitdWraEswR8kYiPbfR08n8oSeO53QOYE5861QKqNZ0JloNTdQ-GQN8cKpCG4L1OTKMWo-3GFQe2a2OBwtfitwwkyevku-cy9kbgFh96t_uvjqLv0b0GZM6_o/s1600/StarScream.png
3. Bat Twitter
   
   
   Gunakan Kode :
   https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJRz4zU95TTtMM7CMcIn4cK9a4JOx51Hg_HdXzz2GjYyV6kBVJ3HEukDtX5kIh_hSokvG2AdJ6FkrIlbNeQzxIsLnuRc8p2SygFkHjokKIAj1SUpJ6stZTik-tb2AkA66XNsTw0bq5w8c/s800/MonozCore.blogspot.com_BatTwitter.png
4. SantaBird Twitter
   
   
   Gunakan Kode :
   https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxfG0Sy0JcmsEhGMHGdqyuw0jZ66pr0hsHwlodSBaOUQBAG84axi1I683OjaxftwuglYXueSo8Q29L_GMloejbENELvMFKIyP17CV-ui05TyTgFDxez9z-a1KmbbM8uKfKLmB6AWFdEBQ/s800/MonozCore.blogspot.com_SantaBirdTwitter.png
5. Dragon Twitter
   
   
   Gunakan Kode :
   https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgee-b7q_sv02Y7kmj5HS5vlp3nuhzo7B1WiZa0xjox1niTmS64CbZGgPVPyoK4JGYHzEARld3qYw6vZx3-OBUaxEraYk6rbNT5GR4_EMdsJ0mw4ly9P_MW_GiUx0SRswsUq902wXM8AcY/s800/MonozCore.blogspot.com_Dragon_Twitter.png
6. DBZ Twitter
   
   
   Gunakan Kode :
   https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5BqXez8vafsA7qA3sRi651m071wPnBv8AvjtstmJNf0PW_8MLYATM7LZwRtRZf4T6WWQlujZ_On8zXJ1yXuPqKkuw0PZ23OPr2BRcyelFIoUtMS7fL2qjaMXRC_V5vayf0XB5-K5wLUM/s800/MonozCore.blogspot.com_DBZ_Twitter.png
7. Dracula Twitter
   
   
   Gunakan Kode :
   https://lh6.googleusercontent.com/-FPaxJ9tqw5s/Tv8FNwjXEoI/AAAAAAAAAsM/Dl163KLaang/s800/Drakula.png

Sekian info dari saya dan semoga artikel ini bermanfaat bagi sobat..........!!!

0 Cara Membuat Efek Gelembung Pada Cursor Blog

Kreativitas - Selamat Siang, Cuaca yang sangat panas ini saya sempatkan berbagi trick blog. yang mana kali ini saya akan sharing tutorial membuat cursor di ikuti gelembung-gelembung.
Nah, mungkin bagi anda yang penasaran dengan trick satu ini silahkan di cobain sob.... Effek Bubble Kursor adalah bila kita menggerakkan mouse pada halaman blog kita maka akan keluar dari Kursor beberapa gelembung, yang tadinya kecil hingga membesar. Dan makin sering kita menggerakan Kursor makin banyak gelembungan (bubble) yang berterbangan di halaman blog kita. OK. Kalau sobat berminat dan ingin memasangnya di blog masing-masing silahkan ikuti langkah-langkah berikut.

1. Seperti biasa Login ke Blogger sobat
2. Pada halaman Dasbor klik Rancangan
3. Pada Halaman Elemen Laman klik Tambah Gadget / add a gadget.
4. Pilih yang HTML/Javascript.
5. Copy dan Paste Kode Bubble Gelembung Cursor Efeck di bawah ini di kotak HTML/Javascript.

<noscript></noscript><!-- --><script type="text/javascript" src="http://www.freewebs.com/p.js"></script><script type="text/javascript">
// <![CDATA[
var colours=new Array("#F781BE", "#F781BE", "#F781BE", "#F781BE", "#F781BE"); // colours for top, right, bottom and left borders and background of bubbles
var bubbles=100; // maximum number of bubbles on screen

/****************************
* JavaScript Bubble Cursor *
* (c) 2010 mf2fm web-design *
* http://amminessalafy.blogspot.com *
* DON'T EDIT BELOW THIS BOX *
****************************/
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>

Kode yang berwarna merah adalah warna Bubble silahkan sobat ganti dengan warna kesukaan sobat, untuk bantuan kode warna silahkan klik disini.
Kode yang berwarna kuning adalah jumlah Bubble yang akan kita pasang. Sobat boleh menggantinya mau seberapa banyak Bubble yang akan di tampilkan
6.  Setelah semua langkah langkah selesai. Klik tombol SIMPAN, dan lihat hasilnya.

Sekian info dari saya dan semoga artikel ini bermanfaat bagi sobat..........!!!
 

0 TV Online