Tips Sederhana Membuat News Feed Ticker Pada Blogger


Postingan ini sebenarnya sudah ane bahas di Membuat Slideshow News/Feed Ticker, tahun lalu. Tapi ternyata masih banyak orang yang bertanya-tanya bagaimana blog ini bisa memiliki feed ticker dengan slideshow seperti yang ada di bawah postingan ini.

Kalau pada postingan yang dulu, ane menjelaskan tentang kehebatan situs BlastCasta, yang dapat membuat beragam widget feed dari situs web, blog, atau akun twitter. Tapi kali ini ane langsung aja memberi kode html yang dapat di copy & paste ke dalam widget "Kode HTML/Javascript".

Caranya sederhana, masuk pada "Tata Letak" Blogger, lalu pilih "tambah gadget", dan pilih "Kode HTML/Javascript". Setelah muncul, berikan judul sesuka hati, dan masukkan kode berikut di dalamnya:


Kode Feed Ticker:

<center>
<br/>
<table border="0" width="600" cellspacing="0" cellpadding="0">
        <tr>
            <td width="173">
<img border="0" src="http://i919.photobucket.com/albums/ad33/mimuha/rssicon2.gif" height="50" align="right"/></td>
            <td>
<p>Artikel lainnya:</p>
<div id="TickerBC28832702" style="width: 330px;height: 30px;overflow: auto;overflow-x: hidden;overflow-y: hidden;border-style: none;border-width: 0;border-color: #FFFFFF;" class="bc_ticker">
<table width="100%">
    <tr align="left">
        <td width="10" style="color: #336699; font-size: 8pt; font-family: Verdana,Geneva;">&nbsp;</td>
        <td id="TickerContentBC28832702" style="vertical-align: middle;" class="bc_tickercontent">
            <a id="TickerLinkBC28832702" style="text-decoration: none;" href="javascript: ;" class="bc_tickerlink" target="_top"><b><span id="TickerTitleBC28832702" style="color: #336699; font-size: 8pt; font-family: Verdana,Geneva;" class="bc_tickertitle"></span></b></a>  <span id="TickerSummaryBC28832702" style="color: #000000; font-size: 10pt; font-family: Verdana,Geneva;" class="bc_tickersummary"></span>
        </td>
        <td width="10" style="color: #336699; font-size: 8pt; font-family: Verdana,Geneva;">&nbsp;</td>
    </tr>
</table>
<!-- DO NOT CHANGE OR REMOVE THE FOLLOWING NOSCRIPT SECTION OR THE BLASTCASTA NEWS TICKER WILL NOT FUNCTION PROPERLY. -->
<noscript></noscript>
</div>

<script id="scr28832702" type="text/javascript"></script>
<script type="text/javascript">
setTimeout('document.getElementById(\'scr28832702\').src = (document.location.protocol == \'https:\' ? \'https\' : \'http\') + \'://www.poweringnews.com/ticker-js.aspx?feedurl=http%3A//em-mizan.blogspot.com/feeds/posts/default&changedelay=5&maxitems=-1&showsummary=0&objectid=28832702\'', 500);
</script>
</td>
        </tr>
    </table>
<br/>
</center>


Dengan kode di atas tampilan widget akan tampil sama persis seperti yang ada dalam blog ini. Perhatikan kode-kode berwarna hijau, ubah alamat URL em-mizan.blogspot.com dengan alamat blogspot kalian. Ubah juga font, color, dan size sesuka hati.

Sederhana kan..!! kalau begitu silahkan mencoba... ^^








klik yg bawah bos...!!!
Jumlah komentar : (31)

Kontes "Ekspresi Puisi Cinta Satu Bait" Berhadiah...!!! Ayo Ikutan....!!!


Ada yang menarik nih di blog mba Aliaz. Sobat blogger Wordpress yang satu ini mengadakan kontes berhadiah dengan cara membuat PUISI CINTA yang panjangnya satu bait dalam postingan blog kalian. 5 besar puisi yang Aliaz anggap cukup oke akan mendapatkan hadiah yang lumayan. Batik asli dari Pekalongan... ^^

Kebetulan ane belum punya batik asli dari Pekalongan, oleh karena itu ane ikutan dah kontesnya. Simak puisi ane berikut ini ya!

AKU CINTA KAU?

AKU CINTA KAU!!!!
Alasannya karena aku cinta dia,
mereka, serta semua materi dan iluminasi dari yang paling kecil
sampai yang paling besar di dunia ini...

Tidak lupa terima kasih juga buat Kang Tejo & Abeedee atas infonya. Untuk keterangan lebih lengkap mengenai kontes ini, silahkan kunjungi Ekspresi Puisi Cinta Satu Bait.









klik yg bawah bos...!!!
Jumlah komentar : (23)

Udah..!! Hindari Blogging, demi Judul..... Oh Judul...! -_-' (Curhatan nih..!)


