Membuat Teks Dengan Efek Pelangi

Cara Mempercantik Blog anda adalah dengan memberikan beberapa penambahan agar terlihat lebih menarik, salah satunya adalah dengan membuat teks pelangi,

caranny adalah dengan memasukkan script berikut ini  kedalam Gadget HTML/Javascript pada menu Tata Letak, berikut scriptnya :


<center>
<style typecss="[{http://galihgardhany.blogspot.com}]">
  #highlight{font:bold 50px Impact,Arial,Sans-Serif;}</style>
<script language="javascript" type="text/javascript">
     var teks="MERAH PUTIH HEBAT"
     var speed=20

if (document.all||document.getElementById) {
     document.write('<span id="highlight">' + teks + '</span>')
     var storetext=document.getElementById? document.getElementById("highlight") :
document.all.highlight
} else document.write(text)
var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")

var r=1
var g=1
var b=1
var seq=1

function changetext() {
     rainbow="#"+hex[r]+hex[g]+hex[b]
     storetext.style.color=rainbow
}

function change() {
if (seq==6) {
b--
if (b==0)
seq=1
}
if (seq==5) {
r++
if (r==12)
seq=6
}
if (seq==4) {
g--
if (g==0)
seq=5
}
if (seq==3) {
b++
if (b==12)
seq=4
}
if (seq==2) {
r--
if (r==0)
seq=3
}
if (seq==1) {
g++
if (g==12)
seq=2
}
changetext()
}

function starteffect() {
     if (document.all||document.getElementById)
     flash=setInterval("change()",speed)
}

starteffect()
</script>
</center>

Keterangan :
Yang saya beri tanda merah dapat anda rubah sesuai keinginan anda.

Klik link dibawah ini untuk melihat contoh teks yang saya maksud

DEMO

Semoga Bermanfaat............

***

Baca Selengkapnya >>

Cara Membuat Efek Bintang Bertaburan Pada Kursor

• Langkah Pertama, Login ke account blogger anda

• Langkah ke Dua, Pilih menu Template (Gambar 1, Panah 1), Lalu pilih Edit HTML (Gambar1, Panah 2).

Gambar 1

• Langkah Ketiga, Pada Script area, cari script

, untuk mempermudah pencarian gunakan Ctrl + F, bila sudah di ketemukan letakkan script berikut persis di bawah script tersebut (Gambar 2, Panah Merah),

Gambar 2

Berikut Script dan contohnya : Klik Disini

