Tempat Nongkrong
Slide Post
Tampilkan postingan dengan label Blog. Tampilkan semua postingan
Tampilkan postingan dengan label Blog. Tampilkan semua postingan
0

Cara pasang burung twitter terbang melayang di blog

[tempatnongkrong] Kali ini saya akan memberikan sedikit cara dari banyak cara untuk memasang widget twitter, salah satu teman saya menanyakan ini dan tidak ada salah nya untuk saya memberikan sedikit pengetahuan yg saya punya. Dengan memasang widget burung twitter melayang di blog tentunya akan membuat blog anda semakin menarik. Tampilan dari burung seperti di twitter ini yang jelas burungnya akan terbang kesana-kemari di halaman blog. Sebenarnya pembahasan tentang memasang tutorial ini kayaknya sudah lama dishare oleh blogger lainnya, namun untuk memperbanyak konten Blog, akan dishare lagi. Ok lanjut dengan bagaimana cara membuat burung twitter melayang di blog?
Cara Memasang Burung Twitter Melayang di Blog
Cara Pasang Burung Twitter Terbang Melayang di Blog

1. Login ke Blogger

 2. Klik Tata Letak

3. Klik Tambah Gadget

4. Pilih HTML/JavaScript5. Masukkan kode animasi burung twitter kedalam HTML/JavaScript

<script type="text/javascript" src="https://sites.google.com/site/blogrudyhartono/js/tripleflap.js"></script>
<script type="text/javascript">
var birdSprite="isi dengan kode gambar burung twitter disini";
var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span");
var twitterAccount = "http://twitter.com/AkunTwitterAnda";
var tweetThisText = "Twitter - UserID";
tripleflapInit();
</script>Keterangan1. Silakan ganti tulisan isi dengan kode gambar burung twitter disini dengan kode gambar burung twitter

2. Ganti AkunTwitterAnda dengan nama akun anda
Ini ada beberapa gambar warna burung twitter, silahkan dipilih yang cocok dengan warna blog anda dan silahkan masukkan ke teks warna merah diatas.



Kode Burung :
1. Burung Twitter Warna Coklat
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia6koRCQ4Z9ZGxdGfyklRTcGlOjFHkFiC_QWtRr70l7dyH9dcnU6c79QW0EyC_nB6ORSVX8n0q6QvIgX9ydn2D9TjcC1OrlSutkiRjiUiP_GvJcbDueROGbtB6y7eKEzfKmf6l2wVkb5E/s1600/brown+bird.png

2. Burung Twitter Warna Kuning
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsJhbqnvvDlhZdIG4XjMJBSjVvE4CdbynSe7uxJivqoszRs_wkVjIsqb0FFtmDkXHAeBlmo4SzcdIrQceIhX7t98zvSG1AhrytWDRLzCt5cEE6-ot0AUakSMO5GzRxwQaO41DDb_gx58g/s1600/yellow+bird.png

3. Burung Twitter Warna Hijau
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjanSe9s-GqUaf4aRFEpCLT-pSy2zzEulFBibP2sFIEm1rEB7Dwkvmv8SDAZsonxQn6QSfd1Tt7Zph6Z4oUgrhbd48W4S5CP9jUUqp_BnKKY4jmh4EaGAUc4538NICWtndPaFPl-zNroFo/s1600/Green+bird.png

4. Burung Twitter Warna Ungu
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilcCyFzLfzfYRZF2fLibhdEv-n_sEVUwTu0xYZK3pdc3deqauj96WA7-w0iF9j6TKK_t0v-NvpNQ64aiiaGYzmBE9_wbx8MFTnlLMpDhe0CRv0CeSAW90Pp14az4acfIGIdhMX3oZbeVo/s1600/purple+bird.png

5. Burung Twitter Warna Merah
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjukrtl45D8Tzy1rY4ukUxHtiXKsuQi8QOQFnIocqI0cHwgePh6tY36hCofLOER2M-ulNIlPmSH0Xxk4gvxVUsvDsYo-uuF959mdhqIno98GiD1ht7ZuP_gXxtSwLqyNP1gVPfXjHN5DPI/s1600/red+bird.png

6. Burung Twitter Warna Hitam
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDPMDpIBpF9k_-yiNo70K7c6-67w6uWOK7LJQZ8Yab6jZJUridWQ3UGu8GxrLfecj1HZvz8BtcgQtoJDiwkAu8oHpXYJTzWuh0QBNFQGA88Kqf5i9k3zb0Kn55ApgzHd-fi9OBZUQ2vOY/s1600/black+bird.png

