Istilah-istilah Internet Istilah-istilah Internet

 Kata-kata istilah barasal dari kata-kata yang terserap dari bahasa asing, dan telah digunakan menjadi istilah internet indonesia karena kemajuan terknologi internet. istilah internet kebanyakan berasal dari inggris amerika, karena mereka memiliki kosakata internet yang paling luas.

Istilah-istilah internet kadang jika di artikan ke bahasa indonesia terasa janggal tidak memiliki hubungan seperti contohnya cookie yang artinya roti jika di terjemahkan. di bawah ini adalah istilah internet yang mungkin perlu untuk anda ketahui :

• Dial-up :  Jenis Koneksi Internet yang menggunakan jaringan telephone
• Dial-up Networking : Fasilitas network yang di miliki oleh oleh sistem oprasi microsoft.
• Banner : Media informasi yang berbentuk gambar biasanya untuk menampilkan iklan bergambar pada sebuah halaman web
• Chat : adalah sebuah fasilitas untuk mengirim dan menerima pesan berbentuk tulisan secara realtime
• Chatting : Istilah yang di gunakan saat melakukan interaksi dengan fasilitas chat
• Download :  adalah sebuah proses transfer atau pengambilan data dari internet yang di simpan ke komputer
• E-Commerce : adalah istilah yang di pakai untuk perdagangan atau transaksi perbankan di internet.
• Domain Name : Nama khusus untuk menandakan sebuah alamat web di internet.
• E-Mail : Sebuah fasilitas untuk mengirimkan pesan/menerima pesan dalam bentuk tulisan berbeda dengan chat e-mail tidak secara realtime
• FTP : File transfer protocol adalah protokol (antarmuka) yang digunakan untuk men-transfer, mengirim atau menerima file dari internet.
• Hacker : adalah orang ahli di bidang komputer, internet pada khususnya, dengan keahliannya hacker dapat menembus, merusak, serta melakukan hal-hal yang tidak diinginkan dalam suatu jaringan komputer (termasuk internet). Misalnya merusak website yang ada, merusak program yang telah di buat oleh webmaster, atau administrator.
• Homepage : adalah halaman depan atau halaman utama yang ditampilkan dari sebuah website di internet
• HTML : Hyper Text Markup Language, yaitu bahasa yang digunakan untuk membuat tampilan dalam bahasa program
•  Http://   : http atau kepanjangannya Hyper Text Transfer Protocol adalah kode yang dituliskan pada awal site, untuk menjelaskan pada program web browser bahwa protokol (antarmuka) yang digunakan adalah http
• Login : otorisasi yang dilakukan oleh seorang user untuk masuk ke halaman pribadi dengan memasukkan username dan password di dalam sebuah jaringan komputer (termasuk internet).
• Logoff : keluar dari sebuah sebuah halaman pribadi di jaringan komputer (termasuk internet)
• Password : kode rahasia yang digunakan oleh pengguna untuk dapat mengotorisasikan username yang dia miliki untuk dapat memasuki sebuah halaman pribadi di jaringan komputer (termasuk internet)
• Search Engine : sebuah fasilitas di internet (website tertentu) yang digunakan untuk mencari informasi tertentu yang di perlukan pengguna.
• Upload :  proses pengiriman atau transfer data dari komputer yang dipakai oleh user ke sebuah situs web di internet.
• User : pemakai atau pengguna dalam komputer (termasuk internet).
• Virus : adalah program tersembunyi yang dapat menumpang pada program lain yang terdapat pada internet, atau pada e-mail, yang sangat merugikan pengguna dimana program tersebut dapat merusak program lainnya di komputer ataupun website.
• Web browser : program komputer yang digunakan sebagai media untuk berselancar di internet
• Web page : adalah halaman yang dapat ditampilkan website di internet, yang dapat menampilkan berupa teks, gambar, bahkan suara, animasi dan video dll.

Istilah di atas hanyalah sebagian kecil istilah yang perlu di ketahui. Jika berselancar di internet sebaiknya memahami istilah internet agar tidak bingung dengan istilah-stilah tersebut.

Semoga ini bisa membantu sekian artikel tentang istilah-istilah internet .

