• © Andri Apriadi

    Bandung paris van java jadi dayeuh kalahiran 13.04.1989 sarta jadi dayeuh favorit, eta nurut keun kuring kumaha kalayan nurut keun anjeun..?? Kalayan gender lalaki, teu kasep sarta henteu goreng, eta pisan kuring. Saurang lalaki anu pinuh jeung rasa tanggung jawab ka kulawarga. Kabeh eta henteu di pibanda kalayan gampang perlu wayah sarta sajarah anu panjang sarta bulat beulit pikeun sanggup hirup ti leuleutik nepi ayeuna..

    read-more
  • Steve Vai

    Date of birth: Jun 6, 1960. Place of birth: New York. Musical Genres: Hard rock, Heavy metal, Instrumental rock, Progressive rock, Neo-classical metal, Experimental rock, Progressive metal, Jazz fusion. Steven Siro "Steve" Vai (born June 6, 1960) is a three time Grammy Award-winning Italian-American rock guitarist, songwriter, vocalist and producer. After starting his professional career as a music transcriptionist for Frank Zappa, Vai recorded and toured in Zappa's band for two years, from 1980 to 1982. The guitarist began a solo career in 1983 and has released 13 solo albums as of 2008.

    read-more
  • Paul Gilbert

    Date of birth: Nov 6, 1966. Place of birth: Carbondale, Illinois, United States of America. Musical Genres: Heavy metal, Instrumental rock, Speed metal, Hard rock, Progressive metal, Power pop, Thrash metal, Neo-classical metal. Paul Brandon Gilbert (born November 6, 1966 in Illinois, USA) is an American guitarist. He is well known for his guitar work with Racer X and Mr. Big, as well as many solo albums. He also joined Joe Satriani and John Petrucci on the 2007 G3 tour. He has been voted number 4 on a list in GuitarOne magazine of the "Top 10 Greatest Guitar Shredders of All Time", as well as a spot in Guitar World's 50 Fastest Guitarists of All Time list.

    read-more
  • Joe Satriani

    Date of birth: Jul 15, 1956. Place of birth: Westbury, New York, United States of America. Musical Genres: Hard rock, Instrumental rock, Jazz fusion, Blues, Heavy metal, Neo-classical metal. Joseph "Joe" Satriani (born July 15, 1956 in Westbury, New York) is an Italian American multi-instrumentalist, known primarily for his work as an instrumental rock guitarist, with multiple Grammy Award nominations. Early in his career, Satriani worked as a guitar instructor, and some of his former students have achieved fame with their guitar skills (Steve Vai, Larry LaLonde, Kirk Hammett, Andy Timmons, Charlie Hunter, Kevin Cadogan, Alex Skolnick). Satriani has been a driving force in the music credited to other musicians throughout his career.

    read-more
  • Yngwie Malmsteen

    Date of birth: Jun 30, 1963. Place of birth: Stockholm. Musical Genres: Neo-classical metal, Power metal, Hard rock , Heavy metal, Speed metal, Glam metal. Yngwie Johann Malmsteen (English pronunciation: /ˈɪŋveɪ ˈmɑːlmstiːn/ ING-vay MAHLM-steen; born June 30, 1963) is a Swedish guitarist, composer, multi-instrumentalist and bandleader. Malmsteen became famous and very influential for his neo-classical approach in heavy metal music. He is often considered one of the most talented rock guitarists of all time and is considered to be a pioneer of shred guitar. Malmsteen was born Lars Johan Yngve Lannerbäck in Stockholm, Sweden, as the third child of a musically-inclined family.

    read-more
  • John Petrucci

    Date of birth: Jully 12, 1967. Place of birth: Kings Park. Place Musical Career Began: Kings Park, New York, United States of America. Musical Genres: Instrumental rock, Progressive metal, Progressive rock, Jazz fusion, Neo-classical metal. John Peter Petrucci (born July 12, 1967) is an American guitarist and songwriter best known as a founding member of the progressive metal band Dream Theater. Along with his former bandmate Mike Portnoy, he has produced all Dream Theater albums since their 1999 release, Metropolis Pt. 2: Scenes from a Memory. He is also a backing vocalist for Dream Theater. Petrucci was named as the third player on the G3 tour six times, more than any other invited guitarist.

    read-more
Previous Next

Cocoretan Orang Sunda

Tampilkan postingan dengan label Trik Blog. Tampilkan semua postingan

