Cara membuat widget berita berjalan di bawah blog seperti di TV

By : INDOBLOG BLITAR

Cara membuat widget berita berjalan di bawah blog seperti di TV

cara membuat widget berita berjalan di bawah blog seperti di TV.
Kalau seperti itu 'kan jadi seperti di Tv beneran kan Langsung aja :

1. Masuk ke Akun blogger sobat seperti biasa.

2. Masuk ke Rancangan > Tambah Gadget

3. Pilih HTML/Java Script dan Copas kode di bawah ini.

<style> #topmenu { border:0px solid #fff; position: fixed; z-index: +1000; bottom: 0px; margin: 0 auto; width: 100%; height: 25px; left: 0px; background: black; } .news { width:100%; float:left; margin:2px; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); } </style> <div id="topmenu"> <div class="news"> <iframe allowtransparency="true" frameborder="0" height="20" id="NewsWindow" marginheight="0" marginwidth="0" scrolling="no" src="http://www.elshinta.com/v2003a/scrolling.htm" style="background-color: transparent;" width="100%"></iframe></div></div>

4. Simpan dan lihat hasilnya! Semoga bermanfaat :)

0 Comments

Cara Membuat Banner Iklan Melayang Di Bawah Blog

By : INDOBLOG BLITAR

Cara Membuat Banner Iklan Melayang Di Bawah Blog

Cara Membuat Iklan Melayang Di Bawah Blog ini disertai dengan tombol Close untuk mempermudah pengunjung ketika ingin menutup iklan tersebut.

Oke saya rasa tidak perlu panjang lebar, ayo di mulai...

Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.

Ikutilah langkah-langkah di bawah ini :

1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).

Keterangan :

Ubah ukuran pada script berwarna biru karena kolomnya berdampingan dengan tombol Close, maka tinggi kolomnya harus lebih besar dari tinggi ukuran pada banner/gambar iklan kamu.
Tombol Close memerlukan space kolom 15px, maka kamu buat kolom dengan ukuran : tinggi banner + 15px.
Warna kuning adalah URL gambar Close, silahkan kamu ganti dengan selera yang kamu mau.
Warna merah adalah URL iklan, silahkan kamu ganti dengan selera yang kamu mau.
Warna orange adalah judul iklan, silahkan kamu ganti dengan selera yang kamu mau.
Warna hijau adalah ALT gambar iklan, silahkan kamu ganti dengan selera yang kamu mau.
Warna ungu adalah URL gambar iklan, silahkan kamu ganti dengan selera yang kamu mau.

5. Simpan Pengaturan.

Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat :)

0 Comments

Cara Membuat Judul Blog atau Teks Berjalan Pada Title Bar

By : INDOBLOG BLITAR

Cara Membuat Judul Blog atau Teks Berjalan Pada Title Bar

Selain artikel yang menarik tampilan blog yang bagus tentunya tak kalah penting agar pengujung betah berlama-lama mencari informasi-informasi apa saja yang ada pada blog kita. Tapi anda harus ingat bahwa menambahkan banyak widget pada blog akan memperlambat loading dan tentunya mengurangi minat orang untuk mengunjungi blog anda. Untuk itu tambahkanlah widget yang lebih berguna untuk blog anda.

Artikel kali ini membahas tentang bagaimana nantinya judul blog anda akan berjalan pada title bar browser seperti yanga anda lihat pada blog ini. Uniknya anda juga bisa membuat tulisan apa yang ingin di tampilkan pada title bar browser anda.
Adapun caranya adalah sebagai berikut.

1. Silahkan login ke blogger

2. Klik desain pada pojok kanan atas blog anda

3. Pilih tata letak

4. Tambah gadget

5. Pilih HTML/JavaScript

6. Copy srcipt di bawah

7. Simpan

Keterangan

- Ganti teks berwarna biru dengan teks kesukaan anda.

- Angka 200 adalah kecepatan teks berjalan pada title bar anda.

0 Comments

Membuat Teks Berjalan Di Atas Header Blog

By : INDOBLOG BLITAR

Membuat Teks Berjalan Di Atas Header Blog

Pada posting kali ini, saya akan share cara membuat teks berjalan di atas header seperti pada blog ini, teks berjalan itu menggunakan script efek marquee, ada banyak jenis marquee, namun yang kita gunakan saat ini adalah marquee yang berfungsi memberi efek berjalan ke arah kiri dan tidak berhenti saat didekati mouse, nah langkah-langkahnya adalah :
1. Log In ke Blogger.
2. Pilih Rancangan, selanjutnya Edit Html, centang Expand Template Widget.
3. Cari kode script </head>, dan letakkan kode di bawah ini tepat di bawah kode </head>.

<marquee direction='left' scrollamount='2'>Ketik Teks Yang Akan Di Tampilkan</marquee>

4. Ganti teks warna hijau dengan teks yang akan Anda Tampilkan.
5. Simpan Template.