belajar linux "mandiri" dengan Mudah belajar linux "mandiri" dengan Mudah

bagi agan" yang ingin belajar linux....
download file pdf nya disini

pengguna komputer di indonesia saat ini kebanyakan menggunakan sistem operasi buatan dari microsoft, yaitu microsoft windows. hal itu wajar saja terjadi, karena sistem operasi windows lebih dulu hadir di Indonesia ketimbang sistem operasi linux. mungkin anda semua yang telah mengerti tentang komputer, sudah memahami bahwa sistem operasi windows bukanlah software yang bebas disebarluaskan, anda harus mengeluarkan biaya lisensi untuk bisa menginstal secara legal di komputer anda, tapi jika anda tidak mengeluarkan biaya lisensi, berarti bisa dikatakan windows yang anda gunakan adalah bajakan.

pada artikel ini membahas tentang pengertian linux. pengerian linux adalah software sistem operasi open source yang gratis untuk disebarluaskan di bawah lisensi GNU. jadi anda diijinkan untuk menginstal pada komputer anda ataupun mengkopi dan menyebarluaskannya tanpa harus membayar. linux merupakan turunan dari unix dan dapat bekerja pada berbagai macam perangkat keras koputer mulai dari inter x86 sampai dengan RISC. Dengan lisensi GNU (Gnu Not Unix) Anda dapat memperoleh program, lengkap dengan kode sumbernya (source code). Tidak hanya itu, Anda diberikan hak untuk mengkopi sebanyak Anda mau, atau bahkan mengubah kode sumbernya.Dan itu semua legal dibawah lisensi. Meskipun gratis, lisensi GNU memperbolehkan pihak yang ingin menarik biaya untuk penggandaan maupun pengiriman program.

Kebebasan yang paling penting dari Linux, terutama bagi programmer dan administrator jaringan, adalah kebebasan untuk memperoleh kode sumber (source code) dan kebebasan untuk mengubahnya. Ini berimplikasi pada beberapa hal penting. Pertama keamanan, yang kedua dinamika.

Jika perangkat lunak komersial tidak memperkenankan Anda untuk mengetahui kode sumbenya maka Anda tidak akan pernah tahu apakah program yang Anda beli dari mereka itu aman atau tidak (sering disebut security by obscurity). Hidup Anda di tangan para vendor. Dan jika ada pemberitahuan tentang bug dari perangkat lunak komersial tersebut, seringkali sudah terlambat. Dengan Linux, Anda dapat meneliti kode sumbernya langsung, bersama dengan pengguna Linux lainnya. Berkembangnya pengguna Linux sebagai komunitas yang terbuka, membuat bug akan cepat diketahui, dan secepat itu pula para programmer akan memperbaiki programnya. Anda sendiri juga yang menentukan kode yang cocok sesuai dengan perangkat keras maupun kebutuhan dasar perangkat lunak lainnya untuk dapat diimplementasikan. Ibarat sebuah mobil, Anda bisa memodifikasi sesukanya, bahkan hingga mesin sekalipun, untuk memperoleh bentuk yang diinginkan.

Keterbukaan kode sumber juga memungkinkan sistem operasi berkembang dengan pesat. Jika sebuah program dengan sistem tertutup dan hanya dikembangkan oleh vendor tertentu, paling banyak sekitar seribu hingga lima ribu orang. Sedangkan Linux, dengan keterbukaan kode sumbernya, dikembangkan oleh sukarelawan seluruh dunia. Bug lebih cepat diketahui dan program penambalnya (patch) lebih cepat tersedia. Pendekatan pengembangan sistem operasi ini disebut Bazaar. Kebalikannya sistem Chatedraal sangat tertutup dan hanya berpusat pada satu atau dua pengembang saja.

linux saat ini telah berkembang menjadi banyak distro (distribusi linux), misalnya adalah distro Redhat, Debian, Suse. saat ini distro linux yang sangat populer di gunakan di indonesia adalah distro Ubuntu yang merupakan turunan dari Debian.

Di bawah ini merupakan tampilan antarmuka desktop linux ubuntu

tampilan antar muka desktop linux ubuntu