<script type='text/javascript'>
// <![CDATA[
var colour="#52D8ED";
var sparkles=100;
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="3px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="3px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";
star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}
}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {
tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
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;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>

Keterangan :
Script yang bertanda merah dapat anada ganti dengan Kode Hex warna yang lain.

• Langkah Keempat, pilih Pratinjau Template, bila sudah sesuai dengan yang anda inginkan maka langkah terakhir adalah Simpan Perubahan.

Klik Link DEMO di bawah ini untuk melihat contoh hasilnya

DEMO

Semoga penjelasan saya dapat dimengerti.

Semoga Berguna..............

***

Baca Selengkapnya >>

Membuat Running Text Pelangi Di Blog

• Login ke account Blogger anda. 

• Pilih Menu Tata Letak (Gambar 1, Panah no.1).

Gambar 1

• Plilih Menu Tambah Gadget (Gambar 1, Panah No.2), Posisi running teks berada, nantinya berdasarkan  posisi mana anda menambahkannya (Disarankan pilih Tambahkan Gadget di posisi atas, tepat di bawah Header/Judul Blog anda), posisi ini nantinya masih dapat anda rubah kembali.

• Pilih Gadget HTML/Java Script (Gambar 2, Lingkaran Merah).

Gambar 2

• Konfigurasikan Gadget HTML/Java Script (Gambar 3)

Gambar 3

• Biarkan Judul Gadget Kosong (Gambar 3, Panah no.3),

• Copy Script dibawah ini, untuk kemudian Paste-kan di area Konten (Gambar 3, Panah no.4),  Berikut Script yang harus anda copy :

<div style="background: transparent; border: 2px solid #00000000; color: #7CFC00; font-size: 18px; font-weight: bold; letter-spacing: 0.5em; padding: 15px;">
<marquee direction="left" scrollamount="5" align="center">
<style typecss="[{http://galihgardhany.blogspot.com}]">
  #highlight{font: 20px Impact,Arial,Sans-Serif;}</style>
<script language="javascript" type="text/javascript">
     var teks="Masukkan teks anda disini"
     var speed=20

if (document.all||document.getElementById) {
     document.write('<span id="highlight">' + teks + '</span>')
     var storetext=document.getElementById? document.getElementById("highlight") :
document.all.highlight
} else document.write(text)
var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0")

var r=1
var g=1
var b=1
var seq=1

function changetext() {
     rainbow="#"+hex[r]+hex[g]+hex[b]
     storetext.style.color=rainbow
}

function change() {
if (seq==6) {
b--
if (b==0)
seq=1
}
if (seq==5) {
r++
if (r==12)
seq=6
}
if (seq==4) {
g--
if (g==0)
seq=5
}
if (seq==3) {
b++
if (b==12)
seq=4
}
if (seq==2) {
r--
if (r==0)
seq=3
}
if (seq==1) {
g++
if (g==12)
seq=2
}
changetext()
}

function starteffect() {
     if (document.all||document.getElementById)
     flash=setInterval("change()",speed)
}

starteffect()
</script>
</marquee>
</div>

• Jika Anda kurang puas dengan tampilan running teks tersebut anda dapat memodifikasi Script diatas agar tampilan running text sesuai dengan keinginan, script dengan warna merah diatas adalah script yang dapat anda rubah, dengan keterangan sebagai berikut :

• Untuk merubah kecepatan running text berjalan maka rubahlah nilai Script scrollamount="5" menjadi scrollamount="4" atau scrollamount="6" (lakukan percobaan hingga anda mendapatkan yang sesuai).

• Untuk membesarkan/mengecilkan Font pada running text, rubahlah nilai script  font: 20px menjadi font: 30px atau font: 50px untuk membesarkan font (semakin besar nilainya maka semakin besar fontnya).

• Ganti tulisan Masukkan teks anda disini pada script diatas dengan tulisan anda sendiri yang ingin anda tampilkan pada running text.

• Untuk merubah seberapa cepat perubahan warnanya maka nilai script ini yang harus anda rubah (font yang berwarna merah) var speed=20 

• Bila sudah selesai merubah, jangan lupa untuk menyimpan perubahan.

Untuk melihat contohnya, klik link demo dibawah

DEMO

Semoga Bermanfaat............

***

GG

Baca Selengkapnya >>

Cara Menghilangkan gadget Attribusi

Masuk Ke Account Blogger anda
Pilih Menu Template, lalu pilih Edit HTML,
Pada Code area cari script </Head> gunakan fungsi Ctrl + F untuk mempermudah pencarian
bila sudah menemukan script </Head>, copy kan script berikut ini tepat di bawah </Head> :

<style>
#Attribution1 {
display: none;
}
</style>

Jangan lupa untuk menyimpan perubahan yang telah di buat.

sekarang gadget Attribusi telah hilang dari tampilan Blog anda.

Semoga penjelasan saya tadi bermanfaat..........

***

Baca Selengkapnya >>

Membuat Judul Dan Deskripsi Blog Berada Di Tengah

Pada setiap setingan awal template, posisi judul dan deskripsi selalu pada posisi di sebelah kiri, berikut akan saya jelaskan bagai mana cara merubah judul blog agar berada di posisi tengah.

• Langkah pertama, anda harus masuk ke dalam account blogger yang telah anda miliki. 

• Langkah Kedua, pilih menu Template. (Gambar 1)

Gambar 1

• Langkah Ketiga, klik tombol sesuaikan, (Gambar 1)

• Langkah Keempat, Pada tampilan Perancang Template Blogger, pilih menu Tingkat Lanjut, dengan submenu Tambahkan CSS. (Gambar 2)

Gambar 2

