IQ

Rabu, 11 April 2012

Cara membuat tulisan berjalan (marquee)


Cara membuat tulisan berjalan (marquee) – Mungkin anda pernah mengunjungi sebuah blog atau website yang terdapat tulisan berjalan dan dalam hati anda bertanya, bagaimana cara membuat tulisan berjalan seperti itu yah?

Cara Membuat Tulisan Berjalan (Marquee)

Untuk membuat tulisan berjalan itu sangat mudah karena hanya dengan kode HTML sederhana sudah akan tercipta sebuah tulisan berjalan. Kode HTML untuk membuat tulisan berjalan di kenal dengan perintah Marquee. Kode dasar perintah marquee adalah sebagai berikut :
<marquee>Tulisan disini akan berjalan</marquee>
Selain kode dasar marquee, ada perintah lain (umumnya disebut sebagai atribut) yang disisipkan untuk mengatur keindahan tampilan tulisan yang berjalan. Atribut yang sering di gunakan dalam kode marquee adalah : 

bgcolor="warna" » Untuk mengatur warna background (latar belakang) teks 

direction="left/right/up/down" » Mengatur arah gerakan teks 

behavior="scroll/slide/alternate" » Untuk mengatur perilaku gerakan 

Scroll » teks bergerak berputar

Slide » teks bergerak sekali lalu berhenti

Alternate » teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo) 

title="pesan" » Pesan akan muncul saat mouse berada di atas teks 

scrollmount="angka" » mengatur kecepatan geraka, semakin besar angka semakin cepat gerakannya. 

scrolldelay="angka" » Untuk mengatur waktu tunda gerakan dalam mili detik 

loop="angka|-1|infinite" » Mengatur jumlah loop 

width="lebar" » Mengatur lebar blok teks dalam pixel atau persen 


Agar lebih jelas akan Kang Rohman sertakan contohnya : 

Contoh marquee dari gerakan : 
<marquee align="center" direction="left" height="200" scrollamount="2" width="30%"> marquee dari kanan ke kiri </marquee> 

Contoh hasilnya : 

marquee dari kanan ke kiri 

ganti kata "left" dengan keinginan anda yaitu bisa : right,  up, down . 

Contoh marquee dengan variasi hurup dan warna latar belakang : 

<div align="left"><font face="georgia" color="White"><strong><marquee bgcolor="red" width="70%" scrollamount="3" behavior="alternate"> </marquee></strong></font></div>
Contoh hasilnya : 

marquee dengan variasi hurup


Agar lebih menarik, kode marquee juga bisa dipadukan dengan javascript sederhana, seperti onmouseover="this.stop()" onmouseout="this.start()" . Dengan kode javascript tersebut, tulisan berjalan akan seketika berhenti apabila pointer mouse komputer pengunjung blog kita mengarah ke tulisan yang berjalan, dan akan berjalan kembali apabila pointer mouse dipindah ke tempat lain. 

Contoh, silahkan arahkan pointer mouse anda ke area marquee di bawah ini :

Contoh kodenya :

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="50%" height="200" align="center"> silahkan tunjuk ke sini </marquee> 

Contoh hasilnya : 

silahkan tunjuk ke sini 

Contoh kode marquee yang di dalam nya terdapat link : 
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="up" width="100%" height="100" align="center"> 
<a href=" http://www.krtutorplus.com/">cara membuat blog</a><br/> 
<a href="http://krtutorplus.com/2007/04/bikin-blog.html">Membuat blog </a><br/> 
<a href="http://www.krtutorplus.com/2007/08/membuka-program-periklanan.html">Pasang Iklan </a><br/> 
</marquee> 

<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="down" width="100%" height="100" align="center"> 
<a href="http://www.krtutorplus.com/2007/08/membuka-program-periklanan.html">Pasang Iklan </a>
<a href="http://krtutorplus.com/2007/04/bikin-blog.html">Membuat blog </a><br/> 
<a href=" http://www.krtutorplus.com/">cara membuat blog</a><br/> 
</marquee> 
Contoh hasilnya : 

