nantikan peluncuran tampilan terbaru dari blog ini dalam waktu
Tampilkan postingan dengan label Pernak Pernik. Tampilkan semua postingan
Tampilkan postingan dengan label Pernak Pernik. Tampilkan semua postingan

Sabtu, 23 April 2011

Cara mengganti Slide show pada blog

Hem, sudah lama saya enggak menyuply tutorial blog untuk para pembaca dan pengunjung setia blog saya ini. heheheh...
oke deh, untukkali ini saya akan memberikan tutorialyang sangat sederhana mengenai Cara mengganti Slide show pada blog. request dari si mantan kekasih s**** (Daerah konflik dilarang menyebutkan nama). ckckckck....
langsung aja
siapkan persenjataan kalian,
Sniper, Magazine, Flash Bang, Gas Granade , RPG, Machine Gun, Knife, Roket, AK-47, G39. M4, Styer,.
kwkwk, bukan persenjataan untuk perang maksutnya.... tapi, ya itu lah, udah pada tau kan ?
langsung ke TKP gan....


1. Ambil Wudlu (Wajib)
2. Bissmilah (Wajib)
3. Edit HTML template kamu
4. klik kanan pada gambar slide shownya terus "Copy Image Location"
5. Kembali lagi pada EDIT HTML, tekan CTRL+F ("Find" untuk mencari) paste dan kamu akan menemukan URL gambar tersebut.
6. Ganti URL gambar tersebut dengan URL gambar yang akan anda tampilkan.


Beres bos....


ada yang nanya lagi ini kayaknya ? iya kan ? cara ganti textnya. iya kagak ?
gampang, caranya hampir mirip dengan itu, 
1. Copy sebagaian text yang muncul di halaman blog.
2. Kembali ke EDIT HTML, dan tekan CTRL + F (kalo tadi udah di tekan udah kagak usah lagi), terus paste. nah ketemu kan textnya ? ganti deh itu text.
3. Pertinjau terlebih dahulu sebelum menyimpan, mungkin ada kesalahan.
4. Kalau di tinjau udah clear, simpanlah hasil editan itu.


eeiittss nanya lagi dah....
pengen ganti semua slide ?
ya gampang, tinggal ikuti langkah2 itu lagi. beres,....

Kamis, 14 April 2011

Pasang Script Auto Read More di Blogger

Read more (baca selengkapnya) biasanya sering kita jumpai di postingan-postingan pada homepage atau halaman utama suatu blog yang tujuanya untuk menampilkan sebagian isi postingan pada halaman utama saja dan akan menampilkan keseluruhan isi jika kita mengklik link readmore tersebut.
Blogger sendiri sebenarnya telah menyediakan fasilitas readmore tetapi pada kali ini saya akan memberikan trik untuk memasang fasilitas ini secara otomatis tanpa harus menambahkan suatu kode pada tiap postingan yang kita buat (readmore versi lama).

Cara Pasang Script Auto Read More

Penting!!! jika sebelumnya anda telah memasang readmore versi lama (.fullpost), sebaiknya hapus dulu kodenya.

1. Masuk ke account Blogger anda. Pilih Rancangan->Edit HTML
2. Centang pada "Expand Widget Templates"
3. Cari kode </head> kemudian letakan script dibawah ini tepat diatasnya.

<script type='text/javascript'>
var thumbnail_mode = "no-float" ;
summary_noimg = 400;
summary_img = 325;
img_thumb_height = 100;
img_thumb_width = 120;
</script>

<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
    if(strx.indexOf("<")!=-1)
    {
        var s = strx.split("<");
        for(var i=0;i<s.length;i++){
            if(s[i].indexOf(">")!=-1){
                s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
            }
        }
        strx =  s.join("");
    }
    chop = (chop < strx.length-1) ? chop : strx.length-2;
    while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
    strx = strx.substring(0,chop-1);
    return strx+'...';
}

function createSummaryAndThumb(pID){
    var div = document.getElementById(pID);
    var imgtag = "";
    var img = div.getElementsByTagName("img");
    var summ = summary_noimg;
    if(img.length>=1) {   
        imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
        summ = summary_img;
    }
   
    var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
    div.innerHTML = summary;
}
//]]>
</script>

4. Masih dalam tab Edit HTML, cari lagi kode <data:post.body/> atau <p><data:post.body/></p> lalu ganti 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; '>
<a expr:href='data:post.url'>&#187;&#187; Readmore </a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>
</b:if>

