9/26/2012

2 Kode Scrift Spoiler

jumpa lagi sob,untuk yang lagi belajar memahamai tentang perangkat untuk memparcantik blog.Marilah kita belajar lagi,namun kali ini saya akan membagikan kode spoiler yang sebagai mana sebagian orang sudah memahami betul kode ini.Namun bagi saya masalah itu tidak jadi soal he...hee...barangkali masih ada juga yan membutuhkannya.Ok bagi sobat yang kebetulan mencari kode tersebut silahkan copy saja di bawah kodenya.

1.Spoiler untuk menyembunyikan teks.

<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><input style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button" value="Show" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px; background: #FAFAF7;">
<div style="display: none;">ini adalah tampilan spoiler untuk menyembunyikan teks</div>
</div>
</div>
ini adalah tampilan spoiler untuk menyembunyikan teks

2.spoiler untuk menyembunyikan gambar

<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><input style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button" value="Show" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px; background: #FAFAF7;">
<div style="display: none;"><img class="aligncenter" src="http://4.bp.blogspot.com/_3d0GDLAXLJ8/STAjkFR1s2I/AAAAAAAABCQ/pVH4lcV5odE/s320/monyet.jpg" alt="monyet" width="300" height="280" /></div>
</div>
</div>
Tulisan yang saya kasih warna merah silahkan sobat gantikan dengan url gambar sobat.
Silahkan anda pergunakan,semoga bermanfaat.
9/25/2012

Merubah Kotak Komentar Jadi Di Atas Komentar

Selamat petang menjelang malam,diawal postingan saya dan di malam pertama saya blogging ini saya akan mencoba untuk membahas sebuah tutorial yang menyangkut dengan template blogger,yang mana kebiasaannya kotak komentar terletek di bawah komentar.Nah kali ini saya akan memberikan tutorial cara merubah kotak komentar menjadi di atas komentar.
Ok yuk kita langsung saja ke cara pembuatannya.



1.masuk kedesign-edit HTML
2.Klik pada expand widgets templates
dan cari kodibawah ini::

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>

3.Kemudian hapus kode diatas
4.Seterusnya cari kode ini juga:
<a name='comments'/>

kalu sudah ketemu,letakkan kod dibawah ini dibawahnya kode yang di no 4:

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>


Selanjutnya di save,namun alangkah baiknya di freview dahulu barangkali ada eror.
setelah di coba tidak ada erorr silahkan di save,dan lihat hasilnya,Semoga bermanfaat.
Sumber dan demonya di sini

9/21/2012

Contoh Memasang Gambar di Header

Banyak cara menempatkan gambar di header,salah satunya cara yang saya terapkan di blog saya ini.Sebenarnya sih ada juga yang caranya lewat html javascrift,dengan cara menambahkan kolom gadgetnya dengan tujuan tidak menutupi judul blog ataupun deskripsi nya.
Nah untuk mempermudah cara menempatkan gambar di header,sebenarnya gampang.Kalupun sobat-sobat semua tidak mau menutup judul blog,ada pengaturannya dengan cara mengatur tata letak penyimpanan gambar mau setelah judul blog atau sebelum judul.lebih jelasnya yuk kita pelajari bersama.

Langkah pertama:
Silahkan anda upload dulu gambarnya,gambarnya bisa anda atur sesuai selera.
mau tife model apa,JFG,GIP atau PNG.dan lihat secara teliti.
Klik gambar untuk memoerbesar.



Langkah kedua:
Lihat gambar di bawah,setelah dalam modus html silahkan anda ambil Url gambar yang anda upload yang letaknya paling bawah tulisan.lihat bulatan merah yang di ujung panah.Nah silahkan anda copy dan simpan dulu di notepad.

 

Dan seterusnya:
Tutup langkah di atas,selanjutnya silahkan anda masuk kembali ke layout atau tata letak.


Terakhir:
Pilih judul header atau judul blog letaknya paling atas,setelah itu klik edit nah di situ ada 2 pilihan.
1.upload lewat komputer anda.
2.ambil dari blog kita sendiri dan hanya url gambar tersebut yang bisa di ambil.
nah untuk memasangnya simpan saja url gambar yang tadi di simpan,pada langkah kedua.
Dan biarkan sampai proses loading gambarnya muncul,setelah selesai silahkan anda pilih untuk menempatkannya.
Lihat gambar di bawah,kalau saya memilih yang saya kasih bulatan merah kecil.selanjutnya silahkan anda save.