Cara memasang gambar animasi lucu di pojok blog (widget animasi blog gratis) Cara memasang gambar animasi lucu di pojok blog (widget animasi blog gratis)

Cara menampilkan gambar animasi di pojok blog. Terkadang untuk menghias blog agar tampak lebih menarik maka bisa memasang gambar animasi di blog.Bisa ditempatkan di pojok atas (kiri dan kanan), pojok bawah kiri dan kanan, atau semua pojok diisi gambar lucu-lucu.


Untuk menampilkan gambar lucu, cukup copy salah satu script html di bawah ini kemudian masukkan ke dalam gadget html. Script ini saya buat menggunakankode html ditambah gambar dari situs sweetim.

yang mau buat animasi widged...

yuk ke sini

Buat Logo & Image Button Buat Logo & Image Button

untuk membuat logo kita bisa memakai jasa situs di internet, salah satunya yaitu cooltext.com, Silahkan ikuti langkah-langkah berikut ini : 

1. Silahkan buka alamat http://cooltext.com 
2. Lalu klik tulisan Design a Logo 
3. Klik gambar contoh logo yang sobat sukai 
4. Tulis tulisan yang ingin di jadikan logo di sampimg tulisan Logo Text. Misal : Blog Tutorial 
5. Tulis ukuran yang di inginkan di samping Tulisan Text Size. Misal : 50 
6. Klik logo warna-warni disamping kotak yang ada tulisan Text Color untuk memilih warna tulisan (text).silahkan pilih warna yg sobat sukai 
7. Pilih format image disamping tulisan file format. sebaiknya .JPG atau .GIF 
8. Klik tombol yang bertuliskan Render Logo Design 
9. Tunggu beberapa saat ketika proses pembuatan logo berlangsung 
10. Lihat hasil logo, sudah cocok apa belum? bila belum cocok, klik tulisan Edit this logo ulangi langkah diatas, rubah yang sobat inginkan. Jika sudah cocok, klik tulisan Download Image untuk kita simpan di PC kita 
11. Selesai. Sobat sudah mempunyai sebuah logo.

Agar logo yang kita buat tadi bisa tampil di blog, sobat harus upload gambar tersebut ke blogger.com atau melalui situs lain. Tapi saya lebih suka menyimpannya di situs lain misal www.photobucket.com. 


Untuk proses upload di photobucket.com, silahkan ikuti langkah-langkah berikut : 

1. Silahkan buka alamat  http://www.photobucket.com, 
2. Jika belum terdaftar di situs ini, silahkan daftar dulu (gratis bo) dengan meng klik tombol yang bertuliskan Join Now pada sudut kanan atas layar 
3. Sekarang saya asumsikan sobat sudah terdaftar (pastilah cara daftarnya bisa kan) 
4. Silahkan Sign In dengan Id sobat 
5. Bila sudah berada pada halaman Account sobat, Klik tombol yang bertuliskan Browse... Silahkan pilih logo yang tadi di buat 
6. Klin tombol yang bertuliskan Upload 
7. Tunggu beberapa saat ketika proses upload berlangsung 
8. Setelah upload selesai, akan di perlihatkan gambar logo serta kode HTML nya 
9. Copy kode HTML yang ada di sebelah tulisan URL Link. Paste pada program notepad 
10. Silahkan klik tulisan Log Out untuk keluar dari account sobat. tutup layar browser sobat

Nah sekarang sobat tinggal memasukan kode gambar tadi ke blog ke blog 

Tutorial HTML Tutorial HTML

Baiklah sobat, kita kembali ke (laptop) bahasan utama artikel ini yaitu mengenai HTML. 


Apa itu HTML ? 


HTML (Hypertext Markup Language)adalah merupakan suatu standar bahasa program yang di gunakan untuk menampilkan dokumen-dokumen web. (itu menurut saya bro, kalo salah ya mohon di maafkan). 

Mengenal Tag HTML