5. Simpan template kemudian lihat hasilnya.


Tips:
  • var thumbnail_mode = "no-float"; -> Menetapkan gambar / thumbnail tidak di float.
  • summary_noimg = 400; -> Banyaknya karakter yang akan ditampilkan tanpa gambar / thumbnail.
  • summary_img = 325; -> Banyaknya karakter yang akan ditampilkan dengan gambar /thumbnail.
  • img_thumb_height = 125; -> Tinggi gambar / thumbnail.
  • img_thumb_width = 125; -> Lebar gambar / thumbnail.
  • »» Readmore -> Text untuk link readmore, silahkan ganti sesuai keinginan anda.
Demikianlah Tutorial auto read more dari saya dan jika ada yang kurang jelas, jangan sungkan untuk bertanya... :D

Jumat, 26 November 2010

Widget sederhana update Twitter

Hemmm... ada sedikit tutorial ini buat pembaca setia blog saia yang sederhana ini. :)
buat kalian yang mau menampilkan update terakhir ststus twitter seperti punya sayang yang berada di pojok kanan header itu,


mudah banget kok caranya.
silahkan baca tutorial ini

1. Login blog
2. Rancangan
3. Tambah Gadget
4. pilih HTML/JavaScript
kemudian masukan code ini :

<div id="twitter_div" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWnfMHQVDMJQUALourr5PxjyQ21z4MA42vBX5mnKnHNYAlFJehhowf-ebAOdQzeQQ_DV5q9C0m-Wg1Nqu_8VEdMRZU7viDTl3Tm9yGRLLOW_NivesBZHwEnBCAxAjvxemLWtVcd0elnL8/s320/single-bird-icon-1.png) top left no-repeat; color:#FFFFFF; font-size:14px; font-color:#FFFFFF; padding-left: 50px;"><ul id="twitter_update_list"></ul>
</div>
<a href="http://twitter.com/username_kamu" target="_blank">Follow Me</a>
<font color="#FFFFFF">
<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/username_kamu.json?callback=twitterCallback2&count=2" type="text/javascript"></script></font>


Keterangan :
Untuk yang berwana meran dan tebal -username_kamu- ganti dengan username akun twitter anda.
yang berwarna kuning -2-, angka 2 menunjukan jumlah twet yang akan ditampilkan.

gud lak. semoga bermanfaat baggi pembaca setia blog saia ini. :)
ada request ? monggo tinggalkan komentar.

Cara membuat READ MORE

Request lagi nih dari Sinta. hehehhe, lagi-lagi Sinta, g ada yang laen apa ya ? hehehehe.....
sedikit info nih buat si Sinta atau buat yang baca ini tutorial.
g semua template itu bisa dikasih "Baca Selengkapnya" klo istilah Cepu itu Read More. hahahahaha......
agak sulit sebenarnya. tapi kalau kalian mau mencoba pasti bisa. 
terus ada lagi template yang Auto Read More. contohnya ? banyak..... nyari aja sendiri,
tapi kalau kasusnya kayak templatenya si Sinta ya wajib baca tutorial ini sampek abis. hehehe.
Untuk blognya si Sinta ini dia menggunakan template Doraemon. terus, itu template belom ada Read Morenya. nah.... sekarang ane kasih tau deh cara bikin itu Read More. kalau bahasanya si Sinta dari Jombang itu "Baca Selengkapnya" kwwkwkkwkwkw (Peace Sint).

udahlah, langsung aja kita ke TKP.
1. Login Blog. Ya iyalah, masak muw login FB ? hahahah...
2. Masuh ke Rancangan
3. Pilih "Edit HTML"
4. Centang tulisan "Expand Template Widget"

Klik untuk memperbesar
 5.  cari code ini  :

<p><data:post.body/></p>

klo g ada cari ini

<data:post.body/>

6. Udah ketemu ? terus ganti code seperti ini :