Nah sobat blogger itulah tutorial memasang gambar di header,walaupun sederhana tetapi insya allah meyakinkan tidak membuat loading blog menjadi lola,he..he..
Semoga bermanfaat.

9/20/2012

Kucing Animasi Desktop

Ya sesuai dengan judul,pada hari ini saya akan membagikan aplikasi,animasi kucing on desktop.sepertri apa bentuknya?.Ini adalah sebuah software yang tidak terlalu besar bahkan tidak  sampai satu mega cuma kiloan beat saja.mau ga?kalau mau silahkan anda download di sini.
Nah setelah anda mendownloadnya tinggal di buka dan lansung instal saja,oh ya mau lihat bentuknya kaya apa?nih lihat di bawah:



 Selamat mencoba.
9/19/2012

Cara Pasang Game Flash

Jaman sudah maju,banyak sekali kemajuan diantaranya di dunia game.Banyak sekali macam permainan yang menarik dan sangat bagus,di ilhami dari game-game tersebut saya merasa terinspirasi ingin rasanya saya memasang game di blog.maka saya juga nanya si mbah google,dan dapatlah scriftnya untuk blog.
Contohnya lihat di bawah:




GAME:


Wuih mantap... Ok barangkali saja sobat mau membuatnya di blog sobat,kopas saja scriftnya.Dan pasang di gadget blog sobat.

<embed bgcolor="white" height="350px" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi? P1_Prod_Version=ShockwaveFlash" quality="high" src="http://www.flashgames.it/giochi/avventura/steppenwolf.the.kraken.4/game.swf"
type="application/x-shockwave-flash" width="520px"></embed>

Teks yang berwarna merah silahkan anda ganti dengan game flash yang lain,kalu sobat punya. Selamat mencoba,semoga sukses.
9/17/2012

Kecoa Nakal Di Desktop PC

Siapa yang ga kenal dengan kecoa?,yah itu...,dia adalah salah satu mahluk tuhan yang berada di bumi ini.Kecoa makhluk yang sangat menggelikan bahkan sebagian orang banyak yang membencinya.
Kenapa ya?karena kecoa selain bentuknya yang menggelikan juga kecoa suka di tempat tempat yang agak kotor.Nah kecoa yang satu ini kebalikannya tulisan di atas,karena kecoa ini tinggalnya di desktop PC kita he..he..,tapi kalu yang jijik sama kecoa,sama saja kali ya?.Tapi kalu yang ini sih beda banget sama aslinya,jadi kita tidak akan memegang atuu menyentuhnya.cuman bentuk dan rupanya hampir mirip bahkan mirip lah,kalau ga percaya coba saja lihat gambarnya di bawah.


Tuh kan mirip banget,barangkali sobat semua pingin mencobanyan silahkan download aplikasinya di sini.
Nah setelah anda mengunduhnya tinggal di instal saja,cara instalasinya sama dengan aplikasi atau software lainnya.Semoga bermanfaat.Sumber aplikasi.

Scrift Buku Tamu


Pasti anda sudah tau apa itu buku tamu,ya benar.Buku tamu yang sering kita lihat apabila kita berkunjung ke blog sobat-sobat yang lain pasti ada yang pakai yang namanya buku tamu.Apa kegunaan dari buku tamu/guest book tersebut?kegunaannya ialah,untuk pengunjung yang kebetulan berkunjung ke blog kita dan meninggalkan jejaknya di situ.jadi buku tamu ada gunanya juga kita bisa melihat siapa saja yang datang,dan sebaliknya kita bisa mengunjungi balik mereka.
Yuk..kita langsung saja ke tutorialnya:

Demo:
monyet
1.masuk blogger.
2.pilih tata letak/layout>>Add Gadget>>Html javascrift.
Copas kode di bawah dan pastekan saja di gadget tersebut dan save lalu lihat hasilnya.

<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('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png')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">Masukan kode cboxnya di sini<div style="text-align:right"><a href="javascript:showHideGB()">[close]</a></div></div></div><script type="text/javascript">var gb=document.getElementById("gb");gb.style.right=(30-gb.offsetWidth).toString()+"px";</script>

Semoga bermanpaat.
 

free counters

Arsip Blog

Followers