Tahukah apa itu Snap Shot? Bagi para pengguna blog ber-platform Wordpress tentu akan sering menemuinya, karena itu adalah salah satu fitur blog yang disediakan Wordpress. Kembali ke pertanyaan tadi, Snap Shots adalah semacam screen shoot suatu Website ketika kursor mouse diarahka pada suatu link (kira-kira seperti itulah jawabannya). Blogger/blogspot memang tidak memiliki fasilitas ini, namun kita bisa membuatnya sendiri. 
Untuk membuatnya, berikut langkah-langkahnya:



  1. Loginlah ke Blogger anda, kemudian Klik Disini
  2. Pada bagian itu kita bisa melakukan pengaturan untuk snap shots, mulai dari tema (theme), logo, dan bahasa (language) yang akan digunakan. Jika anda tidak ingin mengaturnya klik Skip.
  3. Lalu akan tampil account Info. Isilah data yang ada secara lengkap, dan jangan lupa beri tanda checklist pada opsi I agree to Terms & Condition Above.
  4. Klik Continue
  5. Setelah Tampil Halaman Instal Snap Shots on Blogger, klik tombol INSTALL NOW
  6.  Lalu akan tampil halaman Add Page Element. Anda klik pada ADD WIDGET, maka secara otomatis page elements Anda akan bertambah.
Sekarang cobalah akses blogspot anda, dan arahkan kursor pada suatu link, jika muncul screen shoot maka pengaturan anda berhasil.

Read More

Pertanyaan diatas pernah ditanyakan oleh salah satu sahabat blogger pada shoutbox, Random photo pada profile yaitu cara mengubah gambar secara bergantian ketika halaman tersebut di-Refresh atau di reload ulang. Jadi gambar tersebut tidak hanya itu-itu saja tapi bisa tampil gambar yang lain sesuai dengan keinginan kita. lebih jelasnya lihat gambar porfile saya yang selalu berubah-ubah.Untuk menjawab pertanyaan yang sama oom posting disini saja ya. codenya selengkapnya bisa dilihat dibawah ini.
Contoh Script :
Tuju ke halaman edit HTML kemudian beri tanda centang pada kotak Expand Widget Templates. kemudian cari kode di bawah ini:
<b:if cond='data:photo.url != ""'>
<a expr:href='data:userUrl'><img class='profile-img' expr:alt='data:photo.alt' expr:height='data:photo.height' expr:src='data:photo.url' expr:width='data:photo.width'/></a>