Perintah-perintah dalam HTML biasa di sebut dengan TAG. TAG ini kebanyakan mempunyai pasangan, yakni TAG pembuka dan penutup. Misal <b>...</b>, <i>...</i> dan lain sebagainya, dan TAG yang mempunyai pasangan ini juga bersifat Override yakni dapat menimpa fungsi TAG sebelumnya. Contoh : sebuah teks yang sudah di buat miring oleh tag <i> ... </i>, dapat di timpa oleh tag <b> ... </b>sehingga akan melahirkan dua hasil perintah yang berbeda sekaligus yakni kombinasi hurup miring dan huruptebal, contoh : 


ini hanya <b><i>contoh </i></b> saja sobat 


yang akan tampil di browser adalah : 




ini hanya contoh saja sobat 




di samping TAG yang mempunyai pasangan, ada juga tag yang tidak memerlukan pasangan, misal TAG <hr>, <br> , ataupun <input> 


Sebuah Tag tidaklah sensitif terhadap Case (hurup besar atau kecil), jadi mau di tulis hurup besar ataupun huruf kecil akan menghasilkan fungsi yang sama. Sebagai contoh : fungsi Tag <b>....</b> akan sama dengan Tag <B> ....</B>. 

Struktur dokumen HTML

Sebuah dokumen HTML terbagi kedalam tiga bagian utama, yakni HTML, HEAD, serta BODY. 


HTML 


Sebuah dokumen HTML haruslah diawali dengan tag <HTML> dan di tutup dengan </HTML>, Tag ini adalah sarana untuk memberikan informasi kepada browser bahwa apa-apa yang di tulis di dalamnya merupakan sebuah dokumen HTML. 


HEAD 


Bagian header dari sebuah dokumen HTML diawali oleh tag <HEAD> dan di tutup oleh tag </HEAD>, dan di dalam header di isi pula dengan tag title yakni judul dari dokumen, tag title ini di tulis dengan tag pembuka<TITLE> dan di tutup oleh tag </TITLE>, contoh : title dari blog ini adalah Blog Tutorial jadi untuk tittle nya di tulis seperti ini <TITLE> Blog Tutorial </TITLE>, akan tetapi di blogger.com untuk penulisan title tidak harus di tulis langsung pada tag title karena sudah di otomatisasi, alamatnya yaitu<$BlogPageTitle$>. Dalam pengisian title ini seyogya nya jangan asal-asalan, karena title merupakan hal pertama yang di lihat oleh search engine. 


Di dalam Header pun di isi pula dengan tag META, tag META ditulis dengan tag <META>, tag META ini biasanya memuat informasi mengenai dokumen HTML. dengan tag META kita bisa menentukan keyword, content,refresh, dan lainnya sebagainya. Khusus tentang tag META keyword akan di bahas lebih lanjut pada postingan selanjutnya. 


BODY 


Semua dokumen HTML yang di simpan di dalam BODY semisal teks, image, link, dan lain sebagainya akan di tampilakan dan bisa di lihat di dalam browser. 

Pasang Jam di Sidebar Pasang Jam di Sidebar

Agar blog anda tampak cantik dan menarik untuk di lihat, maka anda bisa memasang beberapa aksesori blog, salah satunya adalah dengan cara memasang jam. Jam ini bisa anda dapatkan secara gratis pada situshttp://www.clocklink.com. Salah satu contoh jam yang tersedia adalah sebagai berikut : 









Dan bagi anda yang ingin blognya di pasang jamjuga, silahkan ikuti langkah-langkah berikut : 

1. Silahkan kunjungi situs http://www.clocklink.com
2. Jika sudah berada pada situs tersebut, silahkan klik tulisan Want a clock on your Website ?
3. Silahkan anda melihat-lihat dulu model dari jam yang tersedia, yaitu mulai dari Analog, Animal, Animation, dll
4. Jika di rasa sudah menemukan model jam yang anda sukai, klik tulisan View HTML tag yang berada di bawah jam yang anda sukai tadi
5. Klik tombol yang bertuliskan Accept
6. Pilih waktu yang sesuai dengan tempat anda di samping tulisan TimeZone. Contoh : untuk indonesia bagian barat pilih GMT +7:00
7. Set ukuran jam yang anda sukai di samping tulisan size
8. Copy kode HTML yang di berikan pada notepad
9. Paste kode HTML yang di copy tadi pada tempat yang anda inginkan
10. Selesai