Pusing.. Pusing...! Bener-bener pusing dah..!! Ngemenk-ngemenk sori ya kalo postingan kali ini tidak seperti biasanya, maklum lagi pusing, jadi ane tulis aja apa yang ada.

Ane nulis kayak gini gara-gara mengalami dilema hidup (dilema melulu... -_-'). Ane cuma bisa bilang, bagi ente-ente sobat blogger yang sekarang lagi kuliah, khususnya di semester-semester akhir, lebih baik jangan, mengenal Blogger deh...!!

"Blog itu adalah candu", itu yang sekarang ada di benak ane.. -_-', rasa fun, enjoy, dan wadah berekspresi, sampai akhirnya pada titik ini, ane kesulitan menyeimbangkan gaya hidup ane antara dunia nyata dan maya.

Ane memulai blog ini pada bulan Nopember 2009, saat ane sedang mendekati Ujian Akhir Semester 7, saat ane baru selesai membuat laporan Kerja Praktek, saat ane udah tenang-tenang, dan fokus pada ujian. Dimulai dari blog biasa yang tidak ada apa-apanya, sampai sekarang jadi blog yang bikin ane jadi sibuk begini. Ini akibatnya kalo fenomena blog dijadikan gaya hidup, atau trend. Hidup ane jadi cukup kacau sob..!! Nilai kuliah turun, waktu untuk tidur jadi berkurang, kesehatan apalagi. Yang lebih parah dari itu semua, ane malah jadi lebih kecanduan blogging nih..!!

Saat ini ane menjadi orang yang hampir lupa dengan kewajiban. Saat ane menulis postingan kali ini, adalah hari 'H -1' deadline ane mengumpulkan daftar judul yang ane harus ajukan sebagai skripsi, yang nantinya harus ane pilih untuk ane kerjain secara serius. Mungkin karena emang kepribadian ane yang pemalas juga, membuat ane banyak membuang-buang waktu dengan hal-hal sesaat yang bisa menghibur ane.

Yang menjadi keinginan ane sekarang adalah menjalani hak dan kewajiban ane secara seimbang. Klo bisa kuliah jalan, blogging juga jalan.. hmm... ane perlu management waktu nih..!! Ada yang punya masukan buat judul skripsi ane...??? Ane jurusan Ilmu Komunikasi nih..!! Mau ngambil skripsi tentang kegiatan blogging.. kira-kira apa ya??










klik yg bawah bos...!!!
Jumlah komentar : (23)

Membuat Alternatif Twitter Update Widget dengan Javascript


Postingan ini sebenarnya mau diterbitkan bulan lalu, tapi karena tanggung, lebih baik diterbitkan awal bulan ini saja biar lebih terasa nuansa semangat tanggal mudanya.. ^^ ..

Beberapa dari sobat blogger pasti pernah dan /atau masih menggunakan widget Twitter Updates pada platform blogger yang dibuat oleh BloggerBuster. Kali ini, kalian bisa membuat alternatifnya dengan kode Javascript. Keuntungannya apa...!!?? Hehe... Tentu saja widget ini jadi lebih gampang dimodifikasi dibandingkan dengan widget yang biasa, meskipun mungkin membingungkan, tapi tenang saja, karena saya akan membantu langkan demi langkah agar widget ini lebih mudah di utak-atik.

Masuk pada Dasbor Blogger, kemudian pilih Tata Letak (Edit Layout), lalu pilih Edit HTML, kemudian beri centang pada Expand Template Widget. Cari kode ]]></b:skin> (gunakan Ctrl+F pada browser untuk mencari kode) kemudian letakkan kode CSS berikut tepat di atasnya.

.twittop{margin:5px 0px 0px 0px;height:30px;background:#141313 url(http://3.bp.blogspot.com/_xfdD6S9fOk4/Sl6f0c4BBSI/AAAAAAAABhY/F2zoq7Zhxgg/s1600/twitop.jpg) no-repeat; /* Gambar Header*/
width:335px;}

#twitter_div{width:333px; /* Lebar Widget*/
float:left;height:100%;padding:0px 0px;margin:0px 0px;background:#fff;border-left:1px solid #fff;border-right:1px solid #fff;border-bottom:1px solid #fff;font-family:Tahoma,Century gothic,verdana, Arial, sans-serif; /* Jenis Huruf*/ }

ul#twitter_update_list{list-style:none;padding: 0px 0px;margin:0px 0px;}

ul#twitter_update_list li{font-size: 11px; /* Ukuran Teks Status*/
list-style:none; /* pilih bentuk daftar circle, disc, square, atau none*/
padding: 5px 5px;margin:0px 0px;line-height:18px;background:#B5D3DD url(http://2.bp.blogspot.com/_xfdD6S9fOk4/Sl6fcQZI99I/AAAAAAAABhI/FLFxWOLf-4U/s1600/twit.jpg) repeat-x; /* Gambar Background Update Status*/
border-bottom:1px dotted #ccc; /* Warna Border*/
color:#222; /* Warna Teks Update Status*/}