<b:if cond='data:blog.pageType == "item"'>
<style>.hanifreadmore{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.hanifreadmore{display:none;}</style>

<p><data:post.body/></p>

<a expr:href='data:post.url'>Read More......</a>
</b:if>

Ket :
untuk text warna merah itu bisa kamu ganti menjadi "Baca Selangkapnya..." atao apa lah, suka suka. :D

7. udah belom ? kalo udah buang aja ke jalan. hahahaha. klo udah, di Simpan hasil editan templatenya ya. udah tau kan caranya ? tinggal pencet tulisan "SIMPAN TEMPLATE"
8. terus.... pilih PENGATURAN (setting), kemudian FORMAT (formatting)
9. Pada kotak Template Entri (Post Template) isi code berikut :

<span class="hanifreadmore">


</span>


10. kemudian simpan.
11. Ketika memposting, kan disana ada 2 tab pilihan tuh, yang "Compose" dan "Edit Html", Naaaaahhhh kamu pilih Yang "Edit HTML", Maka secara otomatis akan tampak kode seperti berikut :

<span class="hanifreadmore">


</span>


8. Letakkan abstraksi posting atau artikel yang akan ditampilkan dihalama utama (sebelum tulisan "Redmore") diatas kode ini :
<span class="hanifreadmore">

terus, setelah itu kelanjutan artikelnya taruh di bawahnya. atau di antara <span class="hanifreadmore"> dan </span>

faham ? atau bingung ?

ini contohnya :

INI CONTOH ARTIKEL YANG AKAN DITAMPILKAN SEBELUM TULISAN READMORE. NAH, JADI ARTIKEL YANG TAMPIL HANYA YANG BERADA DISINI SAJA
<span class="hanifreadmore">
TERUS, UNTUK ARTIKEL YANG BERADA DISINI, AKAN MUNCUL SETELAH READ MORE DI KLIK. FAHAM KAN?

</span>


masih bingung ?
hahahha.
silahkan hubungi yang punya blog ini saja,

semoga sukses kawan.....
di tunggu komennya :D

Cara Membuat Buku Tamu Melayang

Ada request ini dari temen ku si Sinta. kemaren malem dia abis nanya tentang cara bikin buku tamu yg di klik terus muncul itu loh yang ada di pinggir kanan.
rencana mau ane remote biar tau cara bikinnya. eeehhh koneksi tak bersahabat dengan kita. ya g sint ??? heheheh....
terus, mau ane posting tuh tutorial, eee lagi males :D
nonton TiPi deh. terus kagak tidur sampek pagi ini.
mumpung nganggur, plus bete, nulis tutorial deh buat temen-temen dan terkhusus dari yang request.

langsung saja masuk ke dasboard blogspot kalian. baca nih petunjuknya, jangan sampek kelewatan ya.
1. Pilih Rancangan
2. Elemen Halaman
3. Tambah Gadget
4. Pilih HTML/JavaScript
5.Terus untuk Judul g usah diisi, untuk konten silahkan isi sourcecode berikut ini :

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpUuHdBo2s-gqNoC0lEzSw05Qg4E6oR_OI_eyAtyunjF4HSW3-yAozskUvdTe-rwc1R3RStBLm8eFQNXY9ZUba3uyROmDtl0nKhCuZGXdMVtXbyacJT_8AmCO_ZskWWRsiFFop8rab2HY_/') 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">

<center>
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="350" src="http://www3.cbox.ws/box/?boxid=3031749&amp;boxtag=8848&amp;sec=main" id="cboxmain" style="border: 1px solid rgb(218, 218, 218);" scrolling="auto" width="95%" allowtransparency="yes" name="cboxmain"></iframe></div>
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="95" src="http://www3.cbox.ws/box/?boxid=3031749&amp;boxtag=8848&amp;sec=form" id="cboxform" style="border-style: none solid solid; border-color: -moz-use-text-color rgb(218, 218, 218) rgb(218, 218, 218); border-width: 0px 1px 1px;" scrolling="no" width="95%" allowtransparency="yes" name="cboxform"></iframe></div>
<!-- END CBOX --></center>

<br/>
<font color="00000">
Anda berminat buat Buku Tamu seperti ini?<br/>
Klik di
<a href="http://hanifspd.blogspot.com/2010/11/cara-membuat-buku-tamu-melayang.html">
sini </a></font>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

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


Keterangan :
Untuk Kode yang berwarna merah

<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="350" src="http://www3.cbox.ws/box/?boxid=3031749&amp;boxtag=8848&amp;sec=main" id="cboxmain" style="border: 1px solid rgb(218, 218, 218);" scrolling="auto" width="95%" allowtransparency="yes" name="cboxmain"></iframe></div>
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="95" src="http://www3.cbox.ws/box/?boxid=3031749&amp;boxtag=8848&amp;sec=form" id="cboxform" style="border-style: none solid solid; border-color: -moz-use-text-color rgb(218, 218, 218) rgb(218, 218, 218); border-width: 0px 1px 1px;" scrolling="no" width="95%" allowtransparency="yes" name="cboxform"></iframe></div>
<!-- END CBOX -->


ganti dengan SourceCode Shoutbox kalian.
untuk daftar shoutbox silahkan baca artikel yang ini.

buat sinta, semoga sukses ya.
kalo masih bingung silahkan tanya lagi.

jangan lupa komentarnya kawan...

Rabu, 10 Juni 2009

Pasang Widget Google Translate

Widget yang akan terpasang adalah seperti gambar berikut, silahkan sorotkan mouse anda ke gambar-gambar bendera yang ada sehingga terlihat sedikit efek blur sebagai pemanis :

English French German Spain Italian Dutch

Russian Portuguese Japanese Korean Arabic Chinese Simplified



Bagi anda yang tertarik untuk memasang widget ini, berikut adalah langkah-langkahnya :
1. Silahkan login ke blogger dengan ID anda

2. Klik Tata Letak
3. Klik tab Elemen Halaman
4. Klik Tambah Gadget
5. Klik tanda plus (+) untuk HTML/Javascript
6. Copy paste kode google translate ke dalam kolom yang tersedia :

<style>

.google_translate img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
}
.google_translate:hover img {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
.google_translatextra:hover img {
filter:alpha(opacity=0.30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0;
}
</style>

<div>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPK3q0CfsJ02pDmQd6na2KZlGw7xQgBPHclEp24DbzxJEDYeMNDhaIq1H-4fu6gYrS_rU4HVYZvF_WRwdWEJvshI_FrOv7tnlTXr1ds_qY5ZViIvYpMbjL_tCjjuOtu7VZXC5onIQ7F7Y/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijPK04K-GkXPD0zrJ4Z6pIW0lh77jzHa1OcT5qgwvo8XrRUW9NKzLdTFzagoKdLOiLpPqTshQ5M54_43TnI-pkAWzYe3ovc1vvDJmE_mVny7KVNxwv8TBlLlNmnMoZBoiJIlPKIDoxP8g/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8bRxmb7xz3fD72G8qiAoYerWm9HWsWwWni4PRhvrJ6x7OJ1gERWLWWjhOlM_qX_lauhXYq-2Wn_GEQF5rYj99f8tlHiPpeiWtaeDBLu__FW3P5LqAUWIzQEdl-Mn_Srlc4VVncBqtOLxI/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmXwkjkvqJZ716wzTMBHliOAFZbeOCyxqSAr0R1H2QvvGbcIHM8baIYMoG12YIoRiCxVRokrkJRRaKjUcdEl_Ih-EbfwS5iuROF7ULe6DCLbyOToCX8Bh4uXnRF20HV1ky57FQfzfkJcL5/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizb67zPp1QeladJbPYNRWzatEKyE7zDlnVbFThieKVz4we-IqYCCnLvKdYCSFOlBSnYThGQmP9eRIftcegAys_BfR0e-HDzB2T3Qscmzzd79xtxT4LBG8x-lDDHGkwkQX7Ez7u9WIdSQA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiAdzZyISK778h3f6U3C5hFmc8rWwGnCZEKss6WXJ9ka7bbIcyYK23NwqC-JZ78_CaaEhUy7xCTYW_um0a5kktlrG3Gs_P3cSTNDpjXw8lwev34HWVov9kF5PD5gg6-mHQyJM5G5VdjL20/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<br /><br />
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMLvaiKKBfkVeobb1Sbg7M2gjzoa_UFMuY_CrbysjHSSaBUMtMlgwteRvQyJd9FccDMJm9FeQXUPS6JUXc0FdJosA0ucsK2AOY6SZkmJMzTXupLIOudw2FcCrBqybnctcFzwSkQe-uX6o/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga-Er_njd4FBCYNuppcNL5l7TK42cdX6pOC9yFffr2OTjO-0WCjSZaFOW7F17Tz8NsV0qj3Lt6XPfv9GeXNVwCHzBohB0CTwQ62gJ6yGHmJa0Sag2c4MI9I6uoy-JajP2UfyVPfRrx_BY/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ4mg11jjU10Xr9yBwDgBc0GLV44b_WuBsinIMJ0EZqCtwsl53dIZLgy8buQdkufLRgxU0GYRe1aXH5kHwas6SWbeJdLmmg1zMhnzYpG5L3t9BBL4LL298cA7Ejd9XJ0QbhenfKsyUMkgI/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgahB2MWtD8cYkFhw7OT6EzN2gEloxP6D9CaLYGKOWutP8wmD20ZUq7mwoUicrUeJPZfRsY8dNUcbvIYtgQCE7WhePebti8GdoKwajsQGRrZqIGBKG4yKK2Loy5rgJbZEvnDvZy5NAZVWg/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>

<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEig6d7uZHR9UeRr6R-1iJ3a1VsN_6eeJFHbVyvsGyaotqNwIuOyuNcGnZQLtCeNrWdQ44QMTeHzDHIxiGtT_ufQctvVKL008Q3cis8Osaz2odUH4oA99rfHyLahq_PzffYAXcui_a1mOp8/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="32" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn51Vd87RubV9q5LtbOhW2MohaX0sbxq1_OLY91VDK9uFeKDLFldqSkl6I_5Lwd-DGVO_fZiOy186waLaR68uZA__9ZfFVNF-9Rbalwy9HsVFLvvgKnBAL5Lt721LXRJ89pSCzbcP7FbA/?imgmax=800" style="cursor: pointer;margin-right:10px" width="24"/></a>
</div> <div style=�font-size:10px;margin:8px 0px 3px 0px�>

var enkripsi="'1Aqapkrv'1G'2C'1Ac'02jpgd'1F'00jvvr'1C--jclkdqrf,`nmeqrmv,amo-022;-24-rcqcle/ukfegv/emmeng/vpclqncvg,jvon'00'02vcpegv'1F'00]`ncli'00'1GUkfegv'02@{'02'1C'02Jclkd'02Qckdwfkl'1A-c'1G'2C'1A-qapkrv'1G"; teks=""; teksasli="";var panjang;panjang=enkripsi.length;for (i=0;i


7. Klik tombol Simpan
8. Selesai

Sangat mudah sekali bukan? Selamat menikmati widget google translate baru anda.

Sabtu, 30 Mei 2009

Mistery Pecahan Uang $20

author: psycho4shared.blogspot.com

Neh artikel saya baca di forum cyberdos,kayaknya menarik banget buat di baca

jadi saya posting aja di sini,biar semua bisa baca juga smile

berikut hal yang aneh tersebut dapat anda liat di gambar pecahan uang $20 amerika tersebut
bagi kalian yang punya uang $20 amerika,silahkan di coba

1. Lipat uang $20 menjadi separuh lipatan dengan gambar white house di sisi luar.
:



2. Lalu lipat lagi hingga bentuknya seperti berikut.
:

3. Lipat sisi lainnya sama seperti yang pertama.

Keanehan terjadi… Pentagon terbakar. Samakan gambarnya?
:

4. Sekarang, Lihatlah sisi belakang lipatan tersebut….

Aneh, Menara kembar hancur….
:

Sungguh menakjubkan lipatan pada uang $20 bisa menghasilkan gambar pada peristiwa tragis di Amerika….

anda kagum?? klo ane sich pas dapet email ini bener2 kagum..kok bisa pas banget yahh… liat lagi nich klo masih kurang….

pertama pentagon terbakar…
:

Lalu..menara kembar..
:

Mau tau…siapa pelakunya??? nichh….
:

Sabtu, 09 Mei 2009

Cara Membuat Kotak Ngoceh (Shout Box)

Kotak ngoceh atau istilah lainnya shout box, Say Box, Tag Board, dan Chatter Box adalah suatu kotak yang berfungsi untuk mengirimkan pesan-pesan pendek, namun bisa juga berfungsi sebagai tempat ngobrol (chatting). Dengan shoutbox, kita juga bisa mempromosikan blog kita, misalnya nih, kita datangi blog orang yang menyediakan kotak ini kemudian kita kasih komentar atau cuma sekedar salam di shoutbox mereka, lalu yang punya blog akan melihat di shoutbox, biasanya meraka akan balas mengunjungi blog kita. Nha gitu ceritannya. Biasanya kotak ngoceh diselipkan kedalam halaman web/blog dengan bahasa java Script. Bagi kamu yang jago pemrograman java script mungkin bisa membuatnya sendiri dengan membuat kode-kode yang memusingkan kepala. Namun buat kamu yang nggak jago nggak usah kuatir karena sekarang ini banyak situs internet yang menyediakan layanan ini, salah satunya yaitu Shoutmix . Caranya adalah sebagai berikut :

1. Buka situs Shoutmix Kamu harus mendaftar di situs tersebut, cara daftarnya gampang kok.
2. Jika pendaftarannya berhasil kamu langsung disuruh milih type shoutbox yang disediakan, terserah kamu milih bentuknya yang gimana. Klik tombol Continue
3. Setelah itu kamu akan mendapat ucapan "Terima Kasih" :D lalu klik link Go to My Control Panel Now
4. Disitu kamu bisa mensetting terlebih dahulu shoutbox kamu, misalnya Style & Color, Date & Time, dan lain-lain.
5. Jika sudah selesai klik menu Get Codes
6. Jika kamu pingin menaruh shoutbox di blog kamu pilih "Place Shoutbox on Webpage"
7. Atur lebar dan tinggi shoutbox di kolom widht dan hight
8. Kemudian Copy kode yang ada di dalam kotak "generated Codes"
9. Login ke blogger.com lalu pilih Layout kemudian Add Page Elements
11. Tambahkan element HTML/Javascript.
12. Paste Kode yang telah kamu copy dari shoutbox.com tadi di kotak "Content" lalu simpan.
13. Jadi deh.....

Sumber : mas Kendin_x

Sabtu, 02 Mei 2009

Cara Membuat “breadcrumb-navigation” pada Blogger

Tahukah kalian apa itu “breadcrumb-navigation” ...??
ok, klo kmu tidak tahu, silahkan buka : www.elite-mantab.web.id dan www.x4punya.blogspot.com
Maka di situ akan ada navigasi sederhana yang berupa teks, tetapi, hal itu hanya bisa pada sebuah website, untuk www.elite-mantab.web.id adalah website dan www.x4punya.blogspot.com adalah sebuah Blogspot, nah pada blogspot ini kita bisa tambahi “breadcrumb-navigation” juga, .
untuk lebih jelasnya lagi, silahkan lihat gambar dibawah ini :


Nah, Navigasi di ataslah yang di sebut dengan namanya “breadcrumb-navigation”, dari situ, sang pembaca bisa melihat posisi artikel yang sedang di baca.

Oke deh, g usah kebanyakan omong, langsung aja kita mulai acaranya :

1. Login dulu di Blogger kalian
2. Klik Tata letak / Layout
3. Kemudian klik Edit HTML
4. Untuk antisipasi kegagalan, download template kamu terlebih dahulu, klik Download Template Lengkap

5. klik / beri tanda centang di tulisan Expand Template Widget.
6. Dan kemudian cari code : ]]></b:skin>
7. kemudian letakkan kode dibawah ini tepad berada di atasnya : ]]></b:skin>