Kode HTML tampil di posting-an Kode HTML tampil di posting-an

Ada seorang teman bertanya begini, bang gimana caranya agar kode HTML bisa tampil di posting-an blog? Nah dari situ muncul ide untuk membuat posting-an ini, barangkali ada diantara kawan-kawan semua yang juga mempunyai pertanyaan seperti itu? jawabannya mungkin begini. Agar kode-kode HTML dapat muncul pada posting-an blog kita, ada beberapa cara dan yang saya ketahui saat ini cuma baru dua cara ( barangkali kawan-kawan ada yang lebih tahu ). 

Yang pertama yaitu anda harus mengganti karakter-karakter perintah dari program HTML dengan notasi tertentu. Karakter-karakter yang sering di gunakan yaitu seperti yang tertera pada tabel di bawah ini :

Karakter	Notasi	Keterangan
<	&lt;	Kurung runcing terbuka
>	&gt;	Kurung runcing tutup
&	&amp;	Tanda Dan
"	&quot;	Tanda petik ganda
±	&plusmn;	Tanda plus minus
Spasi	&nbsp;	Tanda Spasi
©	&copy;	Tanda hak cipta (copyright)
®	&reg;	Tanda terdaftar (Registered)

Nah agar lebih paham akan saya beri contoh, misalkan dalam postingan anda berisi kata-kata seperti ini : 


Untuk membuatnya cukup dengan hanya membubuhkan program di bawah ini : 

<meta http-equiv="refresh" content="10"> 

</meta>




Nah (dari tadi perasaan nah nah melulu , pake kata lain nape!...       ) di dalam postingan anda, jika ingin tampil seperti itu maka yang di tuliskan tidak persis seperti kode di atas, sebab nanti di postingan tulisan kode tersebut tidak akan muncul, yang ada justru efek dari kode yang anda tuliskan. trus jalan keluarnya gimana? Seperti yang saya tuliskan pada tabel, anda harus mengganti karakter-karakter perintah yang ada dengan notasi penggantinya, jadi yang harus anda tuliskan pada postingan adalah seperti ini :


Untuk membuatnya cukup dengan hanya membubuhkan program di bawah ini : 

<br/><br/> <code>
&lt;meta http-equiv="refresh" content="10"&gt; 
<br/>
&lt;/meta&gt;
</code>Pembubuhan perintah <code> dan </code> adalah untuk menandakan bahwa yang anda tulis adalah sebuah kode HTML, dan nantinya pun tulisan-tulisan yang berada dalam perintah ini akan tanpil beda dengan tulisan-tulisan yang lainnya, sebagai contoh silahkan anda lihat postingan saya yang lainya yang membubuhkan kode-kode HTML. pembubuhan perintah <br/> adalah untuk membuat tulisan berpindah kebawah, jika anda tidak membubuhkan perintah <br/> tadi, walaupun di posting-an anda tulis jauh kebawah, hasilnya akan tetap bersatu. 


  Huh cape juga ya dari tadi kutak-ketik nih.., itu tadi cara yang pertama. Cara yang kedua adalah dengan menggunakan text area. Cara membuat text area secara lengkap silahkan klik di sini. Sebagai contoh, untuk menuliskan kode-kode di atas, pada posting-an anda harus menuliskan seperti ini : 


Untuk membuatnya cukup dengan hanya membubuhkan program di bawah ini : 
<br/><br/>
<p align="left"><textarea name="code" rows="6" cols="400">&lt;meta http-equiv="refresh" content="10"&gt; &lt;/meta&gt;</textarea></p> 




Maka yang akan tampil di blog anda adalah seperti ini : 


Untuk membuatnya cukup dengan hanya membubuhkan program di bawah ini : 

mudah bukan? selamat mencoba dan berkarya. 


oupss... saya lupa kawan, untuk memposting seperti yang saya jelaskan dia atas, anda harus pada posisiEdit HTML jangan pada posisi compose.

Membuat Text Area blogspot Membuat Text Area blogspot