/* Berikut atur saja sama seperti di atas, tetapi yang ini untuk saat mouse over (ketika kursor mouse menghampiri kotak)*/
ul#twitter_update_list li:hover{font-size: 11px; /* Ukuran Teks Status saat hover*/
list-style:none; /* pilih bentuk daftar saat hover*/
padding: 5px 5px;
margin:0px 0px;
line-height:18px;
background:#dcdcdc url(http://3.bp.blogspot.com/_xfdD6S9fOk4/Sl6f0AX6X-I/AAAAAAAABhQ/4rR0t3qHWX4/s1600/twith.jpg) repeat-x; /* Gambar Background Update Status saat hover*/
border-bottom:1px dotted #ccc;}

/* Berikut aturan untuk tautan (link)*/
#twitter_update_list li a:link, #twitter_update_list li a:visited{color:#D3116D;}

#twitter_update_list li a:hover{color:#BC0C0F; /* Warna Teks Links saat hover*/ }

Perhatikan teks catatan berwarna biru, kalian tinggal mengganti lokasi gambar atau bisa juga hanya menggunakan warna, ubah warna & ukuran teks dsb. Setelah itu Simpan (Save), lalu masuk pada Elemen Halaman (Page Elements), kemudian tambah gadget, pilih Kode HTML/Javascript, dan paste-kan kode javascript berikut, kemudian Simpan.

<div class='twittop'> </div> <div id='twitter_div'> <ul id='twitter_update_list'/> </div>
<script src='http://twitter.com/javascripts/blogger.js' type='text/javascript'/> <script src='http://twitter.com/statuses/user_timeline/ID-user-twitter.json?callback=twitterCallback2&count=5' type='text/javascript'/><br/>
<center><a href='http://twitter.com/ID-user-twitter'>Ikuti Saya di Twitter</a></center>

Ubah ID-user-twitter dengan user twitter milik kalian, dan ganti angka 5 yang menunjukkan jumlah tweet yang akan muncul pada widget.

Cara ini kelihatan rumit, tapi kalau diikuti dengan hati-hati dapat memuaskan sobat semua, karena bentuknya yang lebih unik, orisinil buatan kalian sendiri, baik itu terlihat dari gambar, warna, bullet, dan gambar.

Contoh widget ini terdapat pada bagian bawah blog ini, tapi pada blog ini saya tidak menggunakan gambar background, hanya menggunakan permainan warna saja.

Ini cuma untuk latihan dan menambah pengalaman saja, jadi jangan ragu mencoba... ^^ ...










klik yg bawah bos...!!!
Jumlah komentar : (7)

Dari Mangatar, Babytar, Sampai Zombietar. Tinggal Pilih Saja..!!


Sering banget ane lihat avatar dalam situs jejaring sosial yang unik-unik, dan kreatif. Lebih sering lagi ane ngeliat yang bentuknya narsisme, tapi ga masalah sih... Sebelumnya kalian paham ga maksudnya avatar...!? (bukan film lho..! ^^, bukan juga kartun). Avatar itu yang biasa dijadikan foto profil di situs jejaring sosial (blogger, FB, Twitter, dll.)

Membuat avatar sendiri biasanya penting bagi kalian yang mementingkan eksistensi (Chiee...) biar lebih dianggap oleh orang lain, biar saat seseorang melihat foto profil kalian, mereka akan langsung tahu bahwa itu adalah foto milik kalian.