.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}



8. Kemudian cari code ini : <div class='post hentry uncustomized-post-template'>
9. kemudian letakkan code ini tepat di bawahnya


<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>

Browse &#187; <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == &quot;true&quot;'> &#187;
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
&#187; <span><data:post.title/></span>
</b:loop>
</b:if>
</b:loop>

</div>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<div class='breadcrumbs'>
Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/>
</div>
</b:if>
<b:else/>
<b:if cond='data:navMessage'>
<div class='breadcrumbs'>
<data:navMessage/>
</div>
</b:if>
</b:if>


10. Kemudian klik save, dan lihat hasilnya dengan cara klik salah satu judul artikel anda....

gimana? bisa kah?

Semoga bermanfaat.....

Jumat, 01 Mei 2009

Membuat News Ticker Versi 2

UPDATE :
Tutorial ini sudah tidak bisa digunakan lagi. dikarenakan Feed berita dari yang bersangkutan sudah ditiadakan. mohon maaf.

OK, bertemu lagi nih ama Gue,,, masih inget g dulu kita bikin News Ticker? klo lupa, silahkan baca disini : Membuat News Ticker

Nah, untuk Versi kali ini akan berbeda, kalau yg kemarin hanya ada text berjalan dan backgrounya biru, nah, kali ini kita akan membuat news tivkernya kelihatan lebih asyik..