Ganti kode yang tercetak tebal di atas dengan kode javascript di bawah ini:
<script>
var pic, alt;
pic = new Array;
pic[0] = “PHOTO-URL“;
pic[1] = “PHOTO-URL“;
alt = new Array;
alt[0] = “My Photo”;
alt[1] = “My Photo”;
var now = new Date();
var seed = now.getTime() % 0xffffffff;
function rand(n) {
seed = (0x015a4e35 * seed) % 0x7fffffff;
return ( seed >> 16 ) % n;
}
var num = rand(2);
document.write(“<a href=’http://www.blogger.com/profile/XXX‘><img alt=’” + alt[num] + “‘ border=’0′ class=’profile-img’ height=’80′ src=’” + pic[num] + “‘ width=’60′/></a>”);
</script>
Perhatikan pada kode yang ditandai dengan huruf tebal. Ganti PHOTO-URL dengan URL foto kamu sendiri, kemudian pada kode var num = rand(2);, angka 2 mewakili jumlah array yang kita buat. Pada contoh di atas berarti ada 2 array, 0 dan 1. Dan selanjutnya ganti kode XXX dengan 20 angka (untuk New Blogger) yang ada pada profil blogger kalian masing-masing.
Sedikit menambahkan jika kalian ingin memodifikasi 6 gambar yang berbeda codenya bisa dilihat di bawah ini
<script>
var pic, alt;
pic = new Array;
pic[0] = “PHOTO-URL”;
pic[1] = “PHOTO-URL”;
pic[2] = “PHOTO-URL”;
pic[3] = “PHOTO-URL”;
pic[4] = “PHOTO-URL”;
pic[5] = “PHOTO-URL”;
alt = new Array;
alt[0] = “My Photo”;
alt[1] = “My Photo”;
alt[2] = “My Photo”;
alt[3] = “My Photo”;
alt[4] = “My Photo”;
alt[5] = “My Photo”;
var now = new Date();
var seed = now.getTime() % 0xffffffff;
function rand(n) {
seed = (0x015a4e35 * seed) % 0x7fffffff;
return ( seed >> 16 ) % n;
}
var num = rand(6);
document.write(“<a href=’http://www.blogger.com/profile/XXX’><img alt=’” + alt[num] + “‘ border=’0′ class=’profile-img’ height=’80′ src=’” + pic[num] + “‘ width=’60′/></a>”);
</script>

Read More

Masuk halaman Edit HTML kemudian beri tanda centang pada Expand Template Widget, cari kode warna hijau di kemudian masukan sesuai kode warna merah dibawah:
<b:include data='top' name='status-message'/>
<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<a expr:href='data:post.url'>
<img alt='&gt;&gt;&gt;' border='0' src='http://bp1.blogger.com/_C6KkooKXCEw/SJGrot7UiiI/AAAAAAAACFw/
8XPCqtzzzs4/s400/dotlink.gif'/>
<data:post.title/></a><br/><br/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

Read More

Pertama cari #sidebar-wrapper li{ pada deretan kode CSS, kemudian masukan sesuai kode warna hijaudibawah:
#sidebar-wrapper li {background:url("http://bp1.blogger.com/_C6KkooKXCEw/SJGrot7UiiI/
AAAAAAAACFw/8XPCqtzzzs4/s400/dotlink.gif") no-repeat 0px .20em; margin:0; padding:0 0 .25em 17px; line-height:1.2em}

Read More

Pertama cari #sidebar-wrapper h2{ pada deretan kode CSS, kemudian masukan sesuai kode warna hijaudibawah:
#sidebar-wrapper h2{ background: url("http://bp1.blogger.com/_C6KkooKXCEw/SJGrot7UiiI/AAAAAAAACFw/
8XPCqtzzzs4/s400/dotlink.gif") 0px 0px no-repeat; margin:.6em 0 .6em; padding:0 20px; font-size:11px; font-weight:bold; line-height:1.4em; text-transform:uppercase; color:#222; border-bottom:1px solid #C0C0C0}

Read More

Kadang mungkin kita ingin menggunakan default feed sebagai RRS, caranya masuk halaman Edit HTML, Kemudian cari kode warna hijau dibawah
<b:includable id='feedLinksBody' var='links'>
<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'> <data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>
</b:includable>
Ganti kode warna hijau dengan kode dibawah ini:
<a class='feed-link' expr:href='data:f.url + "?alt=rss"' type='application/rss+xml' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>

Read More

Spoiler, itulah satu kata yang bisa kita gunakan untuk menghemat halaman posting jika temen - temen menggunakan gambar yang memiliki size besar, lho apa hubunya sama size?? ada hubunganya! karna spoiler bekerja menyembunyikan gambar jadi saat halaman kita terjadi proses load gambar kita yang tersembunyi tersebut tidak ikut melakukan proses load. Tips membuat spoiler ini, selain untuk mempercepat load halaman, bisa juga membuat pengunjung blog anda penasaran.

<div id="spoiler"><div><div id="show" color="transparent" style="border-style: solid; border-width: 1px; margin: 0px; padding: 4px; display: none; width: 98%;"></div><div id="spoiler"><div><input value="Show Spoiler!" style="margin: 10px; padding: 0px; width: 100px;font-size:12;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'Hide Spoiler!'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'Show Spoiler!'; }" type="button"><br/><div id="show" style="border-style: solid; border-width: 0px; margin: 0px; padding: 4px; display: none; width: 98%;color:black;">
Alamat gambar
</span></div></div></div></div></div> 

Selamat Mencoba....

Read More

Oke deh, sekarang waktunya berbagi tips untuk membuat Show/Hide ato Spoiler di Blogger tersayang. Hehehehe Caranya gampang kok. Coba deh ikutin :


.commenthidden {display:none;}
.commentshown {display:inline;}



1. Copy paste kode di atas sebelum kode ]]></b:skin>
2. Selanjutnya Copy paste kode di bawah ini sesudah kode ]]></b:skin>


<script type='text/Javascript'>function togglecomments (postid) {var whichpost = document.getElementById(postid);if (whichpost.className=="commentshown") {whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }} </script>


3. Save dlu brad...
4. Setiap kalian ingin menggunakan Show/Hide ato Spoiler kalian harus memasukkan kode di bawah ini di postingann.


<a aiotitle="click to expand" href="javascript:togglecomments('Nama_Spoiler')"><img src="http://i1232.photobucket.com/albums/ff362/AndriiJrs/Uncategoriez/show-hide.png" /></a><div class="commenthidden" id="Nama_Spoiler">Gambar/Tulisan di sini</div>


Keterangan : 
"http://i1232.photobucket.com/albums/ff362/AndriiJrs/Uncategoriez/show-hide.png"
"Gambar/Tulisan di sini"
Bisa kalian ganti dengan kode yang kalian mau.
Selamat mencoba....

Read More