cara membuat blog
Membuat blog 
Pasang Iklan
Pasang Iklan 
Membuat blog 
cara membuat blog


Itu adalah beberapa contoh variasi kode marquee yang bisa di berikan, silahkan anda otak-atik sendiri agar tercipta variasi-variasi dari marquee ini. 

sumber => http://www.krtutorplus.com/2007/04/membuat-marquee.html

Selasa, 10 April 2012

CARA UPLOADKAN TEMPLATE YANG DIDWONLOAD

1. BUKA MENU TEMPLATE PADA BLOGER DASBOR

2. KLIK PILIHAN SEPERTI PADA GAMBAR DIATAS , AKAN MUNCUL TAMPILAN BERIKUT

3. KLIK " CHOUSE " SEUAI GAMBAR DIATAS



4. PILIH FILE XML , DARI FILE TEMPLATE YANG DIDWONLOAD (EXTRAK TERLEBIH DAHULU FILENYA)

5. KLIK UNGGAH SESUAI GAMBAR DIATAS, TUNGGU SELESAI.

Cara Memasang Histats di Blog


Cara Memasang Histats di Blog | Setelah membuat blog, ingin rasanya kita mengetahui berapa jumlah pengunjung pada blog kita. Apa sish histats itu?

Histats.com adalah sebuah website layanan stats dan data traffic pengunjung blog atau website. Cara mendapatkan data analisis ini kita hanya perlu meletakkan script dari histats.com di dalam blog/website kita. Hisatas.com di kembangkan dan di kelola oleh Francesco Vigotti, seorang internet marketer.
  • Histats bisa juga di klafikasikan mirip dengan Google Web Analysis, yang berfungsi untuk memantau :
  • traffic stats,
  • user online,
  • referrring sites (dari mana situs pengunjung berasal), search engine (dengan kata kunci apa pengunjung datang ke blog kita memalui search engine),
  • browser (browser apa yang mereka gunakan untuk mengakses blog kita),
  • geolocation (dari belahan dunia mana mereka berasal), traffik by url,
  • traffic by title dll.

Nah, gimana tertarik untuk mengetahui tentang pengunjung blog anda, silahkan di coba widget yang satu ini. Pemasangannya di dalam blogger-blogspot juga sangat mudah, hanya tinggalRegister di histats dan membuat akun kemudaian, anda hanya tinggal memilih widget yang di inginkan, mengambil kode script yang di berikan oleh histats dan meletakkanya di dalam Tambah Gadget --- Javascript+Html di tata letak blogger Anda.

Tutorial Cara Memasang Histats di Blog Anda : (jangan lupa siapkan minuman anda yah... hehehe, kopi atau teh gitu loh biar adem)
1. Masuk ke Histats.com
2. Registerlah : Klik Register

Pada Create new account isikan data-data yang di pelukan, jangan sampai ada yang ketinggalan. Jika sudah beri tanda centang pada I have read and agree Publisher Agreement Terms dan tuliskan captcha.


Dan KLIK Register. Kemudian ada pesan seperti ini

Buka email yang tadi anda daftarkan dalam Create new account dan KLIK tautan yang di berikan Histats untuk mangaktifkan akun anda.

your account is now active, please login now and start using histats.com!

Jika ada pesan tersebut maka akun anda telah aktif, silahkan masuk lagi ke histats.com dan login dengan email dan password yang anda buat sebelumnya.

3. + Add a Website

Langkah selanjutnya adalah mendaftarkan website atau blog Anda. Blog yang di daftarkan bisa lebih dari satu, jadi dengan manfaatkan satu akun histats, anda bisa mendaftarkan banyak blog atau website anda, gratis pula.. cihui ga tuh... oke go on..

KLIK + Add a Website