Bagi sebagian orang mungkin memasang foto sendiri sebagai foto profil menjadi sebuah keharusan. Tapi kalau kalian memiliki jiwa misterius, jiwa unik, kreatif, atau jiwa pahlawan bertopeng (atau mungkin kalian salah satu orang yang malu dengan wajah sendiri.. hehe... amit2 dah -_-'), kalian pasti lebih memilih foto profil yang berbeda dari yang lain, bisa berupa gambar kartun, pemandangan, atau objek lainnya. Kalau mencari foto profil yang unik, kalian bisa menggunakan alternatif gambar dengan situs jejaring pembuat foto wajah online di internet.

Kalian tau Mangatar, yaitu istilah yang  merujuk pada avatar yang gambarnya berupa manga (istilah komik Jepang [Naruto, Doraemon, dll.]). Nah...! untuk membuat foto sendiri berbentuk manga kalian bisa memanfaatkan situs-situs jejaring seperti DoppelMe, yaitu situs yang dapat membuat mangatar online, atau pilihan lain seperti Tektek.org Dream Avatar, yaitu situs pembuat custom avatar dengan bentuk seperti karakter 2D game RPG (Final Fantasy, Lunar, dll.)

Untuk mangatar sendiri, yang menjadi favorit ane pribadi adalah situs FaceYourManga. Tampilannya cukup sederhana, kita dapat membuat dan meng-edit gambar berdasarkan rambut, mata, bentuk kepala, bibir, hidung, dsb. Kenapa ane merekomendasikan yang ini alasannya karena hasil jadi dari Mangatar situs ini tampilannya hampir mewakili seluruh tampilan karikatur bentuk wajah manusia. Plus, tidak perlu daftar lagi..! ^^

Sebagai tambahan, kalau kalian tertarik dengan mengedit foto yang akan dijadikan avatar mungkin situs Make Your Baby ini bisa menjadi pilihan. Adalah sebuah situs yang dapat membuat gambar wajah bayi yang diprediksikan sebagai keturunan kita. Cukup upload foto wajah kalian, dan gabungkan dengan foto wajah lain. Uniknya lagi foto wajah kalian bisa digabunggan dengan foto wajah para selebritas lho..!! ^^

Tambahan satu lagi yang ini jauh lebih ekstrim...!! Karena situs Zombiefy-Yourself dapat mengubah wajah kalian menjadi zombie...!! (-_-' serem sih, tapi unik juga) Tinggal upload foto wajah kalian, dan beri efek-efek zombie cukup dengan dragg & drop.

Menarik kan...!!? Kalau begitu selamat menuju TKP... ^^











klik yg bawah bos...!!!
Jumlah komentar : (6)

"SPECIAL TAGS + AWARD" PERDANA DARI CATATAN DARING ^^v



Beberapa hari lalu ane cukup kaget ada beberapa sobat blogger yang berbaik hati memberikan ane beberapa bonus berupa metode backlink gratis melalui metode pemberian Award dan Tag. Yang bikin ane kaget adalah mereka memberikannya pada waktu yang bersamaan (Janjian kali ya....!! ^^). Maka dari pada itu, ane pribadi benar-benar mengucapkan terima kasih pada para sobat blogger ane khususnya pada Kang Tejo, Kucing Tengil, Sii Wina, dan si bungsu Mauren Fitri (jd kayak yang bersaudara.. -_-').

Selanjutnya ane bakalan persembahkan award ini pada beberapa sobat blogger ane yang lain, antara lain:
Bos Crockie, Bos Hunits, Bos Boja, Bos Cilaw, Bos Local, Bos Stroomz, Bos Sikumbang, Bos Ari, dan Mba Dwi ^^
Kenapa ane memilih sobat di atas, adalah karena para blogger tersebut ane anggap sebagai blogger yang mementingkan jalinan pertemanan dan silaturahmi antara satu sama lain... (Bukan sekadar nulis "Blogwalking" aja, trus ilang entah kemana... ^^).

Ini logo Award ane nih:



AWARD

AWARD Mizan: []
Terima kasih untuk Mauren Fitri yang telah memberikan Award terlebih dahulu pada ane dan sembilan orang lainnya.

Bagi siapa saja yang menerima award ini diharuskan untuk membagikan kembali award ini kepada sepuluh orang temannya. Selanjutnya, si penerima award harus meletakkan link-link berikut ini di blog atau artikel masing-masing:

  1. Irfan
  2. Boy
  3. Mas Doyok
  4. Rizky
  5. kupu.miss.oemang
  6. Shulayman
  7. Organisasi Pemuda Kenaran ( OPERA15 )
  8. Avanca Linux
  9. Mauren's Blog
  10. Mizan's Blog

Cara mendapatkan Backlink Gratis !!!
Sebelum kalian meletakkan link-link di atas, hapus terlebih dahulu peserta nomor 1 dari daftar. Sehingga semua peserta naik 1 level. Peserta nomor 2 menjadi nomor 1, nomor 3 jadi 2, dst. Kemudian masukkan link kamu sendiri di bagian paling bawah (nomor 10). Tapi ingat...!!!, kalian semua harus adil dalam menjalankannya. Jika tiap penerima award mampu memberikan award ini kepada 5 orang saja dan mereka semua mengerjakannya , maka jumlah backlink yang akan didapat adalah:

Ketika posisi kamu 10, jumlah backlink = 1
Posisi 9, jumlah backlink = 5
Posisi 8, jumlah backlink = 25
Posisi 7, jumlah backlink = 125
Posisi 6, jumlah backlink = 625
Posisi 5, jumlah backlink = 3,125
Posisi 4, jumlah backlink = 15,625
Posisi 3, jumlah backlink = 78,125
Posisi 2, jumlah backlink = 390,625
Posisi 1, jumlah backlink = 1,953,125


Dan semuanya menggunakan kata kunci yang kamu inginkan. Dari sisi SEO (Search Engine Optimation) kamu sudah mendapatkan 1,953,125 backlink dan keuntungannya blog kalian akan mendapatkan traffic tambahan, apalagi jika ada yang meng-klik link ke blog kalian.

Silahkan copy paste tulisan di atas, dan hilangkan peserta nomor 1 lalu tambahkan link blog/website kamu di posisi 10. Ingat..!! kamu harus mulai dari posisi 10 agar hasilnya maksimal. Karena jika kamu tiba2 di posisi 1, maka link kalian akan hilang begitu ada yang masuk ke posisi 10.



BOOK TAG

BOOK TAG Mizan: []
Berikut Tag Buku dari Kang Tejo yang memilih ane sebagai penerus Tag Buku ini. Berikut adalah buku yang pernah, sedang, dan akan ane baca karena menjadi favorit ane pribadi ^^:

Dan Brown - The Da Vinci Code : Menegangkan sob... ^^;
Kurt Vonnegut - Gempa Waktu (Time Quake) : Penuh kritik sosial, sangat memberi motivasi;
J.K. Rowling - Harry Potter : Ga perlu ane jelasin semua juga pada tau.. -_-;
Deddy Mulyana & Jallaluddin Rakhmat - Komunikasi AntarBudaya : Keliatannya kayak buku studi perkuliahan, tapi sebenarnya penuh dengan informasi penting yang bisa bermanfaat;
Rhonda Byrne - The Secrets : Buku motivasi yang menarik..^^

Berdasarkan mandat dari Kang Tejo ane berharap Tag ini mau dilanjutkan lagi oleh sobat-sobat sekalian, dengan cara memposting lagi, buku-buku yang menjadi favorit sobat..^^.v.



QUESTION TAG

QUESTION TAG Mizan: []
Berikut ini sambungan dari kelanjutan tag pertanyaan yang diberikan Kucing Tengil ke ane, kemudia ane jawab dah sebisa ane...

Where is your cell phone now? On the bed

Relationship? Lose it. :P

Your hair? Black and long hair...(in a masculine ways okay..!! ^^)

Work? nope

Young sisters? don't


Your favorit thing? My desktop PC, a guitar, and some blue jeans that start to turn into yellow.. :D

Your dream last night? forgotten


Your favorit drink? Milk. :d

Your dream car? Old VW Beetle


Your shoes? Pantopel

Your fears? never think about it, just found it out, but forgot it in a second.

What do you want to be in 10 years? Rich man.. ^^

Who did your hang out with last week? can't remember

What are you not good at? Mathemathics

One of your wish list item? Classic Gibson SG Guitar

Where you grew up? Lombok, Jakarta, Bandung.

Last thing you did? Writing this post... ;)

What are you wearing? don't want to talk about it.. -_-'

Your computer? Intel LGA775 Dual Core 1.6GHz, 2GB RAM, 200GB HDD, ATI HD 2600PRO, etc

Your pet? never

Your life? mysterious

Missing? (hilang) money, don't know how.. :(

What are you thingking right now? Why I should answer this stupid question...? (Ahh.. for the bloggers ^^v)

Your car? None, yet..

Your kitchen? Is there any better questions than this... >:-(

Your favorit color? White, black, grey.

Last the you laugh? dunno, even if i know, dont want to answer it.. hehehehe... (hey that was the last time... ^^)

Last time you cried?Don't remember

Love? Why do these question was so unspecificly

So who wants to share their ONEs? how about? :-/ ???????

Akhirnya selesai juga postingan ini.. Capek juga ane.. semoga yang lain juga tidak ikut capek membaca ya... -_-' ... tp kalau tertarik, sobat juga bisa memilih Tag ini untuk dilanjutkan dalam postingan sendiri, hufff... ^o^ ..


Selamat mengambil award-nya, sob! Tetap jalin tali silaturrohmi kepada para sobat blogger agar trafic blog-nya cepat. Selamat kepada para blogger yg mendapat award.....!! Kalau hanya mau posting salah satu dari ketiga pilihan ini juga tidak apa-apa... ^^ ...  Trims semuanya...! ^^v.. Keep Blogging, ane tunggu postingan berikutnya..










klik yg bawah bos...!!!
Jumlah komentar : (9)

Spoiler Unik untuk Blogger (Alternatif Spoiler dengan Kode HTML)


Kalian pernah melihat situs forum Kaskus?? (Kalo belum,, kemane aje lo...!!! hehehe.. ehhmm.. -_-'), Kalian pasti lekat dengan istilah 'Spoiler' (Bagi yang tidak tahu, contohnya ada di postingan ini). Spoiler dapat menyembunyikan sesuatu baik itu teks kalimat, gambar, tabel, widget chat, dll. Spoiler juga dipakai oleh Situs Ensiklopedia Online Wikipedia untuk membuat daftar isi dan menu pada tiap-tiap halaman judulnya.

Untuk membuatnya sendiri cukup menggunakan kode HTML yang sederhana. Kode tersebut dapat di copy & paste ke dalam widget blog dan dapat ditempatkan sesuka hati, atau bisa juga dipasang dalam postingan seperti postingan kali ini.. ^^

Berikut bentuk-bentuk spoiler yang dapat kalian gunakan beserta kodenya:



Judul Spoiler Biasa :
ISI SPOILER
Isi dapat berupa teks atau gambar untuk mengisi gambar, tuliskan kode <img src='http://www.situs.com/file-gambar.jpg'/>
Untuk memasang kode ini silahkan copy & paste kode berikut:

<div style="padding: 10px;">
<div style="margin-bottom: 2px;"><b>Judul Spoiler Biasa :</b>
<input value="Buka" style="border:2px inset ;margin:0px; width: 60px;color:#000; font-size: 10px; height:20px;" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"> </div>
<div style="margin: 10px 0 0px 0; padding: 5px; border: 2px inset #fff;">
<div style='display:none'>ISI SPOILER</div>
</div>
</div>

Judul Spoiler Soft:
ISI SPOILER

Isi dapat berupa teks atau gambar untuk mengisi gambar, buat kode <img src='http://www.situs.com/file-gambar.jpg'/>
Untuk memasang kode ini silahkan copy & paste kode berikut:

<div style="padding: 10px; border:1px solid #ccc;background:#e9eef2">
<div style="margin-bottom: 2px;"><b>Judul Spoiler Soft:</b>
<input value="Buka" style="border:0px solid #000;margin:0px; width: 60px;color:#fff; font-size: 10px; height:20px; background:#323c47" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"> </div>
<div style="margin: 10px; padding: 0px; border: 0px inset #fff;">
<div style='display:none'>ISI SPOILER</div>
</div>
</div>

Judul Spoiler Tanpa Background & Border :
ISI SPOILER
Isi dapat berupa teks atau gambar untuk mengisi gambar, buat kode <img src='http://www.situs.com/file-gambar.jpg'/>
Untuk memasang kode ini silahkan copy & paste kode berikut:

<div style="padding: 10px; border:0px solid #ccc;background:#fff">
<div style="margin-bottom: 0px; font-family: arial;font-size:12px;"><b>Judul Spoiler Tanpa Background & Border : </b>
<input value="Buka" style="border:0px solid #000;margin:0px; width: 30;color:#000;font-family: arial; font-size: 12px; height:16; background:#fff; font-weight:bold" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"> </div>
<div style="margin: 10px; padding: 0px; border: 0px inset #fff;">
<div style='display:none'>ISI SPOILER
</div>
</div>
</div>
 

Judul Spoiler Ala Wikipedia: []
ISI SPOILER
Isi dapat berupa teks atau gambar untuk mengisi gambar, buat kode <img src='http://www.situs.com/file-gambar.jpg'/>
Untuk memasang kode ini silahkan copy & paste kode berikut:

<div style="padding: 10px; border:1px solid #ccc;background:#f9f9f9">
<div style="margin-bottom: 0px; font-family: arial;font-size:12px;"><b>Judul Spoiler Ala Wikipedia:</b>
<input value="Buka" style="border:0px solid #000;margin:0px;color:#0000FF;font-family: arial; font-size: 12px; height:16; background:#f9f9f9" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"> </div>
<div style="margin: 0 10px 0px 10px; padding: 0px; border: 0px inset #fff;color:#0000ff">
<div style='display:none'><br/>ISI SPOILER</div>
</div>
</div>



Untuk memasangnya sendiri cukup sederhana. Kalau ingin memasang dalam postingan seperti di atas, cukup copas kode HTML untuk spoiler yg diinginkan ke dalam postingan (Harus dilakukan di tab 'Edit HTML' lho...!!! ^^ ). Kalau ingin memasangnya sebagai widget, bisa di-copas ke dalam widget Kode HTML/Javascript (di tata letak blogger, pilih 'tambah gadget', dan pilih kode HTML/Javascript, dan simpan) silahkan letakkan sesuka hati.. ;)

Isi spoiler bisa kalian tentukan sendiri, entah itu kata-kata, widget (dari kode javascript), dsb.

Unik kan...!! Kalau begitu silahkan langsung mencoba...^^ 










klik yg bawah bos...!!!
Jumlah komentar : (12)

Ayo.....!!!! Pasang Foto-Foto yang Keren dari PicApp ke dalam Posting-an Kamu!!




Pusing mencari gambar untuk mewakilli isi postingan kamu??? Biar ane tebak, biasanya kamu masih pakai Google Image untuk mencari gambar untuk dicantumkan dalam postingan blog?

Kalau seperti itu, tentu saja resikonya gambar yang kamu cantumkan dapat digunakan orang lain, baik itu blog, web, atau poster selebaran di pinggir jalan. Ditambah lagi gambar yang kamu dapat bisa jadi merupakan gambar dari blog lain, bisa-bisa kamu di bilang plagiator gambar tuh...!! ^^

Tapi jangan khawatir karena sekarang kamu bisa mencari gambar unik tersendiri untuk isi blog kamu di situs PicApp, yang berisi puluhan ribu gambar yang berbeda, tidak umum, dan yang paling penting, fotonya diambil oleh para fotografer professional, dijamin keren deh foto-fotonya!!

Gambar-gambar yang ada di situs tersebut bukanlah gambar yang berasal dari blog/situs orang lain, tapi dari data mereka yang legal. Dengan begitu, tidak perlu khawatir bila ingin langsung mengambil gambar-gambar dari data mereka.

Cukup akses situsnya masukkan query value atau nama gambar yang ingin dicari, copy link-nya, langsung deh..! Untuk pengguna Worpress juga mempunyai kemudahan dalam embed picture-nya.


Oh.. ya..!! yang lebih asyik lagi, kalian tidak perlu men-download gambar-gambar tersebut terlebih dahulu, karena situs ini akan memberikan tautan (link) menuju arah gambar-gambar yang ada.

Okeh kan???!! langsung aja, silahkan mencoba...!!! ^^
Klik disini.









klik yg bawah bos...!!!
Jumlah komentar : (0)

Tips Sederhana Mengedit Template Blogger Bagi Pemula


Ingin tampilan blog yang orisinil...? Dengan kata lain tidak dimiliki oleh blog lain dan menjadi sebuah ciri khas sendiri. Tapi kadang template atau tampilan blog yang kita gunakan biasanya bertebaran luas di dunia maya, sehingga terdapat kemungkinan ada dua blog yang memiliki tampilan yang sama.

Jangan khawatir..! hal tersebut dapat diatasi dengan mengedit gambar yang ada pada template blog yang kita gunakan. Bagi yang jago web editing, hal itu pasti tidak menjadi masalah, tapi untuk kalian yang masih pemula pada urusan kode-kode HTML, berikut ada tips sederhana dan patut dicoba.

Perlu diketahui, tampilan blog biasanya diatur oleh kode CSS yang terletak di antara kode <b:skin><![CDATA[ sampai dengan kode ]]></b:skin>. Semua bentuk, ukuran panjang, lebar, pixel, dan gambar pada blog, diatur oleh kode-kode tersebut. Pada tampilan blog ini contohnya, gambar head top, button, dll. merupakan gambar sendiri yang saya upload ke situs hosting gambar seperti Picasa, Flickr, atau Photobucket.

Berikut cara kerjanya. Sobat blogger pasti sudah tahu cara meng-install template pada blogger bukan? Download saja salah satu template blogger yang ada, kemudia upload pada blogger di menu 'Tata Letak' pada tab 'edit html'. Setelah selesai, modifikasi saja template tersebut dengan mengubah gambar, ukuran, dsb. pada kode CSS-nya.

Caranya, di browser sobat (Mozilla, IE, dll.), klik kanan pada salah satu gambar yang ingin diubah, entah itu background tombol, atau header blog, lalu pilih "View Background Image", lalu browser akan berpindah pada alamat gambar yang sobat pilih tersebut, lalu blok address bar atau alamat gambar pada browser kemudian catat atau copy alamat tersebut (Ctrl+C pada keyboard). Pada Internet Explorer, langsung saja pilih Copy Background saat klik kanan.

Masuk pada "Tata Letak" di dasbor Blogger, pilih "Edit HTML", dan centang "Expand Template Widget". Tekan 'Ctrl+F' di keyboard dan pastekan alamat gambar yang sudah dicatat tadi. Sobat blogger akan menemukan alamat tersebut pada salah satu kode CSS yang terdapat pada blog. Yang perlu dilakukan sekarang adalah mengganti alamat tersebut dengan alamat gambar lain, yaitu gambar yang sudah di-upload ke situs Photobucket contohnya.

Kalau sobat blogger tidak ingin pusing, lebih baik gambar baru yang digunakan memiliki resolusi, atau ukuran panjang dan lebar yang sama dengan gambar sebelumnya, tapi kalau ingin ukuran yang berbeda ukurannya,  kalian juga harus ikut mengubah beberapa kode CSS seperti "height:...px;" atau "width:...px;". Sebagai contoh, perhatikan contoh kode CSS sbb:

#top {  height:396px;
            margin:auto;
            background:#f4f4f4 url(http://i919.photobucket.com/albums/ad33/mimuha/top-2.jpg);
            width:1000px    }

Setelah itu pilih "Pratinjau", kalau hasilnya memuaskan, silahkan simpan hasil editan template kalian. Dengan begitu blog sobat akan memiliki gambar-gambar yang unik, berbeda dengan yang lain.

Saran bagi sobat blogger yang masih pemula, kode-kode CSS adalah kunci dari tampilan blog. Jika ingin merombak tampilan sebuah blog, ubah satu per satu variabel atau angka-angka pada kode CSS blog. Lakukan dengan sabar, niscaya kalian akan jago dalam mengedit, bahkan membuat template sendiri, serta jangan lupa untuk selalu "pratinjau" terlebih dulu agar dapat melihat hasilnya sebelum benar-benar di simpan, okeh...!! Selamat mencoba... ^^










klik yg bawah bos...!!!
Jumlah komentar : (4)

Mengalihkan Halaman Blog Blogger (Redirecting Blogger Page)


Beberapa kali pasti sobat blogger pernah mengakses situs yang mengalihkan halaman web-nya. Biasanya akan tertulis pesan seperti "Redirecting you to the site in 15 second". Mengalihkan halaman web mungkin dapat bermanfaat kalau para sobat blogger ingin mengalihkan pengunjung ke situs blog atau domain yang baru. Bahkan kadang, hal tersebut juga dimanfaatkan untuk menyelipkan iklan sebelum masuk ke situs utama.

Untuk membuat halaman web khususnya untuk blogger, kalian dapat dialihkan, kalian bisa menggunakan  kode META agar dapat dialihkan, tapi akibatnya, Page Rank Google pada blog yang lama akan hilang (Hal tersebut karena cara ini banyak dimanfaatkan untuk tindakan SPAM, sayangnya saya belum menemukan cara untuk mengalihkan blog Blogger dengan cara yang berbeda... -_-'. Tapi mungkin kalau kalian mengetahuinya, mungkin bisa berbagi di post ini ^^)

Caranya seperti biasa, masuk pada "Tata Letak" di Dasbor Blogger, dan pilih "Edit HTML", centang "Expand Template Widget". cari kode <head>, setelah itu pastekan kode META berikut tepat di bawahnya.

<meta http-equiv="refresh" content="0;url=http://www.alamat-blog-yang-baru.com">

Ubah URL ke alamat situs blog yang baru. Ubah angka 0 pada 'content', untuk menentukan berapa detik halaman blog akan muncul sebelum dialihkan. Pada halaman blog bisa kalian isikan postingan  atau judul Headline blog berisi kata-kata seperti "Mengalihkan halaman ini ke situs baru. Klik di sini apabila halaman tidak teralihkan", atau kalian bisa juga mengisinya dengan widget iklan.

Mengalihkan halaman blog bisa bermanfaat untuk proses pengalihan pengunjung setia blog yang lama agar dapat mengenal blog yang baru. Sebenarnya blog yang lama dapat dihapus saja, tapi sayang bagi para sobat blogger yang tersesat mencari-cari blog kita, betul tidak...!!! ^^









klik yg bawah bos...!!!
Jumlah komentar : (0)

Tips Modifikasi Link "Posting Lama", "Posting Baru", & "Halaman Utama"


Berikut tips untuk meng-hack tampilan blog Blogger. Yang akan di modifikasi kali ini adalah tautan (link) pada yang biasanya terdapat di bagian bawah postingan kalian. Secara default, link tersebut adalah 'Posting Lama' (Older Pages), 'Posting Baru' (Newer Pages), dan 'Halaman Utama' (Home).

Cara untuk memodifikasinya sendiri cukup sederhana. Masuka pada halaman 'Tata Letak' dari Dasbor Blogger, pilih 'Edit HTML', dan jangan lupa untuk memberi centang pada 'Expand Template Widget'.

Apabila sudah, cari kode-kode berikut (Seperti biasa, gunakan Ctrl+F pada browser untuk mencari kode ^^).
  • <data:newerPageTitle/> = Posting Baru
  • <data:olderPageTitle/> = Posting Lama
  • <data:homeMsg/> (hanya kode yg pertama) = Halaman Utama

Ketiga kode di atas, mewakili masing-masing link tersebut. Untuk memodifikasinya, kalian tinggal ubah saja kode tersebut sesuai keinginan kalian, dapat dilakukan dengan teks, gambar, dll.

Contoh, ganti kode '<data:olderPageTitle/>' dengan teks 'Berita Sebelumnya' (tidak perlu pakai tag '< & />' lagi ^^). Apa bila ingin menambahkan gambar di samping teksnya, tambahkan saja kode 'img' sehingga menjadi <data:olderPageTitle/><img src='http://i42.tinypic.com/34ns01u.png'/>. Atau bisa juga hanya menggunakan gambarnya saja.

Dengan tips ini, blog bisa di ubah menjadi lebih unik, berbeda dengan yang lain.

Keren kan....!! Selamat mencoba... ^^








klik yg bawah bos...!!!
Jumlah komentar : (3)

Mengenai Saya

Foto Saya
Mizan
Mahasiswa rantau yang mendalami kajian Ilmu Jurnalistik, saat ini sedang sibuk dengan kuliah sambil berbagi info di Dumay (Dunia Maya) ^^v. Blog ini beroperasi secara profesional, berisi tentang info2 seputar komputer dan blogging. Semoga blog ini dapat memberi inspirasi dan info tambahan pada pedoman blogging pengunjung semua. ^^ trims..
Lihat profil lengkapku

Pos Terpopuler