Di postingan  yang keseratus ini, saya akan berbagi tutorial yang lumayan masih fresh dan menarik yaitu cara membuat Recent Post Dengan Gaya Scrolling. Berbeda dengan Recent Post yang telah dibuat terdahulu yaitu Recent Post dengan gaya Slide Show dan Recent Post di sertai Gambar. klik disini untuk melihat contoh.


One Step

1. Login ke akun Blog anda
2. Pilih Rancangan
3. Pilih Elemen Laman
4. Pilih Tambah Gadget 
5. Pilih HTML/Javasript

Masukan Scipt di bawah ini:

 <style type="text/css">
ul { cursor: pointer;  text-shadow: 0 1px 1px rgba(0,0,0,.3);  -webkit-border-radius: .5em;  -moz-border-radius: .5em;  border-radius: .5em;  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);  -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);  box-shadow: 0 1px 2px rgba(0,0,0,.2); background:; list-style-image: url(http://i1232.photobucket.com/albums/ff362/AndriiJrs/rss-1.png)}
ul a{text-decoration:none;}
ul a:hover {background:;text-decoration:none; color: red;"}
</style>

<marquee behavior="scroll" direction="up" scrollamount="2" onmouseover="this.stop()" onmouseout="this.start()">
<script>
function rp(json) {
document.write('<ul>');
for (var i = 0; i < numposts; i++) {
document.write('<li>');
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
posttitle = posttitle.link(posturl);
var readmorelink = "(more)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";
if ("content" in entry) {
var postcontent = entry.content.$t;
} else if ("summary" in entry) {
var postcontent = entry.summary.$t;
} else
var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
document.write(posttitle);
if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
if (showpostsummary == true) {
if (postcontent.length < numchars) {
document.write(postcontent);
} else {
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...' + readmorelink);
}
}
document.write('</li>');
}
document.write('</ul>');
}
</script>

<script>
var numposts = 500;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
</script>

<script src="http://www.andriicreative.co.cc/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script></marquee>




Keterangan: Warna Merah di Scipt
- http://i1232.photobucket.com/albums/ff362/AndriiJrs/rss-1.png  Ganti gengan URL Gambar anda.
- 2  Kecepatan Scolling
- 500  Jumlah post yang akan di tampilkan
- http://www.andriicreative.co.cc  Ganti dengan alamat URL Blog anda.
                  

Read More

Icon Back to top yang dulu pernah fenomenal ini, sekarang kita akan bahas kembali. Icon back to top ini sangat berguna untuk melakukan lompatan dari halaman paling bawah menuju halaman paling atas, jadi temen - temen tidak perlu lagi melakukan scrollbar pada browser. Untuk melihat contoh klik disini Icon back to top ada di pojok kanan bawah.

Langsung aja menuju blog anda masing - masing :

1. login
2. Pilih Tata Letak
3. Silahkan tuju pada halaman edit HTML.
4. kemudian letakan kode dibawah ini diatas tag </body>



<a href='#' style='display:scroll;position: fixed; bottom:5px;right:5px;' title='Back to Top'><img src='http://i1232.photobucket.com/albums/ff362/AndriiJrs/down_arrow_48-1.png'/></a>

5. Simpan Temlate

Mau edit :
  • Jika anda ingin megatur jarak image silahkan edit di bagian kode: 5px;right:5px; Anda juga bisa
  • Mengganti posisi images dengan menganti position: fixed; dengan position: absolute; position: relative; dan position: static;
Jika ada pertanyaan seputar cara membuat  Back to top silahkan komentar :)
Selamat mencoba....

Read More

Tulisan kali ini masih tentang trik Blogspot, yaitu tentang navigasi nomor halaman pada Blogspot. Pada template Blogspot umumnya menggunakan navigasi Previous dan Next pada bagian bawah, yang membantu pembaca untuk berganti halaman menuju tulisan sebelum atau setelah dari tulisan yang sedang dibaca tanpa ada keterangan nomor halaman.
Pembuatan navigasi nomor halaman ini memiliki cara yang sama dengan trik Blogspot sebelumnya yaitu melakukan beberapa modifikasi pada template HTML seperti trik membuat Table Of Contents, Spoiler, Artikel Terkait, dan trik Blogspot lainnya.
Berikut adalah langkah-langkah membuat navigasi nomor halaman (kode script modifikasi ini dibuat oleh Abu Farhan dan Muhammad Rias).
Pertama kita masuk menu Layout dan Edit HTML, jangan lupa Backup!! dulu template blog kita. Setelah kita backup, selanjutnya cari script berikut.

]]></b:skin>
Kemudian masukan script dibawah ini tepat di atas script yang kita cari tadi.
 
.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
<span class="IL_AD" id="IL_AD8">border</span>: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}