Apa itu text area?. Untuk memudahkan anda memahami apa itu text area, silahkan alihkan perhatian anda ke kolom sebelah kanan layar, di bawah tulisan Mau tuker link, ada sebuah kotak yang di dalamnya berisi text kode-kode HTML, itulah yang di sebut text area. Nah dengan melihat contoh tadi, maka dapat kita katakan bahwa Text area adalah area atau tempat untuk menyimpan text atau tulisan dengan membentuk area baru. Biasanya text area ini di gunakan untuk menyimpan kode-kode HTML ataupun text lainnya agar bisa di copy oleh para pengunjung. 

Untuk membuat text area, silahkan anda Copy kode di bawah ini : 

<p align="center"><textarea name="code" rows="6" cols="20"> Tulis text ataupun kode-kode yang anda inginkan di sini, maka nanti tulisan anda akan tampil di dalam text area </textarea></p> 

Sebagai contoh : 

Keterangan : rows="6", menunjukan tinggi dari text area, jadi jika anda menginginkan text area yang tinggi maka silahkan ganti angka " 6 tadi dengan angka yang lebih tinggi nilainya. 


Cols="20", menunjukan lebar dari text area. Jika anda menginginkan text area yang lebar maka silahkan ganti angka " 20 " tadi dengan angka yang lebih tinggi nilainya. 


Text Area dengan memakai HighLight 


Ada variasi lain dari membuat text area ini, yakni text area dengan menggunakan tombol highlight. dengan adanya tombol highlight ini akan memudahkan bagi para pengunjung untuk mengcopy seluruh text ataupun kode-kode yang di berikan, karena dengan hanya sekali tekan saja pada tombol highlight tadi, maka seluruh text ataupun kode-kode yang ada di dalamnya akan di highlight dan tinggal di copy saja. Fasilitas ini sangat berguna tatkala text ataupun kode-kode yang di berikan dalan jumlah yang sangat banyak dan ini akan mengurangi resiko tertinggalnya suatu text ataupun kode-kode untuk di copy. Untuk membuat text area dengan menggunakan highlight ini silahkan anda copy kode HTML di bawah : 


<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Highlight All"> </div><div align="center"></div><p align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55">simpan tulisan anda di sini, maka tulisan yang anda tulis akan muncul di sini dan siap di copy oleh para pengunjung</textarea></p></div></form> 


Sebagai contoh : 

Agar anda lebih memahami kode di atas, sedikit akan saya uraikan. Kode di atas mempunyai dua elemen bagian, yakni elemen kode untuk membuat tombol yang bertuliskan Highlight All, dan yang kedua adalah elemen kode untuk membuat text area. 


Elemen tombol highlight All : 

1. <div align="center"> --> kata center menunjukan bahwa posisi tombol akan berada di tengah, jadi jika anda ingin posisi tombol berada di tepi sebelah kiri, tinggal ganti dengan kata left. Dan jika ingin berada di tepi sebelah kanan, tinggal ganti dengan kata right.



2. <input onclick="javascript:this.form.txt.focus();this.form.txt.selec()"> --> kode ini artinya ketika tombol highlight di klik, maka seluruh text yang ada di dalamnya akan di highligt (di tandai atau di blok), jadi anda jangan merubah tulisan ini.



3. Value="Highlight All" --> kata Highlight All adalah kata yang akan muncul di dalam tombol, jadi jika anda ingin merubah tulisan ini silahkan ganti dengan kata yang anda inginkan.

Element text area : 

1. <p align="center"> --> ini menunjukan bahwa text area akan berada di tengah, nah jika anda ingin text area anda berada di tepi kiri, ganti kata center dengan kata left, bila ingin di tepi kanan, ganti dengan kata right.
2. <text style="WIDTH: 300px">-->kata "WIDTH:300px" menunjukan lebar dari text area tersebut sebanyak 300 pixel, jadi jika anda ingin memperpendek atau memperpanjang lebar text area, anda tinggal menggantinya dengan angka yang anda inginkan. misal: "WIDTH:700px;"



3. HEIGHT: 144px --> angka "144px" menunjukan bahwa text area akan mempunyai tinggi sebesar 144 px, jadi jika anda ingin merubahnya tinggal ganti angka tersebut dengan angka yang anda inginkan. Misal : HEIGHT:160px.