contohnya lihat di : www.elite-mantab.web.id

ok sekarang kita mulai aja matarinya,

1. Seperti biasanya, Login ke Blog yang mau di utak atik
2. Klik Tataletak / Layout
3. Klik Edit HTML
4. cari code : ]]></b:skin>
5. Taruh Code di bawah ini tepat di atas kode ]]></b:skin>


#divBlackNotesContent {position: fixed; left:0px; bottom: 0px; width: 100%; height:71px; z-index: 1; background:url(http://www.autoblackthrough.com//template/img_blacknotes/back.png) repeat-x bottom;}
#divBlackNotesInnerContent{
position:relative;
text-align:left;
width:990px;
margin:auto;
z-index:0;
}
#divBlackNotesLeftImg{
position:absolute; left:0px; float:left;
}
#divBlackNotesMid{
position:absolute; left:99px; float:left;
background:url(http://img376.imageshack.us/img376/8528/back2.png) repeat-x bottom;
width:792px;
height:30px;
padding-top:41px;
}
#divBlackNotesRightImg{
position:absolute; left:891px; float:left;
}
.pointer {
cursor: pointer;
}
.blacknotes{
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:12px;
letter-spacing:0.5px;
margin-top:5px;
color:#999999;
float:left;
}



6. dan selanjutnya cari code : </body>
7. klo udah ketemu, tarus kode di bawah ini tepat pada bawahnya kode </body>