Script di atas adalah script Style (CSS), yang menentukan bentuk visual dari nomor halaman yang akan kita buat.
Selanjutnya kita cari script kedua yaitu seperti di bawah ini.

</body>

Kemudian masukan script berikut tepat di atas script tadi.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>


Kode pageCount di atas menunjukkan jumlah tulisan/posting/artikel yang akan ditampilkan dalam satu halaman, sedangkan displayPageNum menunjukkan jumlah nomor halaman yang ditampilkan (jika diisi dengan angka 7 berarti nomor halaman yang muncul ada 8, ditambah satu untuk halaman satu). upPageWord mengarahkan kita ke halaman yang lebih baru (tulisan Previous bisa diganti sesuai dengan keinginan), dan downPageWord mengarahkan ke halaman yang lebih lama (tulisan Next bisa diganti sesuai dengan keinginan).
Setelah itu kita simpan template kita.
Terakhir kita cari script berikut ini (jangan lupa untuk mengklik Expand Widget Templates-nya).

'data:label.url' 

Ganti script tersebut dengan script di bawah ini.
'data:label.url + &quot;?&amp;max-results=5&quot;'

Fungsi dari script ini adalah untuk mengganti default (standar) Blogspot yang akan menampilkan 20 posting setiap halamannya, karena pada pageCount di atas kita isi 5, maka pada script ini pun juga diisi dengan 5 (menampilkan 5 posting per halaman).
Simpan template kita, dan kita coba lihat hasilnya dengan membuka blog kita. Jika berhasil maka pada halaman Home blog kita akan muncul nomor halaman setelah posting terakhir (paling bawah).


Itu tadi temen-temen informasi yang bisa saya sampaikan tentang pembuatan navigasi nomor halaman pada Blogspot. Selamat mencoba, dan semoga bermanfaat.

Read More

Temen-temen mungkin pernah melihat tulisan dalam website atau forum dimana bagian beberapa bagian dalam tulisannya tidak muncul tapi diganti dengan link shortcut untuk memunculkan bagian yang disembunyikan tersebut (misalnya buat yang biasa membuka Kaskus pasti sering melihat ikon Spoiler, dimana saat kita klik ikon tersebut maka akan muncul gambar atau tulisan yang disembunyikan).

Tulisan saya kali ini berkaitan dengan Spoiler (dalam tulisan ini saya menganggap Spoiler = menyembunyikan dan menampilkan bagian tulisan) tersebut, hanya saja kita menerapkan Spoiler tersebut dalam Blogspot. Dengan adanya Spoiler ini kita bisa menghemat tempat pada tulisan kita (kita dapat menyembunyikan bagian tertentu dalam tulisan yang panjang, jika pembaca ingin melihat maka pembaca dapat mengklik shortcut Spoiler ini untuk melihatnya). Spoiler ini sendiri mirip dengan Read more, hanya saja Read more muncul pada halaman Home atau halaman Kategori tertentu, sedangkan Spoiler ini bermanfaat saat membuka halaman tulisan tertentu.
Untuk lebih jelasnya, berikut saya informasikan langkah-langkah pembuatannya.
Pertama kita masuk ke panel Edit Html, pada menu Layout, jangan lupa aktifkan Expand Widget Templates, kemudian cari tag < /head >.

.


Kemudian masukkan script berikut ini di atas tag < /head >, klik Preview (jika Preview blog kita muncul berarti script kita sudah benar, sebaliknya jika tidak muncul alias error, silakan cek kembali apakah ada script yang terlewatkan). Simpan templates jika sudah benar.

<style type='text/css'>
.spoilerhide {display:none}
.spoilershow {display:inline}
</style>
<script type='text/Javascript'>
function spoiler (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=='spoilershow')
  { whichpost.className='spoilerhide'; } else
  { whichpost.className='spoilershow'; }
} </script>



 Langkah berikutnya adalah memasang script lain pada tulisan yang kita buat dan ingin kita pasangi Spoiler. Untuk pemasangan script ini kita tentukan dulu bagian mana dari tulisan yang ingin kita sembunyikan terlebih dahulu, setelah itu kita masuk ke mode Edit HTML. Selanjutnya kita masukkan script berikut ini. Bagian yang akan kita sembunyikan berada di tengah script yang kita pasang ini (Bagian yang disembunyikan). Link title sendiri kita isi dengan nama link shortcut.

<a href="javascript:spoiler('Spoiler')" title="click to expand">Click here to view more</a>
<div class="spoilerhide" id="Spoiler">

Bagian yang disembunyikan
</div>


Gambar berikut adalah tulisan dalam Blogspot sebelum dipasang script Spoiler.