Cara membuat spoiler atau tombol sembunyi Cara membuat spoiler atau tombol sembunyi

Contoh Spoiler :

Klik Disini

nah itu lah contoh nya sob,kalau sobat ingin spoiler seperti itu silahkan sobat ikuti langka2 berikut ini
1. Login ke dashboar blog sobat => Buat postingan, pilih pada mode Edit HTML

2. Copy code berikut, paste dipostingan sobat. 

<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Klik Disini</span></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; " 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'; }" type="button"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

Isi Spoiler sobat disini, boleh gambar, code dll

</div></div></div></div>

• Ganti tulisan warna Merah, dengan tulisan yang sobat inginkan, bisa berisi penjelasan atau hanya sekedar "klik untuk melihat", tapi jangan dihapus nanti gak berfungsi spoilernya.
• Kemudian sobat ganti tulisan biru dengan isi spoiler sobat, misalnya gambar sobat.

 3. Publikasikan dan lihat hasil nya

Selamat Mencoba Semoga Berhasil

Cara Membuat kursor mouse Diikuti Teks Cara Membuat kursor mouse Diikuti Teks

klo mau ikuti tutornya


Baik Sobat berikut Scripnya :

<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #FF0000;



/* End Optional */

/* Start Required - Do Not Edit */
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;}
/* End Required */
/* End Circle Text Styles */
</style>
<script type="text/javascript">

/* Circling text trail- Tim Tilton
Website: http://www.tempermedia.com/
Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
Modified Here for more flexibility and modern browser support
Modifications as first seen in http://www.dynamicdrive.com/forums/
username:jscheuer1 - This notice must remain for legal use
*/