● Site url : url situs anda http://namabloganda.blogspot.com contoh: http://kumpulan-adsen.blogspot.com
● Pilih bahasa : Indonesian - Bahasa Indonesia
● Time zone : Pilih Waktu Pendaftaran ke histats, Misal : 11 - 04:38 am Asia/Jakarta (sesuaikan zona dimana anda registrasi histats)
● Category : Website anda termasuk kategori apa, silahkan di pilih. Misalnya Visual Art & Design --- Design.
● Title : Judul web atau blog Anda.
● Description : Penjelasan singkat tentang blog Anda.
● Stats visibility : artinya pengaturan provasi siapa saja yang dapat melihat Status atau data dari pengunjung Blog Anda. ada dua pilihan visible to everyone atau visible only to me, silahkan di pilih.
● Jangan lupa kode captcha.
● Dan KLIK Continue

Beres sudah. Jadi sekarang adalah, cara memasang widget di blog blogspot anda.


4. Pasang widget di blogger

KLIK : nama blog anda.


KLIK : Counter Code.


KLIK + add new counter


Tinggal di pilih yang sesuai selera Anda, 1, 2, 3, 4 line, animated dll. Terserah anda.

Nah satu yang unik yaitu Hidden Tracker, jika memilih yang ini maka counter dan widget tidak akan di tampilkan di dalam blog anda, namun anda harus tetap memasang kode scriptnya di blog anda, dengan cara ini anda tetap mendapatkan data traffic dan dapat tetap di akses di dalam akun anda.


Beri tanda centang pada visitor today : Total visitor - Page views today - Total page views - user online dan KLIK SAVE.


KLIK Pada Counter id : xxxxxxx (no itu bukan patokan sesuai yg dikasih)


Lalu Copy code scriptnya


5. Masuk ke Blog Kawan, tentunya dengan ACC kawan sendiri bukan.
Klik Rancangan atau Tata Letak --> Tambah Gadget ---> Pilih HTML/Javascript dan paste code script kemudian SIMPAN.


Sabtu, 28 Januari 2012

Membuat daftar isi blog dengan tampilan menu acordion




Tips dan triks blog yang tidak pernah ada habisnya, hehe. Sobat, kali ini saya ingin berbagi satu lagi tips dan triks blog yaitu bagaimana membuat daftar isi blog dengan tampilan menu acordion. Widget daftar isi model ini dibuat oleh mas Abu Farhan.

Nah, tampilan daftar isi blog seperti ini bisa sobat lihat demo berikut.


Mengapa harus menggunakan daftar isi? saya rasa dengan menggunakan daftar isi maka pengunjung sobat bisa mengetahui apa saja isi-isi atau konten-konten blog sobat.

Berikut langkah - langkah membuat daftar isi menu acordion :

1. Seperti biasa, login ke dashboard blog sobat.

2. Postingan / buat entri baru / menggunakan halaman --> lalu copy code dibawah pastekan pada halaman posting. Gunakan mode edit HTML (lihat gambar).

<link href="http://abu-farhan.com/script/acctoc/acc-toc.css" media="screen" rel="stylesheet" type="text/css"></link>
<script src="http://abu-farhan.com/script/acctoc/daftarisiv2-pack.js">
</script>
<script src="http://www.masterendi.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc">
</script>
<script type="text/javascript">
var accToc=true;
</script>
<script src="http://abu-farhan.com/script/acctoc/accordion-pack.js" type="text/javascript">
</script>

Keterangan :
  • Ganti tulisan www.masterendi.com dengan alamat blog sobat.
3. Publish / terbitkan entri.

Cara Membuat chatBox atau shoutmix Berada di samping



Chatbox atau shoutmix adalah widget terpopuler bagi sebagian besar blogger. Tips dan triks blog yang akan kita bahas kali ini adalah bagaimana cara Membuat chatBox atau shoutmix Berada di samping blog kita.

Cara membuatnya sobat bisa mengikuti langkah-langkah sederhana berikut :