Gambar berikut adalah tulisan yang sama tapi sudah dipasangi script Spoiler. Dalam tulisan ini bagian Key Features tidak terlihat tapi ada tambahan shortcut Click here to view more. Saat kita klik shortcut tersebut maka otomatis Key Features akan muncul, dan saat kita klik kembali shortcut tersebut, maka Key Features akan disembunyikan kembali.


Bagian tulisan yang kita sembunyikan bisa berupa teks ataupun gambar. Untuk contoh langsung, temen-temen bisa mencoba mengklik short cut di bawah ini.

Demo (Spoiler berisi teks Link dan gambar)

Read More

Ini Scipt nya

 <script language='javascript'>

aBold = false;

numposts=100;

maxshowresult=20;

home_page = "http://www.tutorial-share.co.cc/";

</script>

<script type='text/javascript'>

//<![CDATA[

var postTitlear=new Array();var postUrlar=new Array();var postCommentar=new Array();var totalpost;document.write("<ul>");function showrecentposts(j){var a=j.feed.entry.length;totalpost=a;for(var f=0;f<a;f++){var h=j.feed.entry[f];var c=h.title.$t;var b;var g;if(f==j.feed.entry.length){break}for(var d=0;d<h.link.length;d++){if(h.link[d].rel=="alternate"){g=h.link[d].href;break}}for(var d=0;d<h.link.length;d++){if(h.link[d].rel=="replies"&&h.link[d].type=="text/html"){b=h.link[d].title.split(" ")[0];break}}c=(aBold)?"<b>"+c+"</b>":c;postTitlear.push(c);postUrlar.push(g);postCommentar.push(b)}sortPosts();for(var f=0;f<maxshowresult;f++){var e='<li><a href="'+postUrlar[f]+'" class="recent-link">'+postTitlear[f]+" ("+postCommentar[f]+" comments)</a>";document.write(e)}}function sortPosts(){function c(d,f){var e=postTitlear[d];postTitlear[d]=postTitlear[f];postTitlear[f]=e;var e=postUrlar[d];postUrlar[d]=postUrlar[f];postUrlar[f]=e;var e=postCommentar[d];postCommentar[d]=postCommentar[f];postCommentar[f]=e}for(var b=0;b<postTitlear.length-1;b++){for(var a=b+1;a<postTitlear.length;a++){if(parseInt(postCommentar[b])<parseInt(postCommentar[a])){c(b,a)}}}}document.write('<script src="'+home_page+"feeds/posts/default?max-results="+numposts+'&orderby=published&alt=json-in-script&callback=showrecentposts"><\/script>');

//]]>

</script>
Selamat mencoba

Read More

1. Login Blogger
2. Pilih Rancangan
3. Pilih Tambah Gadget
4. Pilih HTML/JavaScript
5. Masukan kode dibawah ini :

 <script src="http://pendiari.fileave.com/burung.js" type="text/javascript">

6. Simpan dan lihat hasilnya....

Read More

begini cara membuatnya :

1. Login ke blogger
2. Pilih Rancangan
3. Pilih Edit HTML
4. Centang kotak kecil Expand Template Widget
5. Backup template anda dengan mengklik link Download Full Template untuk jaga-jaga kalo terjadi kesalahan, anda bisa menggunakan template yang sebelumnya.

6. Cari kode

]]></b:skin> lalu pastekan kode dibawah ini diatas kode ]]></b:skin>

.author-comments {
background: #ffffff;
border: 2px solid #666666;
padding: 5px;
} 


7. Cari kode <dd class='comment-body'> lalu letakan kode dibawah ini diatas kode tsb.

<b:if cond='data:comment.author == data:post.author'>
<dd class='author-comments'>
<p><data:comment.body/></p>
</dd>
<b:else/>

8. Setelah itu cari kode <dd class='comment-footer'> lalu pastekan kode dibawah diatas kode tersebut.

</b:if>

9. Sehingga kode keseluruhannya seperti ini :

    <b:if cond='data:comment.author == data:post.author'>
    <dd class='author-comments'>
    <p><data:comment.body/></p>
    </dd>
    <b:else/>
    <dd class='comment-body'>
    <b:if cond='data:comment.isDeleted'>
    <span class='deleted-comment'><data:comment.body/></span>
    <b:else/>
    <p><data:comment.body/></p>
    </b:if>
    </dd>
    </b:if>
    <dd class='comment-footer'>
    <span class='comment-timestamp'>
    <a expr:href='"#comment-" + data:
    comment.id' title='comment permalink'>
    <data:comment.timestamp/>
    </a>
    <b:include data='comment' name='commentDeleteIcon'/>
    </span>
    </dd>
    </b:loop>
    </dl>