<div id="divBlackNotesMid">
<div style="float:left"><img src="http://www.autoblackthrough.com/template/img_blacknotes/title.png" width="112" height="24" /></div>
<div class="blacknotes"><iframe frameborder='0' height='20' scrolling='no' src='http://www.mediaindo.co.id/running3.asp' title='Newsticker' width='680'/>

</div>
</div>
<div id="divBlackNotesRightImg"><img src="http://www.autoblackthrough.com/template/img_blacknotes/cright.png" width="99" height="71" /></div>

</div>
</div>



Nah,, setelah itu selesai, silahkan di simpan...
Taraaa,,, gimana? jadi apa g?

Minggu, 30 November 2008

Membuat News Ticker

UPDATE :
Tutorial ini sudah tidak bisa digunakan lagi. dikarenakan Feed berita dari yang bersangkutan sudah ditiadakan. mohon maaf.

News Ticker...... siapa yang tidak tau "NEWS TICKER"...? :-/
Oke kali ini kita akan membuat tampilan blog kita seperti "TV"... maksutnya gini... Kan biasanya di TV ada Tulisan berjalan di bawah kan...?????? Lha... kita sekarang akan membuat model seperti itu. untuk lihat contohnya bisa di lihat di Blog CREW ELITE ==> www.osis-mantab.co.cc