Semoga Berhasil !!!

0 Comments

SCREENSAVER BLOG

By : INDOBLOG BLITAR

Memasang Screensaver Blog Versi 2

Screensaver blog atau biasa disebut energy saving mode merupakan kode script yang diperkenalkan pertama kali oleh onlineleaf dalam gerakan kampanye save green environtment (hemat energi). Fungsi dari kode script ini, yaitu untuk membuat website atau blog berjalan dengan mengkonsumsi energi yang lebih sedikit dengan cara menutup tampilan blog saat sedang idle (diam tanpa ada aktivitas) dengan warna hitam dan gelap.

Penghematan energi pada tampilan monitor baik tabung CRT, LCD dan Plasma, yaitu dengan menampilkan warna hitam gelap, kenapa saya bilang warna hitam gelap karena warna hitam dapat juga dihasilkan dengan pencampuran warna dari RGB (Red-Green-Blue) sehingga tetap menghasilkan arus listrik walaupun warnanya hitam. Karena tujuan dari energy saving mode adalah untuk menghemat energi berarti warna hitam yang digunakan adalah warna hitam tanpa ada campuran RGB jadi saya sebut hitam gelap. Warna hitam gelap pada layar monitor dihasilkan dengan meniadakan arus listrik penghasil warna pada layar monitor sehingga dengan mematikan arus listrik ini kita sudah menghemat energi dan mengurangi emisi CO2 untuk konsumsi penggunaan listrik pada layar monitor. Penghematan yang dilakukan memang tidak terlalu signifikan tapi kalo dikali dengan pengguna komputer di seluruh dunia... lumayankan penghematannya....

Kode script energy saving mode menggunaan library JQuery jadi pastikan JQuery yang sobat pasang tidak terjadi konflik dengan kode script energy saving mode. Untuk menghindari konflik coba gunakan kode <script>jQuery.noConflict();</script> dan pasang di atas kode </Html> pada kode HTML template sobat.

Screensaver yang dibuat onlineleaf hanya menggunakan warna dan style yang sederhana, karena memang fungsinya yang dibuat untuk gerakan hemat energi. Pada postingan artikel kali ini saya akan menampilkan screensaver versi 2 dengan warna dan style yang bisa di konfigurasi supaya biar lebih energik dan menarik, selain itu screensaver versi 2 ini bisa disesuaikan dengan tema warna template blog yang digunakan. Penasaran-kan... seperti apa sich screensaver blog versi 2 ini... coba lihat contohnya pada link di bawah ini :

Cara Pemasangan :

Klik "Design" kemudian klik "Edit HTML" setelah itu klik centang pada "Expand Widget Templates", seperti gambar dibawah ini.

Cari kode </Head> pada template blog (tekan tombol keyboard CTRL+F untuk menampilkan kotak pencarian di browser dan mempercepat pencarian) kemudian copy kode di bawah ini dan taruh di atas kode </Head> tersebut. Penempatan kode di bawah ini juga bisa ditempatkan sebagai widget sidebar atau widget upbar.


<center><script>
var ssBGImg = "none";
var ssBGColor = "monozcore";
var ssTextColor = "white";
var ssInactivity = 10000;
var ssImgUrl = "http://i1175.photobucket.com/albums/r638/dedy812349/BARU_zps35812853.png";
var ssBlogName = "MonozCore";
</script>
<script src='http://monozcore-project.googlecode.com/files/screensaver204b.js' type='text/javascript'>
</script></center>

0 Comments

SCREENSAVER BLOG

By : INDOBLOG BLITAR

Membuat Screen saver di blog dengan menggunakan sedikit CSS,,,Mungkin blog akan terkesan hemat energi karena saat tidak di cursor, tidak di aktif screen akan menutup.

Untuk Demonya coba arahkan cursor keluar dari body blog ini atau arahkan ke top browser dan lihat screen savernya.

Berikut kode CSS nya

body .saving{background:#000;position:fixed;z-index:999;width: 100%;top: 0;left:0;height: 100%;-webkit-transition: all 2s;transition: all 2s;font:30px Mistral;color:#ddd;
}
body:hover .saving{opacity:0;height:0;z-index:-999;
}
.judul{display:block;position:relative;text-align:center;margin-top:5%;font:1000% Mistral;color:#222;text-shadow:0 0 10px #fff;
}
.judul:after{background:#ddd;border-radius:100%;padding:30px;position:absolute;top:30px;right:20px;content:'Copy Right By :Cuerosbhelatos';font:30px Mistral;
}

HTML kode

<div class="saving"><div class="judul">Welcome</div></div>

Untuk proses pemasangannya ikuti langkah-langkah berikut:

Login Ke Akun Blog anda
Pada Dasbor Klik Rancangan
Kemudian TAMBAH GADGET Dan Pilih HTML Java/Script
Pastekan Kode diatas Tepat Didalam GADGET tadi.

0 Comments