Langkah Kelima, Copy script seperti dibawah ini pada kolom di sebelah kanan (lingkaran hijau pada Gambar 2).

Berikut script yang harus anda copy :

.titlewrapper{text-align:center;}
.descriptionwrapper{text-align:center;}


Langkah Keenam, sebagai langkah terakhir, Klik Tombol Terapkan Ke Blog di pojok kanan atas,


Semoga Bermanfaat.........

 ***

Baca Selengkapnya >>

Resistor

Resistor adalah komponen elektronik dua kutub yang didesain untuk mengatur tegangan listrik dan arus listrik, dengan resistansi tertentu (tahanan) dapat memproduksi tegangan listrik di antara kedua kutubnya, nilai tegangan terhadap resistansi berbanding dengan arus yang mengalir.

Symbol Resistor 

• Fixed Resistor,
  adalah jenis resistor yang memiliki nilai tahanan tetap dengan nilainya yang  sudah tertulis pada badan resistor dengan menggunakan kode warna ataupun angka.

 Symbol fixed resistor

 Resistor dengan nilai tahanan yang tertulis dengan angka

 Resistor yang nilai tahanannya menggunakan kode warna

Cara Membaca nilai tahanan pada resistor yang menggunakan kode warna

 

 

• Variable Resistor (Resistor Tidak Tetap),
  adalah jenis resistor yang memiliki nilai resistansi berubah-ubah secara langsung dengan cara memutar atupun menggeser tuas yang ada. 

 Symbol Variable Resistor

Baca Selengkapnya >>

Membuat, Mengedit, dan Menghapus Label Di Blogspot

Mengatur struktur kategori di blog merupakan hal yang sangat penting untuk diperhatikan. Hal ini karena menyangkut pada pengorganisiran konten dan juga kenyamanan pengunjung. Pengunjung blog anda akan nyaman ketika mengeksplorasi konten di blog anda karena anda tepat mengatur kategorinya. Mereka akan mudah menemukan artikel yang mereka cari.

Di platform Blogger, kategori dinamai dengan Label yang jika di wordpress persis sama seperti tags. Mengatur kategori di blogger tidak sama dengan di wordpress. Kategori di wordpress mudah dibuat secara struktural dan pengindukan karena memang sudah tersedia fiturnya. Di wordpress juga anda bisa mengatur, mengedit, dan menghapus kategori dengan mudah.

Lain halnya dengan Blogger. Di Blogger, untuk mengatur -terutama mengedit dan menghapus- kategori agak sedikit rumit jika anda tidak mengetahui triknya. Bahkan, pada awalnya saya sendiri tidak tahu bahwa ada cara mengedit dan menghapus label di blogger. Oleh karena itu, di sini akan saya bahas tentang cara mengatur, membuat, mengedit dan menghapus label baik untuk satu post ataupun sekaligus banyak post di Blogger.

Membuat Label Baru

 

Untuk membuat label baru, cara pertama adalah dengan mengetikan nama label di pilihan labels dis sidebar kanan ketika anda mengedit atau membuat sebuah post. saya rasa semua blogger sudah tahu cara ini. Namun, apakah anda sudah tahu bagaimana membuat sebuah label yang langsung diintegrasikan untuk banyak posting?.

Begini caranya..

Pertama, buka halaman daftar post dengan mengklik menu “Posts” di sidebar kiri. Setelah itu, tandai/ceklis posting yang mana saja yang ingin anda tambahkan labelnya -seperti pada gambar diatas-. klik ikon di samping bacaan “Revert to draft”. Lalu klik “New label”. Akan muncul sebuah kotak dialog, lalu ketikan nama label yang anda inginkan. Saya mengetikkan label “testing” karena ini sebagai contoh saja. Selesai, dan label baru telah terbuat.

Mengedit dan Menghapus Label

 