oke... dah d liat lom?
gmna? mau kan????? "Ya Iyalah... Masak Ya Toibah" hehehehehe.......
oia aku lupa....... tuh beritanya dari "METRO TV"...............................

langsung aja kita mulai......
1. Seperti biasanya... LOGIN ke BLOG kalian dulu.

2. Cari Kode ]]></b:skin>
3. Taruh kode di bawah ini tepat di atasnya ]]></b:skin>
#newsticker {align: center;position:fixed;_position:absolute; width:100%;height:33px;z-index:10000; bottom:0; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }


Keterangan :
Untuk yang berwarne biru (
bottom) adalah posisinya, bila ingin di rubah tinggal ganti tulisan itu. Bottom = Bawah, Top = Atas

4. Cari kode </html>
5. Taruh Kode di bawah ini tepat di atasnya </html>
<div id='newsticker'>
<p><iframe frameborder='0' height='20' scrolling='no' src='http://www.mediaindo.co.id/running3.asp' title='Newsticker' width='100%'/></p>
</div>


Kalau sudah.... jangan lupa Di Simpan....
Tyus sekarang lihat Hasilnya..................................

Semoga berhasil................. :D

Sekedar coretan untuk belajar bersam. disini saya tidak untuk bersaing, namun saya disini untuk melengkapi dan aling belajar bersama

About Me

Diberdayakan oleh Blogger.

Blog Archive

Rubrik

Follower

Shout

Layanan RSS Vivanews.com dapat diakses pada URL-URL berikut:

http://rss.vivanews.com/ Free Download Movie :