10. Kode yang berwarana kuning adalah kode yang ditambahkan

11. Silakan kamu ganti kode yang berwarna merah agar sesuai dengan template blog kamu.

Selamat mencoba

Read More

Untuk teman2 yg mau tau caranya baik yg pemula maupun bukan, saya cuma mau sharing trik.
Caranya seperti ini :

1. Persiapkan gambar sesuai selera kamu dan untuk dijadikan banner kamu nanti.
2. Upload foto kamu di situs web yg bisa mengupload foto.
3. Setelah kamu upload dan simpan, buka blogger kamu (sign in) lalu masuk ke menu tata letak lalu klik tambah gadget lalu klik html/javascript.
4. Setelah kamu temui html kosong, silahkan copy-paste link dibawah ini :

 a. utk membuat banner/picture banner :


<center>
<a href="http://s465.photobucket.com/albums/rr20/blogmu/For%20Blog/?action=view&current=Favicon1.gif" target="_blank"> <img border="0" alt="Favicon1" src="http://i465.photobucket.com/albums/rr20/blogmu/For%20Blog/Favicon1.gif"/> </a>


 b. utk membuat kotak banner html:

<center>
<textarea cols="22" name="textarea"> <a href="http://blogmu"> <img src="http://i465.photobucket.com/albums/rr20/blogmu/For%20Blog/Favicon1.gif"/> </a> </textarea> </center> </center>

Keterangan : Warna biru ganti dengan url anda

5. Klik Simpan.

Read More

Kamu yang bosan dengan tampilan blog kamu yang gitu" aja. sekarang saya akan membagi pengalaman saya sedikit tentang cara memberikan efek Tulisan Berjalan pada blog kamu. ikuti cara berikut ini ya....!!!!!

- Sign in blogger kamu
- Pilih tata letak lalu pilih dan plih tambah Gadget
-HTML/JavaScript 
- lalu paste kode-kode berikut ini sesuai dengan keinginan anda....
Contoh MARQUEE dasar :

Kalimat Anda

Berjalan dari kanan ke kiri tanpa pembatas


<marquee>Kalimat Anda</marquee>

Berjalan dari kiri ke kanan tanpa pembatas

Kalimat Anda

Cara menulisnya :


<marquee direction="right">Kalimat Anda</marquee>


Berjalan Kekanan dan kekiri tanpa pembatas

Kalimat Anda

Cara menulisnya :

<marquee behavior="alternate">Kalimat Anda</marquee>


Berjalan dari kanan ke kiri, tapi akan berhenti saat mouse berada diatas tulisan tersebut

Kalimat Anda

Cara menulisnya :

<marquee onmouseover="this.stop()" onmouseout="this.start()">Kalimat Anda</marquee>


Ini contoh marquee kanan kiri dengan kecepatan yang bisa di atur dengan menambahkan perintah "Scrollamount"

Kalimat Anda

Cara menulisnya :

<marquee behavior="alternate" scrollamount="18">Kalimat Anda</marquee>

Anda bisa mengatur kecepatan sesuai selera anda dengan mengganti value atau angka pada kata scrollamout

Teks Anda

Cara menulisnya :

<marquee direction="up">Teks Anda</marquee>


Teks Anda

Cara Menulisnya :

<marquee direction="down">Teks Anda</marquee>


Teks Anda

Cara menulisnya :

<marquee direction="up" behavior="alternate" scrollamount="18">Teks Anda</marquee>


Kalau sekarang marquee dengan pembatas biasanya untuk kata/kalimat yang berurutan, agar tidak terlalu memakan tempat, bergerak keatas dan akan berhenti saat mouse anda berada diatasnya

Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda


Cara menulisnya :

<marquee direction="up" onmouseover="this.stop()" width="200" scrollamount="3" onmouseout="this.start()" height="100">Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br></marquee>

Ini kalau ke bawah dan "bablas" aja walaupun mouse anda berada diatasnya (tanpa kode muoseover....)

Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda


Cara menulisnya :

<marquee direction="down" width="200" scrollamount="4" height="100">Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br></marquee>

Ini dengan perintah "center" agar tulisan berada di posisi tengah form/bingkai :

Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda
Kalimat Anda


Cara menulisnya :

<center><marquee direction="up" onmouseover="this.stop()" width="200" scrollamount="1" onmouseout="this.start()" height="100">Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br>Kalimat Anda<br></marquee></center>

Nah mudah bukan ???

Silahkan untuk bentuk dan model, anda tentunya bisa bereksperimen sendiri.
Bahkan gambar-pun bisa anda beri efek marquee......