Sebenarnya, di blogger anda tidak bisa mengedit sebuah label yang sudah anda buat. Secara teknis, anda hanya bisa membuat dan menghapusnya. Namun, hal ini tidak menjadi penghalang bagi anda jika anda ingin mengganti nama label.
Untuk menghapus sebuah label, cara pertama adalah dengan tidak mengintegrasikan posting apapun di blog anda dengan sebuah label. Jadi, dengan mengosongkan label tersebut dari posting secara otomatis label akan terhapus. Namun, cara ini lama karena anda harus mengedit satu-persatu posting dengan label tertentu dan menghapus label itu.
Jika anda ingin menghapus label sekaligus banyak, langkah pertama adalah dengan memfilter atau menyaring daftar posting dengan label terpilih seperti yang terlihat pada gambar dibawah. Caranya adalah dengan memilih label di pojok kanan atas disamping form pencarian. Setelah itu, ceklis semua post yang ada. Klik ikon label di samping bacaan “Publish”. Lalu, akan keluar dropdown label dan klik nama label yang tadi anda filter/saring postingannya. Di gambar saya memilih label testing karena label itulah yang akan saya hapus. Setelah anda mengkliknya, label tersebut akan terhapus.

Lalu, bagaimana dengan mengedit label ?. Pertama hapuslah label yang ingin anda edit dengan cara diatas, kemudian buatlah label baru yang namanya mirip dengan cara pertama tanpa anda harus menghilangkan tanda ceklis pada postingannya terlebih dahulu.Nah, begitulah caranya. Saran saya, berhati-hatilah dalam mengatur struktur label di blog anda karena kesalahan dalam penamaan label bisa berakibat yang cukup parah pada blog anda.


 SUMBER

Baca Selengkapnya >>

Bagaimana Cara membuat Read More otomatis di blogspot

 

 

 

 

Bagaimana Cara membuat Read More otomatis di blogspot?

Cara membuat read more otomatis di blogspot sangat mudah. Sebelum melangkah  ke cara membuat read more otomatis di blogspot lebih baik kita tahu apa itu read more? dan apa fungsi read more? Read more dalam bahasa indonesia yaitu " Baca Selengkapnya " dan fungsi read more itu sendiri adalah meminimalis penggunaan halaman blog agar terlihat lebih rapi dan menarik. Read more otomatis ini akan memotong tampilan depan artikel yang panjang dan anda bisa menentukan berapa banyak huruf yang akan ditampilkan di halaman depan, begitu pengunjung membuka Read more atau baca selengkapnya barulah pengunjung bisa membaca artikel penuh blog anda. Sekarang lanjut ke langkah cara membuat read more otomatis di blogspot.

Langkah-langkah cara membuat Read More Otomatis di Blogspot

• Login ke Blog anda
• Buka halaman design > Edit HTML > centang Expand template widget
• Cari kode </head> gunakan CTRL + F untuk mempermudah pencarian
• Paste kode berikut tepat dibawah </head>

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://script-bamz-us.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>

• Selanjutnya cari kode <data:post.body/> atau <p><data:post.body/></p>  ( seperti biasan gunakan CTRL + F untuk mempermudah pencarian. Jika ditemukan 2 kode yang sama, gunakan atau ganti yang pertama.
• Jika sudah ketemu silahkan anda ganti kode tersebut dengan kode dibawah ini

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>Baca Selengkapnya >> </a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

• Finish simpan template dan lihat hasilnya

Cara membuat Read More otomatis di Blogspot ini bisa anda rubah sebagian. Yang bisa dirubah adalah berwarna merah saja dan berikut ini adalah keterangannya :

1. summary_noimg = 430; apabila artikel anda tanpa gambar satupun maka yang akan tampil pada halaman depan adalah 430 huruf
2. summary_img = 340; apabila artikel anda berisi gambar maka yang akan tampil pada halaman depan adalah 340 huruf dan gambar
3. img_thumb_height = 100; ini adalah ukuran tinggi gambar / thumbnail yang akan muncul di halaman depan
4. img_thumb_width = 120; sedangkan yang ini adalah lebar gambar / thumbnail di halaman depan.
5. Anda juga bisa mengubah Baca Selengkapnya >> dengan kata-kata lain sesuai keinginan anda
   

Semoga artikel cara membuat read more otomatis di blog ini bermanfaat. Selamat mencoba dan semoga berhasil.


BAMZ

Baca Selengkapnya >>