;(function(){

// Your message here (QUOTED STRING)
var msg = "Nama  sobat";

/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */

// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 24;

// 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.4;

// 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;

////////////////////// Stop Editing //////////////////////

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>

Silahkan Sobat Ikuti Langkah Langkah Berikut:
1.Masuk ke akun blog Sobat
2.Pilih Tata Letak/Rancangan =>Kemudian Pilih HTML/Java Script
3.Masukan kode/Script Diatas
4.Ubah kode yg berwarna KUNING sesuai keinginan sobat
5.Simpan
Dan Lihat Hasilnya
  

Selamat Mencoba Semoga Berhasil

Screen Saver Blog dengan Css3 Screen Saver Blog dengan Css3

klo pengen tau....
ikuti ja tutornya===>

1. Login Ke Akun Blog Sobat
2. Pada Dasbor Klik Rancangan=>> Kemudian Tambah Gadget Dan Pilih HTML Java/Script
3. Pastekan Kode di bawah ini Tepat Didalamnya

<style type="text/css">body .saving{position: fixed;width: 100%;top: 0;left:0;height: 100%;opacity: 0.98;filter: alpha(opacity=98);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=98)";background: #000;border-bottom: 3px solid transparent;z-index: 999999;-o-transition: all 3s ease-in-out 10s;-moz-transition: all 3s ease-in-out 10s;-webkit-transition: all 3s ease-in-out 10s;}body:hover .saving {opacity: 0.0;height:0.001%;filter: alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";background: #0a7f01;border-bottom: 5px solid #333;-o-transition: opacity 2s ease-in-out 2.5s, background-color 3s linear 0.5s, height 1s ease-in 1.8s;-moz-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;-webkit-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;}body .saving p.esm1{margin: 0;padding: 0;width: 92%;background: transparent;font-size: 100px;font-family: "Serif", Times New Roman;color: #FF0000;text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40,   2px -10px 10px #f10;position: relative;margin-top: 200px;line-height: 20px;font-weight: bold;text-align: center;border: 30px solid transparent;border-radius: 20px;-moz-border-radius: 20px;-webkit-border-radius: 20px;-o-transition: -o-transform 5s ease-out 8s, background-color 4s ease-out 12s;-moz-transition: -moz-transform 5s ease-out 8s, background 4s ease-out 12s;-webkit-transition: -webkit-transform 5s ease-out 8s, background 4s ease-out 12s;}body:hover .saving p.esm1{font-size: 10px;color: red;width: 25%;margin: 340px 0 0 300px;padding: 25px;background: #aaa;border: 20px solid #888;border-radius: 170px;-moz-border-radius: 170px;-webkit-border-radius: 170px;-o-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-moz-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-webkit-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-o-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -o-transform 1.2s linear 1.5s, background-color 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;-moz-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -moz-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;-webkit-transition: font 1.1s 0.1s, width 1.7s 0s, margin-left 0.8s 1.2s, -webkit-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1s ease-in 0.5s, border 3s ease-in, -webkit-border-radius 3s ease-in;}.saving p span.esm2{font-size: 18px;opacity: 0.5;filter: alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";display: block;text-align: center;width: 300px;margin: -10px auto; font-weight: normal;padding: 2px 8px;background: #000;border: 1px solid #333;border-radius: 0;-moz-border-radius: 0;-webkit-border-radius: 0;color: #0000FF;text-shadow: none;font-family: Arial, Helvetica, sans-serif;-o-transition: 1s ease-out;-moz-transition: 1s ease-out;-webkit-transition: 1s ease-out;}.saving:hover p span.esm2{font-size: 10px;width: 200px;padding: 0;}.saving p span.esm3{color: #ccc;font-family: "Tahoma", Arial, Helvetica;display: block;margin:10px auto;background: url http://i964.photobucket.com/albums/ae124...) left center repeat-x;background: -moz-linear-gradient(top,#666,#111);background: -webkit-gradient(linear,0% top,0% bottom,from(#111),to(#666));opacity: 0.6;filter: alpha(opacity=60);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";width: 250px;text-shadow: 1px 1px 1px #000;border: 1px solid #333;border-radius: 4px;padding:2px 10px;-moz-border-radius: 4px;-webkit-border-radius: 4px;font-size: 12px;font-weight: normal;line-height: 16px;}.saving .by_evanzip{margin-left: 30px;text-align: center;color: #015828;font-size: 12px;font-weight: normal;position: absolute;bottom: 30px;width: 100%;height: 20px;left: 0;}.saving .by_Tejahtc span.esm4 {color: #aaa;font-style:italic;font-size:14px;font-weight:bold;text-transform:uppercase;}#recpost {width:210px;overflow: hidden;height: 327px;float: right;margin-top: 10px;padding: 4px 2px;background: transparent;border: 1px solid transparent;border-radius: 10px;-moz-border-radius: 10px;-webkit-border-radius: 10px;-o-transition: all 1.5s ease-out;-moz-transition: all 1.5s ease-out;-webkit-transition: all 1.5s ease-out;}</style>

<div class='saving'>

<p class='esm1'>Evano Saputra<br/>

<br/><div class='by_evanzip'>Original design by: <span class='esm4'> Evanzip.blogspot.com - Evanzip.blogspot.com</span> -  2011</div>

</p>

<center><span class='esm3'>Move your mouse to go back to the page!<br/><blink>Hey...jangan pergi dulu gerakin aja lagi mousenya,nah gitu dong!</blink></span>

</center></div>

4.Ubah nama warna kuning dengan nama sobat

5.Simpan

SELAMAT MENCOBA SEMOGA BERHASIL

Cara Mengganti Emoticon Keren Cbox Cara Mengganti Emoticon Keren Cbox

cara pasang bendera indonesia di Cbox,nga cuma bendera indonesia lo motor,mobil juga bisa sobat masukin di icon cbox hehehe....langsung aja deh gan kelamaan

1 .login ke cbox sobat kalu belum punya silahkan buat dulu lah disini

2. Setting CBoX sobat sesuai dengan keingin sobat

3. Lalu masuk ke bagian Option-->> Smile . Untuk memasukan emoticonnya .

4. Kemudian masukkan Code dan URL emoticon sobat, lihat contoh gambar di bawah  ini 

Kalau sobat belum punya URL emoticon nga usah bingung langsung evanzip kasih lengkap

silahkan sobat ganti URL di cbox sobat dengan URL emoticon di bawah ini

5. Save ! dan Selesai...kini cbox/Buku Tamu sobat bisa tampil BEDA...

Kalau Tutorial ini bermanfaat silahkan tinggalkan komentar sobat di bawah ini

Selamat mencoba semoga berhasil