Membuat Menu Dengan Flashvortex
Halo sahabat blogger…ketemu lagi bareng we…hmm…oke di tutorial kali ini saya akan memberikan sedikit tips bagi anda semua yaitu membuat menu dengan flashvortex…caraini saya uraikan agar sobat blogger sejatiku bisa mengetahuinya eh kayaknya ny g’ cuma di blogspot…di web ato blog lainya bisa kuq memasang menu ini .. ) apa itu flashvortex?? Hmm kalo di pikir” sih semacam web yang nyedia’in beberapa icon”, banner”, n button” keren… Nah udah tau tow?? Oce langsung aja kita ke TKP let’s go…
Pertama” yg harus anda lakukan adalah :
- Silahkan anda kunjungi situs flashvortex —> di sini.
- Kalow udah klik “menus”.
- Nah silahkan anda pilih yang mana anda suka…!! Sebagai contoh saya akan pilih yang menu “vertical”.
- Setelah anda pilih” mana yang bagus, tyus klik “Click Here To Edit This” .
- Oke searang menuju ke langkah berikutnya yaitu mengisi kolom” yang tersedia.
- Isilah kolom pertama “button labels” sesuai keinginan anda (ini adalah daftar nama menu anda) contoh missal, saya menulis : Home, Award, Astronomi, Tutorial Blogspot, Tutorial WordPress, Tutorial Facebook, Tutorial Internet, dst (gantilah sesuai keinginan anda).
- Untuk selanjutnya yaitu mengisi kolom kedua “buttons should link to” dengan link yang anda sukai (inget setiap text yang anda isikan di “button labels” akan mewakili link di “buttons should” contoh : Jika tadi saya menulis “Home” di kolom pertama maka saya menulis linknya di kolom kedua misalnya : “http://caraindra.blogspot.com” (inget hanya linknya saja yang di tulis !!). kalow masih kurang jelas lihat gambar di bawah :
- Di kolom ketiga biarkan kosong.
- Di “step 3″ biarkan seperti itu.
- Pada “step 4″ silahkan pilig beckground gambarnya sesuai keinginan anda.
- Nah kalau sudah langsung klik “Generate Animation”
- After that…—sok inggris..kkk ) save dan download “flashfortex.swf” kalo g’salah
- Upload flashfortex.swf tadi ke situs” yang slama ini anda gunakan untuk share…kalo we biasanya upload lwt photobucket ato googlepages….yah pokoknya upload lah terserah mau kemana yang penting tau alamat URL gambar yg telah kamu upload…
- Nhah…!! Sekarang login ke blogger tyus udah tau tow carnya?? yaitu masuk ke “rancangan” –> “edit html” –> centang pada kolom “expand widget templates” masukkan kode ini di bawah kode :
<head><script src= http://5766844314391778075-a-1802744773732722657-s-sites.googlegroups.com/site/indrasites/files/flashvortex.swf> </script>
- Eeeiit….inget ganti kode warna merah di atas, dengan url gambar milik kamu tadi yg udh di upload.
- Nah kalaw dah simpan template anda
- EEH belum selesai !! masih masuk lagi ke “add a gadget” –> “html javascript” n masukkan ny code ked lm kotak yang tersedia :
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0″ width=”405″ height=”39″>
<param name=”movie” value=”flashvortex.swf” />
<param name=”quality” value=”best” />
<param name=”menu” value=”true” />
<param name=”allowScriptAccess” value=”always” />
<embed src=”flashvortex.swf” quality=”best” menu=”true” width=”405″ height=”39″ type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” allowScriptAccess=”always”/>
</object>
<param name=”menu” value=”true” />
<param name=”allowScriptAccess” value=”always” />
<embed src=”flashvortex.swf” quality=”best” menu=”true” width=”405″ height=”39″ type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” allowScriptAccess=”always”/>
</object>
- ganti kode warna merah dengan url gambar kamu tadi….
- Simpan dan refresh blog anda…!!
- MISSION COMPLETE…!!!! Gimana bagus toow???
Untuk merubah ukuran pastinya udah tau tow?? Kalo belum mari kita “LANJUTKAN” !!
<object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0″ width=”405″ height=”39″>
<param name=”movie” value=”flashvortex.swf” />
<param name=”quality” value=”best” />
<param name=”menu” value=”true” />
<param name=”allowScriptAccess” value=”always” />
<embed src=”flashvortex.swf” quality=”best” menu=”true” width=”405″ height=”39″type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” allowScriptAccess=”always”/>
</object>
Pada kode warna biru itu adalah ukuran panjangnya…nah kode yang merah ntu ukuran lebarnya…gantilah angka itu sesuai keinginan anda…!!<param name=”movie” value=”flashvortex.swf” />
<param name=”quality” value=”best” />
<param name=”menu” value=”true” />
<param name=”allowScriptAccess” value=”always” />
<embed src=”flashvortex.swf” quality=”best” menu=”true” width=”405″ height=”39″type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” allowScriptAccess=”always”/>
</object>
Cara Membuat Tulisan Berjalan (Marquee)
Sering kali kita melihat blog yang dihiasi oleh tulisan atau kata-kata yang berjalan di blog teman-teman kita. mungkin sebagian besar sudah mengetahuinya. tapi disini ade mencoba untuk sharing kepada teman-teman yang belum mengetahui cara pembuatannya.
Note: yang akan ade bahas ini merupakan tulisan berjalan biasa bukan tulisan berjalan yang apabila ada mouse di area tulisan itu akan berhenti.
berikut cara pembuatannya :
- Login ke Blogger
- Kemudian klik Tata Letak dan Elemen Halaman
- Ketika sudah berada di Elemen Halaman klik Tambah Gadget
- Lalu pilih HTML/JavaScript
- Langkah selanjutnya masukkan kode marquee yang anda inginkan seperti contoh dibawah ini :
1. Teks berjalan dari kanan ke kiri
kode :
hasil :
2. Teks berjalan dari kiri ke kanan
kode :
hasil :
3. Teks berjalan bolak balik
kode :
hasil :
4. Teks berjalan dari atas ke bawah
kode :
hasil :
5. Teks berjalan dari bawah ke atas
kode :
hasil :
6. Teks berjalan mondar-mandir
kode :
hasil :
7. Teks berjalan zig-zag nembus
kode :
hasil :
8. Teks berjalan zig-zag mantul
kode :
hasil :
Contoh Tulisan Berjalan
Langkah Selanjutnya adalah mengganti tulisan
Contoh Tulisan Berjalandengan tulisan atau kata-kata yang anda inginkan.
Ket :
# direction="left/right/up/down" --> Mengatur arah gerakan teks.
# scrollamount="angka" --> mengatur kecepatan gerakan dalam pixel, semakin besar angka semakin cepat gerakannya.
# behavior="scroll/slide/alternate" --> Untuk mengatur perilaku gerakan :
~> Scroll --> teks bergerak berputar
~> Slide--> teks bergerak sekali lalu berhenti
~> Alternate --> teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik bo)
# Fungsi dari :
<center> ............. </center>adalah agar tulisan tersebut selalu berada di tengah.
SEMOGA BERHASIL
Semoga Bermanfaat..
01. Tulisan berjalan ke kanan.
02. Tulisan berjalan dengan gambar.
Tulisan berjalan dengan gambar
03. Tulisan berjalan ke atas.
Tulisan berjalan ketas
04. Tulisan dapat memantul.
05. Tulisan berjalan akan berhenti jika dibayangi cursor.
06. Tulisan zig-zag
07. Tulisan Bouncing around
8. Tulisan berjalan lambat
Banyak cara yang dibuat oleh setiap blogger untuk membuat tampilan blognya terkesan cantik, unik dan macam-macam deh. Diantaranya dengan modifikasi template yang sudah ada, memasang ragam widget dan ragam aksesoris blog termasuk mengganti tampilan cursor. pernah lihat suatu blog dengan cursor bertabur bintang seperti blog [disini]? Pingin mencobanya? Mudah kok, ikuti langkah-langkah berikut:
Membuat cursor bertabur bintang
1. Login ke blogger.
2.Masuk ke Layout–>Page Element
3.Tambahkan gadget HTML/JavaScript
4.Pilih kode taburan bintang dibawah ini.
Bintang Hijau
<script src=”http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.hijau.js” type=”text/javascript”></script>
Bintang Ungu
<script src=’http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.ungu.js’ type=”text/javascript”></script>
Bintang Merah
<script src=’http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.merah.js’ type=”text/javascript”></script>
Bintang Biru
<script src=’http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.biru.js’ type=”text/javascript”></script>
Bintang Putih
<script src=’http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.putih.js’ type=”text/javascript”></script>
5.Kopi salah satu kode diatas dan simpan.
6. Jangan lupa save dan save lagi.
SELAMAT MENCOBA
Cara Mudah Membuat Tombol Tweet & Like di Blogger
Malem temen-temen....Setelah ngupyek-ngupyek tentang membuat text area,
kali ini saya akan berbagi cara menampilkan tombol tweet, like, dan share di postingan.
Contohnya seperti di blog saya ini...
Gunanya sih udah jelas memudahkan pengunjung menshare postingan,
keuntungan lain, kalau semakin banyak penungunjung yang menshare maka traffic di blog kita otomatis akan meningkat...
Langsung aja nih caranya...:
1. Setelah masuk tab Rancangan pilih edit HTML
2. Centang pilihan Expand Widget Templates
3. Cari kode berikut : (kalau kesulitan pake tombol F3)
<data:post.body/>
4. Tambahkan kodenya, bisa di atas
<data:post.body/>atau di bawahnya.
Tergantung tombol itu mau diletakkan di atas atau di bawah postingan
5. Ni kodenya:
<iframe id='websites_iframe' expr:src='"http://www.linksalpha.com/social?link=" + data:post.url + ""' frameborder='0' height='25px' scrolling='no' width='320px'/>
6. Tinggal save deh...
Hasilnya akan seperti ini:
Cara Membuat Tombol Share Facebook, Twitter dan Google +
Cara membuat tombol Share atau Share button Blogger
- Pertama silahkan login blog anda
- Klik menu Design > Edit HTML > centang expand widget templates
- Cari kode <div class='post-body entry-content'> atau class='post-body entry-content' dan biasanya ada 2 kode tersebut, pakailah kode yang pertama
- Jika sudah ketemu, copy kode dibawah ini dan paste tepat diatas kode <div class='post-body entry-content'>
Kode
- Langkah terahir yaitu simpan template
<div class='post-body entry-content'>
melainkan kode di bawah ini
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id'>
Pahami dulu, baru praktekkan cara membuat tombol share atau share button blogger type ini.
Manfaat Tombol Share / Share button blogger
Manfaat tombol share adalah memberikan kesempatan para pengunjung / visitor blog agar mereka bisa berbagi dengan teman atau jaringan mereka melalui fitur share yang tersedia pada blog anda. Tentunya ini sangat penting, secara langsung pengunjung akan mengajak orang lain untuk megunjungi blog anda. Selamat kebanjiran visitor dengan memasang tombol share / share button pada blog anda.Cara membuat tombol twitter bergerak tidaklah sulit, hanya dengan beberapa kali klik tombol twitter langsung jadi, karena kita tinggal memilih salah satu diantara beberapa tombol twitter yang telah disediakan oleh situs www.twitterflash.net sesuai dengan keinginan. contohnya bisa dilihat disidebar blog ini.
- Langkah pembuatannya yang pertama kunjungi http://www.twitterflash.net/?r=image
- Pilih salah satu tombol twitter yang sobat suka, jika sudah dipilih klik Get the button
- Maka akan tampil halaman seperti gambar di bawah ini, kemudian masukan id twitter sobat sendiri lalu klik Apply your Twitter Name to the code
- Setelah itu klik icon Klik Copy to Clipboard dan Copy paste kode yang sudah dibuat tadi ke dalam blog.
Langkah-langkah memasukan kode kedalam blog
- Login ke Blogger
- Kemudian Pilih Tata Letak
- Selanjutnya Klik tab Elemen Halaman dan Klik Tambah Gadget
- Pilih yang HTML/Java Script
- Masukan kode yang telah dibuat tadi ke dalam kolom HTML/Java Script
- Terakhir simpan template
Source : http://adibey.blogspot.com/2011/07/cara-membuat-tombol-twitter-bergerak.html#ixzz1fDCdbAPC
Cara Membuat Teks atau Tulisan Berwarna di Postingan Blog
The Next adalah cara bagaimana membuat teks atau tulisan berwarna di postingan blog. Adapun fungsi dari teks berwarna adalah untuk menentukan point-point mana yang dianggap penting dan perlu diperhatikan oleh pembaca. Mungkin para rekan blogger yang lain sudah membahas topik ini di blog mereka namun saya akan lebih membahasnya lebih detail, yah hitung-hitung untuk menambah postingan hehe.... .Wokeh ga usah berbelit-belit cekidot......
Perhatikan kode HTML di bawah ini :
Kode diatas nantinya akan mempunyai tampilan seperti ini
Pada angka #3300cc adalah kode warna tulisan, kode warna ini bisa anda ubah sesuai dengan keinginan, berikut kode-kode warna di HTML
Kode di atas merupakan beberapa contoh saja karena sangking terlalu banyaknya kode, tetapi pada umumnya warna yang dipakai adalah warna merah, biru dan hijau .Terlalu banyak warna terlalu berat pula nanti mata menyesuaikan hehe..
Gimana mudah bukan, semoga postingan ini bisa berguna untuk kita semua, Salam....
Perhatikan kode HTML di bawah ini :
Kode diatas nantinya akan mempunyai tampilan seperti ini
Membuat Teks Warna di Blog
Pada angka #3300cc adalah kode warna tulisan, kode warna ini bisa anda ubah sesuai dengan keinginan, berikut kode-kode warna di HTML
#ff0033 | OOOOOOOO | #3300cc | OOOOOOOO | #ffff33 | OOOOOOOO |
#cc9933 | OOOOOOOO | #99ffff | OOOOOOOO | #33ff66 | OOOOOOOO |
#ff0066 | OOOOOOOO | #00cc00 | OOOOOOOO | #00ff00 | OOOOOOOO |
#66ff00 | OOOOOOOO | #99ff66 | OOOOOOOO | #000066 | OOOOOOOO |
#330066 | OOOOOOOO | #660066 | OOOOOOOO | #990066 | OOOOOOOO |
#cc0066 | OOOOOOOO | #000000 | OOOOOOOO | #330000 | OOOOOOOO |
#660000 | OOOOOOOO | #990000 | OOOOOOOO | #cc0000 | OOOOOOOO |
Kode di atas merupakan beberapa contoh saja karena sangking terlalu banyaknya kode, tetapi pada umumnya warna yang dipakai adalah warna merah, biru dan hijau .Terlalu banyak warna terlalu berat pula nanti mata menyesuaikan hehe..
Gimana mudah bukan, semoga postingan ini bisa berguna untuk kita semua, Salam....
Read more: Cara Membuat Teks atau Tulisan Berwarna di Postingan Blog | Mas Bugie [dot] com http://www.masbugie.com/2010/04/cara-membuat-teks-atau-tulisan-berwarna.html#ixzz1fEHza9Ij
Cara Mudah Buat Link Warna Warni Di Blog
Hallo sobat! wah.. gak terasa hampir 2 minggu saya gak update. Apa kabar dunia? hemm.. kayaknya masih tetep baik-baik saja walau tanpa ada saya. hihi..
Sebelumnya coba sentuh/hover dulu tulisan di bawah ini.
“Cara Mudah Buat Link Warna Warni Di Blog“
Gimana? tertarik ingin membuatnya? Begini caranya :1. Download atau buka scriptnya disini.
2. Setelah kelihatan kodenya, silakan copy paste semuanya ke notepad dan simpan dengan dengan type file JS, misal link.js.
3. Upload file js tersebut ke server mana saja terserah. Yang penting link file-nya jangan lupa!
4. Buka file editor blog anda, kalau pake wordpress ada di bagian header.php, kalau blogspot ada di bagian Edit HTML kalau ndak salah..
5. Panggil file js tadi dengan cara meletakan script dibawah ini di bagian sebelum </head>
<script type="text/javascript" src="http://masyhury.web.id/linkcolorstyle.js"> </script>
Ganti yg warna merah dengan link file yang anda upload tadi. Kalau malas, pake link saya di atas juga boleh kok.. 6. Save dan lihat hasilnya…
kalau di sentuh, seperti di blog saya ini? hemm.. Apakah diantara anda ada juga yang bertanya demikian? Bagus, karena kali ini saya akan kasih tau caranya! Mudah kok..
Sebelumnya coba sentuh/hover dulu tulisan di bawah ini.
“Cara Mudah Buat Link Warna Warni Di Blog“
Gimana? tertarik ingin membuatnya? Begini caranya :1. Download atau buka scriptnya disini.
2. Setelah kelihatan kodenya, silakan copy paste semuanya ke notepad dan simpan dengan dengan type file JS, misal link.js.
3. Upload file js tersebut ke server mana saja terserah. Yang penting link file-nya jangan lupa!
4. Buka file editor blog anda, kalau pake wordpress ada di bagian header.php, kalau blogspot ada di bagian Edit HTML kalau ndak salah..
5. Panggil file js tadi dengan cara meletakan script dibawah ini di bagian sebelum </head>
<script type="text/javascript" src="http://masyhury.web.id/linkcolorstyle.js"> </script>
Ganti yg warna merah dengan link file yang anda upload tadi. Kalau malas, pake link saya di atas juga boleh kok.. 6. Save dan lihat hasilnya…
Nb : Bagi pengguna wordpress.com kayaknya masih belum bisa menerapkan cara ini. So, jangan protes ke saya yaw!
Kata para master, pemakaian javascript bisa memberatkan blog. Tapi saya pikir script yang ini tidak terlalu memberatkan kok, size-nya sangat ringan. Jadi ya gitu deh..
Semoga bermanfaat..
Cara Membuat Teks Berwarna di Blog Anda
Kali ini kita akan membahas, bagaimana sih cara membuat tulisan berwarna di Blog teman-teman semua...tak usa kuatir gampang kok... cuma teman-teman harus pake kaca mata rabun dekat aja biar mata teman-teman ga sakit alias puyeng dalam meng-edit kode-kode HTML tersebut....Dari pada lama ngomongnya...langsung aja yukkkkkkk...
Kode diatas nantinya akan mempunyai tampilan seperti ini
Membuat Teks Warna di Blog
Pada angka #3300cc adalah kode warna tulisan, kode warna ini bisa anda ubah sesuai dengan keinginan, berikut kode-kode warna di HTML
#ff0033 | OOOOOOOO | #3300cc | OOOOOOOO | #ffff33 | OOOOOOOO |
#cc9933 | OOOOOOOO | #99ffff | OOOOOOOO | #33ff66 | OOOOOOOO |
#ff0066 | OOOOOOOO | #00cc00 | OOOOOOOO | #00ff00 | OOOOOOOO |
#66ff00 | OOOOOOOO | #99ff66 | OOOOOOOO | #000066 | OOOOOOOO |
#330066 | OOOOOOOO | #660066 | OOOOOOOO | #990066 | OOOOOOOO |
#cc0066 | OOOOOOOO | #000000 | OOOOOOOO | #330000 | OOOOOOOO |
#660000 | OOOOOOOO | #990000 | OOOOOOOO | #cc0000 | OOOOOOOO |
Kode-kode di atas cuma sebagian kecil yang dapat teman-teman pakai dalam uji coba ini...tapi untuk ketahuan teman-teman masi banyak loh kode-kode HTML yang di sediakan...teman-teman bisa seacrh aja di google. tapi pada umumnya nih warna pelangi yang sering di pakai...hehehehe merah, kuning biru dan hijau . Terlalu banyak warna maka akan emakin cepat teman-teman memakai kaca mata rabun dekat...hehehehehe...becanda...piiiiiiiiiiiiiiissss...
Gimana...gamapang kan....semoga tampilan blog teman-teman semakin menarik...Ok..
Sukses....