1. Sobat harus memiliki code chatbox atau shoumix terlebih dahulu, baca cara membuat chatbox disini.

2. Sobat login ke dashboard blogger.com --> Rancangan --> add gadget --> pilih yang 'HTML/JavaScript'

3. Copy Code berikut :

* html #gb{position:relative;}
.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://i683.photobucket.com/albums/vv193/vebyo/Guest3.gif') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()"> </div>
<div class="gbcontent">
PASANG SCRIPT CHATBOX SOBAT DISINI

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script></div></div>

Keterangan :
Sobat ganti PASANG SCRIPT CHATBOX SOBAT DISINI dengan script chatbox sobat.
 
4. Save, lihat hasilnya.

Cara mudah memasang tombol like facebook dipostingan




Tips dan triks blog hari ini adalah Cara mudah memasang tombol like facebook di atas atau bawah postingan. Tombol like facebook adalah salah satu cara yang efektif juga untuk mempromosikan artikel blog sobat kepada teman-teman sobat di facebook. Nah, kalau seandainya tombol like tersebut di klik oleh user lain maka akan tersebar juga di akun facebook user tersebut.

Tips sederhana agar tombol like dklik user adalah dengan membuat konten yang berguna bagi user sobat tersebut, saya yakin dengan senang hati user tersebut membagi artikel sobat.

Jadi, berikut cara mudah memasang tombol like facebook dipostingan :

1. Login ke dashboard blog sobat

2. Masuk ke menu Rancangan --> Edit HTML

3. cari kode <data:post.body/>

4. Lalu copy kode dibawah ini dan letakkan diatas <data:post.body/> jika ingin tombol like diatas postingan sobat atau dibawah <data:post.body/> jika ingin meletakkan tombol like dibawah postingan.
 <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' height='30' scrolling='no' style='border:none; overflow:hidden; '/>
 Keterangan :
  • tampilan standar seperti ini :
  
  • Tampilan  button_count
 
  •  Sobat pilih tampilan icon mana yang sobat mau dengan mengganti code standard
  • Gunakan Light jika template sobat backgroundnya putih, atau dark jika hitam.
5. Save template sobat..

Bagaimana cara pasang widget tv online diblog



Menyajikan berbagai fitur diblog memang menjadi daya tarik tersendiri bagi sebagian blogger. Nah, fitur sederhana yang ingin saya bagikan kali ini adalah Bagaimana cara pasang widget tv online diblog.

Widget TV online bisa sobat pasangkan di postingan atau di sidebar blog. Untuk memasang di postingan langkah - langkahnya sebagai berikut :

1. Login ke dashboard blog --> Entri baru, pilih mode 'edit html'

2. Copy dan paste code berikut pada postingan tersebut.

<embed align="top" allowfullscreen="true" allowscriptaccess="sameDomain" bgcolor="#ffffff" devicefont="false" height="860" menu="true" name="MivoTV" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" scale="noscale" scroll="auto" src="http://id.imediabiz.com/MivoTV.swf?r=%27%20+%20Math.round%28Math.random%28%29%20*%2099999%29%20+%20%27" type="application/x-shockwave-flash" width="100%" wmode="transparent"></embed>

3. Jika sudah Terbitkan Entry sobat dan selesai..


Untuk memasang widget TV online disidebar :

1. Login --> Rancangan --> Add Gadget --> pilih HTML/JavaScript

2. Copy lalu paste code berikut :
<embed align="top" allowfullscreen="true" allowscriptaccess="sameDomain" bgcolor="#ffffff" devicefont="false" height="860" menu="true" name="MivoTV" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" scale="noscale" scroll="auto" src="http://id.imediabiz.com/MivoTV.swf?r=%27%20+%20Math.round%28Math.random%28%29%20*%2099999%29%20+%20%27" type="application/x-shockwave-flash" width="100%" wmode="transparent"></embed>
3. Save, lihat hasilnya..