Gampang kq... tinggal ketik beres dah...!!
Selamat mencoba, mudah-mudahan bermanfaat. Jangan lupa ajari teman-teman yang belum bisa.. C U BYE.

Read More

Kali ini saya mau bagi" kode Javascript buat kalian smua yang suka memperindah tampilan Blognya,
Dibawah ini adalah kode Javascipt untuk menghiasi tampilan cursor pada mouse.

Langkah Pertama
1. Masuk ke halaman Dashbord
2. Masuk ke Rancangan klik Elemen Laman
3. Pilih Tambah Gadget
4. Pilih HTML/JavaScript
5. Masukan kode di bawah ini
6. Simpan atau Save

<script>
//mouse
//Circling text trail- Tim Tilton
//Website: http://Kikiyo.co.cc/
//for this script and more
function cursor_text_circle(){
// Tulis Kreasi mu Dibawah ini
var msg='Terima Kasih'.split('').reverse().join('');

var font='Times New Roman';
var size=3; // up to seven
var color='#ff0000';

// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 for just plain rotation w/out drag
var speed=.2;

// This is the rotation speed, set it negative if you want
// it to spin clockwise
var rotation=-.2;

// Alter no variables past here!, unless you are good
//---------------------------------------------------


var ns=(document.layers);
var ie=(document.all);
var dom=document.getElementById;
msg=msg.split('');
var n=msg.length;
var a=size*13;
var currStep=0;
var ymouse=0;
var xmouse=0;
var props="<font face="+font+" color="+color+" size="+size+">";

if (ie)
window.pageYOffset=0

// writes the message
if (ns){
for (i=0; i < n; i++)
document.write('<layer left="0" top="0" width="+a+" name="nsmsg'+i+'" height="+a+"><center>'+props+msg[i]+'</font></center></layer>');
}
else if (ie||dom){
document.write('<div id="outer" style="position:absolute;top:0px;left:0px;z-index:30000;"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="iemsg'+(dom&&!ie? i:'')+'" style="position:absolute;top:0px;left:0;height:'+a+'px;width:'+a+'px;text-align:center;font-weight:normal;cursor:default">'+props+msg[i]+'</font></div>');
document.write('</div></div>');
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;

function Mouse(evnt){
ymouse = (ns||(dom&&!ie))?evnt.pageY+20-(window.pageYOffset):event.y; // y-position
xmouse = (ns||(dom&&!ie))?evnt.pageX+20:event.x-20; // x-position
}

if (ns||ie||dom)
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
var y=new Array();
var x=new Array();
var Y=new Array();
var X=new Array();
for (i=0; i < n; i++){
y[i]=0;
x[i]=0;
Y[i]=0;
X[i]=0;
}

var iecompattest=function(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
}

var makecircle=function(){ // rotation properties
if (ie) outer.style.top=iecompattest().scrollTop+'px';
currStep-=rotation;
for (i=0; i < n; i++){ // makes the circle
var d=(ns)?document.layers['nsmsg'+i]:ie? iemsg[i].style:document.getElementById('iemsg'+i).style;
d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15+(ie||dom? 'px' : '');
d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2+(ie||dom? 'px' : ''); // remove *2 for just a plain circle, not oval
}
}

var drag=function(){ // makes the resistance
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (var i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);

}
makecircle();
// not rotation speed, leave at zero
setTimeout(function(){drag();},10);
}
if (ns||ie||dom)
if ( typeof window.addEventListener != "undefined" )
window.addEventListener( "load", drag, false );
else if ( typeof window.attachEvent != "undefined" )
window.attachEvent( "onload", drag );
else {
if ( window.onload != null ) {
var oldOnload = window.onload;
window.onload = function ( e ) {
oldOnload( e );
drag();
};
}
else
window.onload = drag;
}

}
cursor_text_circle();

</script>

Beres deh...

Read More

Mempercantik atau memperindah tampilan Blog adalah naluri dari setiap blogger, dan jika tampilan blog seorang blogger telah mencapai tahap yang paling indah nantinya juga sang pemilik akan bangga terhadap blognya.Dalam postingan kali ini Saya akan menjelaskan tentang bagaimana Cara Membuat Cursor Bertabur Bintang.


1. Login ke blogger.
2. Klik Tatat Letak.
3. Klik Tambah Gadget.
4. Pilih HTML/javascript.
5. Pilih lalu Copy dan paste kode di bawah ini ke dalah kotak HTML/javascript.

Contoh Bintang Merah

<script src="http://denisahlan.netau.net/bintang.merah.js" type="text/javascript"></script>

6. Kalo sudah selesai jangan lupa click SIMPAN.
 

Read More