7. Burung Twitter Warna Putih
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheuh0E_8WMfI9EdRyT59Ew_fgloR9K6Zn4WwfC5MnHM8qiCNX0mYhw1a56hJLttfhUm1zoL3RmctuU7TByMwzM7XsMBW1DbGWU5nhthrC7JuAh_W7qB3HPSh6Cr_JVLknN9Kly78RPIzs/s1600/white+bird.png

8. Burung Twitter Warna Warni ke 1
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioUFHf24cdpObskTPIn2IQrC_1zkPTHmD0869iWoauAyXZ_W4k1IeKnA1cV_JYrOJxfuCWwTuz6Jx__qtYdW20RqvGhgtlcWj-x7hiS1IvVnuBQ7PA1yef2sl-N3PLcEb_f8nCSqNChjc/s1600/twitter+bird+unik.png

9. Burung Twitter Warna Warni ke 2
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEXfaN1Q7BOGbZo0G7wVW8qlqzI44uihBaZ4RHkPsm4VPAacNc0vFpox6Zj7q1ymhK3LWVW-0lK-hlvrXXhHyZAC_wq0d8aGgExXPMTEmp-mbEpoPCp3-ZYjpJBTs0qlXO9abAbpz43vk/s1600/twitter-b22ird-unik.gif
»»  READMORE...
Tidak ada komentar:
0

Cara membuat tombol "klik show" di postingan Blog

Demo
Klik show untuk melihat
Masukkan tulisanmu di sini




Dahulu saya tidak terlalu mengerti tentang tutorial blog dan cara pembuatan nya, namun setelah cukup lama menggeluti dunia blog. saya paham beberapa tutorial yg ada dan pada postingan kali ini saya akan memberitahukan cara membuat tombol "klik show" pada postingan.
Beberapa diantara kamu mgkn sudah menegetahui bagaimana cara pembuatan nya dan bagi yg belum tau, Berikut ini akan saya sampaikan cara-caranya beserta keterangan gambar. Tutorial ini saya dapatkan dari blog yg pernah saya singgahi.


 nah silakan kamu ikuti cara-cara berikut ini.

Bagi teman-teman yang ingin memasang tombol show hide di blog / postingan, caranya gampang banget nih. Teman-teman hanya perlu mengcopy paste kode HTML di bawah ini :
<div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</small></b>
<input value="Show" 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"></div>
<div style="border: 1px inset; margin: 0px; padding: 6px;"><div style="display: none;">
Masukkan tulisanmu di sini
</div></div></div>

Lalu paste code di atas dan jangan lupa mengganti kata yang digaris tengah yang berwarna merah dengan kata atau kode yang ingin teman-teman masukkan. Teman-teman juga bisa mengganti kata yang berwarna biru dengan kata yang diinginkan.

Masukkan kode di atas ke dalam postingan atau di sidebar blog teman-teman, maka hasilnya bisa dilihat di bawah ini.
»»  READMORE...
Tidak ada komentar:
0

Cara membuat widget melayang pada Blog

Cara membuat widget melayang pada blog. Terutama yg akan Tempat Nongkrong bahas yakni membuat widget melayang pada pengguna blogspot, manfaat dari widget melayang itu sendiri banyak, biasanya di gunakan untuk ditempati iklan berbasis PPC atau iklan yg begitu penting yg sangat terbatas waktu promosinya yang di maksudkan agar pengunjung tahu bahwa ada bisnis yang penting sekarang ini.
Widget melayang ini bisa kita atur tata letaknya entah mau d letakan sebelah kiri, kanan, atas maupun bawah pada posisi blog, nanti akan saya terangkan di bawah.
Untuk tampilan besar kecilnya ukuran widget melayang ini tergantung pada isi yang akan kita tempatkan.
Jika widget melayang ini kita tempati iklan berbasis PPC, maka ukuran-y akan menyesuaikan dgn ukuran iklan, untuk contohnya bisa di lihat DISINI
Bagaimana apakah kamu tertarik untuk membuatnya? Jika ya mari kita lakukan percobaan nya :D
Silahkan copy paste script di bawah ini pada widget HTML/Javascript.
Jika bingung apa itu widget HTML/Javascript silahkan ikuti petunjuknya:

Langkah-Langkah >>
  • masuk ke dasboard blog kamu.
  • pilih Rancangan
  • pada elemen halaman klik ''Tambah widget''
  • Dan pilih Widget HTML/Javascript
  • kemudian paste-kan script di bawah ini.
<style type="text/css"> #gb{ position:fixed; top:10px; z-index:+1000; } * html #gb{position:relative;} .gbcontent{float:left;margin-left:220px; border:2px solid #bb0000; background:#eeeeee; 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.top = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script> <div id="gb"> <div class="gbtab" onclick="showHideGB()"> </div> <div class="gbcontent"> <div style="text-align:right"> <a href="javascript:showHideGB()"> .:[Close][Klik 2x]:. </a> </div> <center> silahkan tempatkan kode iklan atau banner atau teks atau apalah terserah kamu disini yah</center> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.center = (30-gb.offsetWidth).toString() + "px"; </script></div></div>
  • Simpan
Perhatikan pada tulisan yang berwarna ungu pada script di atas, di situ berisi tentang pengaturan tentang posisi, background,border widget melayang tersebut. Atur sesuai dg keinginan kamu apakah ingin di tempatkan di bagian kiri atau kanan.
»»  READMORE...
Tidak ada komentar:
0

Cara membuat bingkai pada tulisan atau sidebar


Hampir 2 pekan lebih gak ada terbitkan berita baru di blog ini gan.. hehe

 maklum gan, lagi sibuk kuliah, uda gtu lagi ada sesuatu yg lagi dipelajari tntang komputer, mumpung lagi ada waktu kosong ni.. terbitkan sesuatu.. ah.. :D

yda, daripada terlalu banyak cerita tntang saya gan, mending duduk ambil teh/kopi baca dulu ini trick yg baru z saya dapat.. hehe

pasti udah banyak yg tw, karena trick ini uda lama bgt byk yg tw..
saya baru tw.. wkwk
maklum gan masih newbie.. :D

Pengen gak kyk gini?
Cara membuat bingkai pada tulisan atau sidebar? Mw tw caranya?

Lanjut z bacanya.. hehe
mumpung gratis..!!!

Langkah-Langkah :
1. Masuk ke blog/blogger
2. Pilih Menu tata letak
3. Kemudian Tambah Gadget
4. Tambah (+) HTML/JAVA SCRIPT
5. Copy code dibawah ini...
<div style="border: 4px double #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
Tulisan Anda...
</div>

 6. Paste/pindahkan kode yg telah teman copy td.. ke (+) HTML/JAVA SCRIPT
7. Selesai
Ctt :
Kode berwarna Merah isi dengan kata-kata yg sobat inginkan..
Kode berwarna Hijau ukuran kotak nantinya..

 Cara memasang di Posting :
Copy-kan kode diatas dalam area “HTML” dan tulis artikel anda hingga selesai dan kembali ke mode “Visual“.
»»  READMORE...
Tidak ada komentar:
0

Cara membuat KOTAK scrool pada BLOG

Hy sahabat blogger semua,, hehehe
udah lama ni gak memposting sesuatu di blog, hehe maklum lg sibuk kuliah..
kali ini saya akan mengajarkan kepada teman-teman semua..
bagaimana sih membuat kotak scrool pada BLOG ?

 mungkin udah banyak orang yg tau, tp yg blum??  hehehe :D
yda, deh.. dr pada banyak basa basi..
langsung z kita ke TKP...
hehehe

 Langkah-Langkah
1. Masuk ke blog/blogger
2. Pilih menu tata letak
3. Kemudian Tambah Gadget
4. Tambah (+) HTML/JAVA SCRIPT
5. Copy code dibawah ini...
<span><span style="font-style: italic;"><span style="font-style: italic;"><div style="height: 100px; width: 400px; font: 16px/26px Georgia,Garamond,Serif; overflow: scroll;">Masukan Tulisan atau gambar di sini
</div>
</span></span></span>

6. Paste/pindahkan kode yg telah teman copy td.. ke (+) HTML/JAVA SCRIPT
7. Selesai

Ctt :
Warna Merah teman ganti dengan kalimat/kata-kata teman sendiri..

Klo mw lihat hasil nya..
langsung z lihat di bawah ini teman-teman.. hehehe

 Demo :
Masukan Tulisan atau gambar di sini


»»  READMORE...
Tidak ada komentar: