Elvindinata Blog

Tampilkan postingan dengan label Blogging. Tampilkan semua postingan

16 Free Useful Web Icons Source, Siap Untuk di Download

di Minggu, Agustus 29, 2010 53

Selamat malam teman-teman semua, semoga masih dalam keadaan sehat semua ya,,amin. Sambil menanti sahur yang tinggal beberapa jam lagi, ane mau sharing dulu ke teman teman semua 16 situs untuk download free icon, bagus dan keren tentunya,..hehe.

Situs penyedia icon adalah merupakan kebutuhan sebuah website/blog untuk membantu dalam memberikan design sebuah blog/website supaya kelihatan lebih baik dan menarik. Mungkin semua orang menyukai situs penyedia icon gratis, tapi menemukan icon blog yang berkualitas dan free tentu agak sulit.

Di bawah ini ane menyajikan daftar situs yang luar biasa yang memberikan icon aplikasi, icon twitter, facebook , icon icon web dan lain-lain untuk desain dan pengembangan web. Gratis !!! .,hehe.

1. graphicriver.net - http://graphicriver.net/free-icons

2. icofree.com - http://icofree.com

3. icons.mysitemyway.com - http://icons.mysitemyway.com

4. icontexto.blogspot.com - http://icontexto.blogspot.com

5. artua.com - http://www.artua.com/freeicons

6. bestfreeicons.com - http://www.bestfreeicons.com

7. bieicons.com - http://www.bieicons.com

8. freeiconsdownload.com - http://www.freeiconsdownload.com

9. freeiconsweb.com - http://www.freeiconsweb.com

10. icojoy.com - http://www.icojoy.com/blogs.3

11. iconbuffet.com - http://www.iconbuffet.com

12. icondrawer.com - http://www.icondrawer.com/free.php

13. iconeden.com - http://www.iconeden.com/icon.category.free

14. iconshock.com - http://www.iconshock.com

15. iconspedia.com - http://www.iconspedia.com

16. vistaicons.com - http://www.vistaicons.com

Yup..selamat berkreasi dengan icon-icon di atas,,hehe. Happy blogging,,^^.
SEkian dari ane ,,semoga bermanfaat,.....

NgeBlog = Pilihan + Kebebasan

di Jumat, Agustus 27, 2010 61

Selamat malam teman-teman, maaf dua hari kagak nongol, hehe.
Selain sibuk dengan persiapan pulang kampung juga banyak maennya,hihihi. Dan juga berhubung blog ane semalem di cek eror ( entah kenapa ane nggak tahu ) halaman postingnya gak muncul,,waduh.. ( komat-kamit) sambil nyari solusi kesana kemari,, berjam-jam,.. padahal banyak teman-teman blog yang datang,,saking pusingnya,,semua itu ane hiraukan,, ( fokus ke blog yang lagi eror) hehe., Maaf yaaaa^^. Jadi dari pada bingung gak karuan,,mau marah lagi puasa,, cara terbaiknya adalah ganti template,,hahahahaha ( ketawanya agak dipaksa..xixixi ) mudah-mudahan teman-teman tidak terganggu dengan keseringan ane dalam berganti penampilan,,,^^.

Baik, itu sekedar intermezo alias basa-basi atau bahasa kerennya salam pembuka..hehe. Kita kembali ke topik pak judul diatas yah ^^... Ngeblog itu adalah sebuah Pilihan dan juga Kebebasan. Mungkin sedikit ketinggian ya judulnya, tapi ya sudahlah bingung mau memberi judul apa hehehe ^^. Beberapa waktu lalu sekedar berblogwalking ria ke beberapa blog teman menemukan beberapa komentar yang sungguh sangat tidak mengenakkan, termasuk di kotak komentar ane tapi ane sih nggak begitu memikirkan yang penting happy dan tujuannya sharing dan berbagi ke teman-teman blog yang baik,:). Kotak komentar yang sesungguhnya berguna untuk memberikan masukan, kritik dan sanggahan atau setidaknya ucapan terima kasih dan pujian berubah menjadi ajang hujatan dan agak menyombongkan diri, karena mungkin dia merasa lebih lama didunia blogger dan paham akan segalanya tentang dunia blog ( preet ). Hargai dan hormati lah.

Kebebasan seorang Blogger untuk menuliskan atau menuangkan ide-idenya tidak bisa dibatasi, selama itu bisa di pertanggung jawabkan. Mengenai pendapat pribadi teman-teman atau setidaknya opini lain yang bertentangan itu semua tetap sah-sah saja dan jangan di jadikan suatu paksaan.

Menurut ane sih blogging adalah aktivitas sharing (berbagi) pengetahuan, berbagi ilmu dan cerita. Ada yang suka ngeblog karena bisa mempunyai teman banyak dan berbagi pengalaman, ada juga yang menggantungkan hidupnya pada blog. Semua itu kembali lagi ke pilihan kemana teman-teman harus memilih sebelum mengawali membuat blog....,betul ??

Jadi mau bagaimanapun bentuknya blog tersebut, tetap hargailah karena yang nulis itu manusia bukan binatang, dan haknya berkarya dengan tambahan sejuta widged dan beribu-ribu script itu lah karya yang ada di masing-masing blogger, sampai dengan saran dan kritik yang membangun hadir di blog tersebut sehingga dapat melakukan perbaikan sedikit demi sedikit.

Sekali lagi Blogging itu Pilihan dan Kebebasan, sehingga apapun artikel yang teman-teman baca jika tidak sesuai dengan opini dan nurani teman-teman ya tinggalkan saja. Tapi bila teman-teman rasa itu salah dan patut untuk diluruskan, silakan anda berkomentar dengan mengajukan saran dan kritik teman-teman yang membangun....

5 Atractive Feedburner Email Subscription Box (Blogger)

di Rabu, Agustus 25, 2010 119

Selamat Sore.. !! ^^. Selamat menikmati aktivitasnya,..hehe.

Sebelum bedug di gebuk,..dan sebelum adzan berkumandang, dari pada mendekam dikamar,, ngabuburit di depan monitor memang lebih asyik, hehe. Postingan kali ini berhubungan dengan widged blogger. Widged kotak berlangganan yang mungkin setiap blog ada. Kotak berlanganan menurut versi Elvindinata Blog-->> Adalah kotak dimana para pengunjung bisa berlangganan artikel kita dengan mudah,, betuL ???...hehe.

Kali ini ane ingin membagikan kepada teman-teman widgednya, lebih menarik dan atraktif.. masuk semua dalam satu kotak,.. ada Subscribe RSS, Subscribe Email , Facebook, Twitter serta Sharepack.

Berikut widged-widgednya :

1. Stay Connected

Kode :

<a href='http://twitter.com/iblogerz' style='float: left; margin-right: 10px;' title='Follow us on Twitter'><img alt='Follow on Twitter' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMV1FhdwjpqP7INiUrUWjrUgEQi4e4dg92wO8U1xQ0pDo_D1X6h_89MpyZyIBHT1-p1qqdF2bvdfhfc6I4bj9rTSIbzq-IFhKfB8SEO9hkXmWq9_eF4P0_t2zL2kY2_KpxDZ9EFauqRGR0/s800/break_the_egg_128px.png'/></a><div style='margin: 20px 0pt 0px 138px; overflow: hidden;'><a href='http://friendfeed.com/nirav07' title='Get connected over FriendFeed'><img alt='FF' src='http://i27.tinypic.com/144ar5.jpg'/></a><a class='linkopacity vtip' href='http://www.facebook.com/uscrap.co.cc' title='Lets be friends on facebook'><img alt='Facebook' src='http://i42.tinypic.com/20h21si.jpg'/></a><a class='linkopacity vtip' href='http://picasaweb.google.com/niravjain007/' title='Visit our Picasa Album'><img alt='Picasa' src='http://i40.tinypic.com/zv9zch.jpg'/></a><a class='vtip linkopacity' href='http://technorati.com/people/technorati/nirav07' title='Visit us at technorati'><img alt='Technorati' src='http://i41.tinypic.com/15i273q.jpg'/></a><a class='linkopacity vtip' href='http://digg.com/users/nirav07' title='Become friends on Digg'><img alt='Digg' src='http://i43.tinypic.com/2rr2zpy.jpg'/></a><a class='linkopacity vtip' href='http://nirav07.stumbleupon.com/' title='See what we have Stumbled upon!'><img alt='SU' src='http://i25.tinypic.com/2mzxqnt.jpg'/></a><a class='linkopacity vtip' href='http://www.youtube.com/user/niravjain007' title='See our YouTube Video Gallery'><img alt='UT' src='http://i29.tinypic.com/30wp4s3.jpg'/></a><a class='linkopacity vtip' href='http://www.orkut.co.in/Main#Profile.aspx?uid=15548331932883821176' title='Scrap us on Orkut'><img alt='Orkut' src='http://i26.tinypic.com/24y03o9.png'/></a><a href='http://technorati.com/faves?sub=addfavbtn&add=http://www.templates-widgets.com' style='margin: 5px 0pt 0pt 30px; display: block;'><img alt='Add to Technorati Favorites' src='http://static.technorati.com/pix/fave/tech-fav-1.png'/></a> <div style='margin: 10px 0pt 0pt; overflow: hidden; width: 200px;'> <div style='float: left;'><script language='javascript' src='http://twittercounter.com/embed/?username=iblogerz&style=black' type='text/javascript'/></div> <div style='float: right;'><a href='http://feeds.feedburner.com/bestwidgets'><img alt='' height='26' src='http://feeds.feedburner.com/%7Efc/bestwidgets?bg=87a0b0&fg=000000&anim=1' style='border: 0pt none ;' width='88'/></a></div> </div></div><br/> <div style='margin: 0px auto; padding: 0pt 0pt 0pt 40px; background: transparent url(http://i44.tinypic.com/23syr83.jpg) no-repeat scroll left -8px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 240px; text-align: left;'> <form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=bestwidgets&apos;, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'> <p><input name='email' onblur='if(this.value=='')this.value='Email address to subscribe'' onfocus='if(this.value=='Email address to subscribe')this.value=''' style='width: 180px;' type='text' value='Email address to subscribe'/><input name='uri' type='hidden' value='bestwidgets'/><input name='loc' type='hidden' value='en_US'/><input type='submit' value='Go'/> </p></form></div><div style='margin: 0px auto; padding: 0pt 0pt 0pt 50px; background: transparent url(http://i40.tinypic.com/2ewo0zk.jpg) no-repeat scroll -5px center; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; width: 305px; min-height: 50px; line-height: 4em;'> <a class='vtip' href='http://feeds2.feedburner.com/bestwidgets' title='Subscribe to our feeds to any reader to get regular updates for Free!'>Full RSS Subscription</a><a class='vtip' href='http://feeds2.feedburner.com/bestwidgets' title='Dont miss a single Featured post! Subscribe now'>Featured Posts</a><img src='http://i44.tinypic.com/2a8jc0g.jpg' style='border: medium none ; margin-bottom: -12px; margin-left: 2px;'/> </div>

2. Subscribe uS

Kode :

<img alt='RSS' border='0' height='30' src='http://img708.imageshack.us/img708/3483/mailo.jpg' style='float: left; margin-right: 10px; margin-top: 10px;' width='30'/> <form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=bestwidgets&apos;, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'> <p><input maxlength='100' name='email' onfocus='this.value = '';' size='25' style='background-color: rgb(255, 255, 160); margin-bottom: 2px; padding-left: 5px; width: 150px; padding-top: 2px; height: 16px;' type='text' valign='middle' value='Enter your email address'/> <input name='uri' type='hidden' value='bestwidgets'/> <input name='loc' type='hidden' value='en_US'/> <input type='submit' value='Subscribe'/></p> </form> <a href='http://feeds.feedburner.com/bestwidgets' title='Subscribe in a Feed Reader'> <img alt='RSS' border='0' height='24' src='http://img138.imageshack.us/img138/4618/feedicon24x24.png' style='padding: 4px 10px 0pt 5px; float: left;' width='24'/> </a> <a href='http://feeds.feedburner.com/bestwidgets'><b>Subscribe to RSS Feed</b></a> | <a href='http://www.facebook.com/uscrap.co.cc' title='Add me as a Friend on Facebook'> <img alt='Facebook' border='0' height='12' ilo-full-src='http://img138.imageshack.us/img138/5325/facebookru.png' src='http://img138.imageshack.us/img138/5325/facebookru.png' width='12'/> </a> <a href='http://technorati.com/faves?add=http://www.templates-widgets.com/' title='Add us to Technorati Favorite'> <img alt='Technorati' border='0' height='12' ilo-full-src='http://img41.imageshack.us/img41/1631/technoratiq.png' src='http://img41.imageshack.us/img41/1631/technoratiq.png' width='12'/> <br/> </a><a href='http://twitter.com/iblogerz' title='Follow on Twitter'> <img alt='Twitter' border='0' height='12' ilo-full-src='http://img41.imageshack.us/img41/1701/twitteruef.png' src='http://img41.imageshack.us/img41/1701/twitteruef.png' width='12'/> </a> <a href='http://twitter.com/iblogerz' title='Follow on Twitter'>Follow us on Twittter</a> <p style='margin-top: 10px;'> <a href='http://feeds2.feedburner.com/bestwidgets'><img alt='' height='26' src='http://feeds2.feedburner.com/%7Efc/bestwidgets?bg=3333&fg=FFFFFF&anim=1' style='border: 0pt none ;' width='88'/></a> <script type='text/javascript'> tweetmeme_screen_name = 'iblogerz'; </script> <script src='http://tweetmeme.com/i/scripts/follow.js' type='text/javascript'/> <iframe allowtransparency='true' frameborder='0' scrolling='no' src='http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.bloggwewidgets.cz.cc&layout=button_count&show_faces=false&width=100&action=like&font=verdana&colorscheme=light' style='border: medium none ; overflow: hidden; width: 100px; height: 20px; padding-top: 10px; padding-left: 5px;'/> </p><form action='http://www.facebook.com/addfriend.php' target='_blank'><input name='id' type='hidden' value='1737131433'/><img src='http://i45.tinypic.com/hvs3ft.jpg' style='margin: 0px; padding: 0px; width: 111px; height: 22px;'/></form>

3. Thrilling Subscribe

Kode :

<a href="http://feeds2.feedburner.com/bestwidgets" title="Subscribe to the RSS feed"><img alt="RSS" src="http://i50.tinypic.com/esnlvc.jpg" style="float: left; vertical-align: middle; padding-right: 10px;" border="0" /></a> <p style="padding: 5px 0pt;"><a href="http://feeds2.feedburner.com/bestwidgets" title="Subscribe to updates via RSS">Grab the RSS feed for Free Updates!</a><br />(What's this? â�� <a href="http://www.youtube.com/watch?v=0klgLsSxGsU" target="_blank" title="RSS in Plain English">Learn more about RSS</a>)</p> <br /> <a href="http://feedburner.google.com/fb/a/mailverify?uri=bestwidgets" title="Get email updates delivered to your email inbox!"><img alt="subscribe" src="http://i45.tinypic.com/xmk8w6.jpg" style="float: left; vertical-align: middle; padding-right: 10px;" border="0" /></a> <p style="padding: 5px 0pt;">OR Get blog updates sent directly to your inbox by entering your email address below:</p> <form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open(\" http:="" feedburner.google.com="" fb="" a="" mailverify?uri="bestwidgets\'," popupwindow\="" ,="" \="" scrollbars="yes,width=550,height=520\');return" true="" style="text-align: center;" target="popupwindow"> <input name="email" style="width: 140px;" type="text" /> <input name="uri" value="bestwidgets" type="hidden" /> <input name="loc" value="en_US" type="hidden" /> <input onmouseover="style.cursor=\" pointer\="" style="margin: 5px; cursor: pointer;" value="Subscribe" type="submit" /> </form>

4. Email Subsciption Box

Kode :

<form id="subscribe" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Your-FeedBurner-Feed ', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><b>Like This Blog's Posts?</b> Get the Latest of It Directly from your Inbox for Free - Enjoy your Day!<br />
<div style="text-align:center">
<input type="text" value="Enter your email address..." id="subbox" onfocus="if (this.value == 'Enter your email address...') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Enter your email address...';}" name="email" style="width:250px;" />
<input type="hidden" value="Your-FeedBurner-Feed " name="uri" />
<input type="hidden" name="loc" value="en_US" />
<input type="submit" value="OK" id="subbutton" />
</div></form>

<div>
<center>
<table>
<tr> <td>
<a href="http://feeds.feedburner.com/Your-FeedBurner-Feed "><img src="http://feeds.feedburner.com/~fc/Your-FeedBurner-Feed ?bg=99CCFF&fg=111111&anim=1" height="26" width="88" style="border:0" alt="" /></a>
</td><td>
<script type="text/javascript" language="JavaScript" src="http://twittercounter.com/embed/Your-Twitter-User-Name/111111/99CCFF"></script>
</td></tr>
</table></center>
</div>

<div style="padding-left:10px;">
<table>
<tr><td><a href="http://feeds.feedburner.com/Your-FeedBurner-Feed " target="_blank" title="Subscribe To The Latest Posts"><img style="float:left; margin-right:5px; width:20px; height:20px;" src="http://img243.imageshack.us/img243/2619/10rssicon.png" /></a><a href="http://feeds.feedburner.com/Your-FeedBurner-Feed " target="_blank" title="Subscribe To The Latest Posts">Subscribe to The RSS Feed</a>
</td></tr>
<tr><td>
<a href="Your-Facebook-Page-Url" target="_blank" title="Facebook time"><img style="float:left; margin-right:5px; width:20px; height:20px;" src="http://img163.imageshack.us/img163/8637/10facebookicon.png" /></a>
<a href="Your-Facebook-Page-Url" target="_blank" title="Facebook time">Connect via Facebook</a>
</td></tr>
<tr><td>
<a href="http://twitter.com/Your-Twitter-User-Name" target="_blank" title="Twitter time"><img style="float:left; margin-right:5px; width:20px; height:20px;" src="http://img189.imageshack.us/img189/6853/10twittericon.png" /></a><a href="http://twitter.com/Your-Twitter-User-Name" target="_blank" title="Twitter time">Follow Us on Twitter</a>
</td></tr>
</table></div>

5. Awesome Subscribe

Langkah 1 :

Log In ke Blogger teman-teman.
Design-->> Edit HTML
Cari kode </head>
Kemudian letakkan kode di bawah ini di atas kode </head>

Kode :

Silahkan ganti URL yg berwarna untuk mengganti gambar.

Save Template.

Langkah 2 :

Masuk ke Layout-->> Page Element-->> Add Gadged-->> HTML/Javascript
Masukkan semua kode dibawah ini kedalam gadged teman-teman, dan Save.

Kode :

<div id="hsection">
<div id="sectionmy">
<div class="sectionmy2">

<h2 class="subscription rss"><a href="YOUR-RSS-FEED-URL">SUBSCRIBE VIA RSS</a></h2>

<h2 class="subscription email"><a href="YOUR-FEEDBURNER-EMAIL-SUBSCRIPTION-URL">SUBSCRIBE VIA EMAIL</a></h2>

<h2 class="subscription twitter"><a href="YOUR-TWITTER-URL">FOLLOW ON TWITTER</a></h2>

</div></div>
</div>

Catatan : Ganti Kode Warna Merah dengan URL , Page Facebook, URL feedburner, Twitter, Facebook dll, dengan URL teman-teman.

Dan warna ungu untuk merubah tulisan.

NB : Mohon maaf apabila ada kesalahan dalam pemberian warna di kode tersebut. Silahkan kontak ane apabila teman-teman bingung dlam mengaplikasikannya. Terima kasih.

Sekian dari ane. Semoga bermanfaat. Mau buka. hihihi .:)

jPost | Template Baru Untuk Blogger

di Selasa, Agustus 24, 2010 67

Selamat malam teman-teman. Semoga dalam keadaan sehat semua. Amin. Selamat beraktifitas semua ya,. ^^.

Malam ini ane tidak membahas tutorial, tips trik atau widged. Hal yang berat-berat kita tinggalkan sejenak ya teman-teman. Berhubung otak masih buntu buat kesana-kemari nyari bahan, mending kita enjoy dulu dengan membahas sebuah template baru. Hehe.

Template ini buah karya nya Kang Anshul Dudeja, baca namanya pasti teman-teman sudah tahu. Sangat tidak asing dalam perancangan sebuah template blog. Hari ini Kang Anshul menerbitkan template versi barunya, diberi nama jPost.

Berikut Karakteristik template ini :

jPost adalah template tiga kolom dan baru pertama jenis ini (tanpa sidebar) pada tema blogger. Template ini juga tersedia di wordpress dan dirancang oleh topwpthemes. Yang menarik dari template ini adalah navigasi sidebar yang tetap di kanan atas template dan dapat ditunjukkan hanya pada saat kita mengklik button. Navigasi template logo juga sangat indah dengan read more hack installed. Fitur lainnya yang bagus adalah bagian komentar di template yaitu berada di kanan postingan yang juga membuatnya terlihat begitu fresh. Semua fitur lain yang dibuat tersedia sebagai seperti blogger dan semua templates. Seo friendly pada template ini juga telah disertakan dan semua halaman bekerja dengan baik.

Berminat ???,..., ane aja hampir jatuh cinta,,hehe. Tapi masih setia dengan yang ini,..^^.

Template jPost

Sekian dari ane . Semoga Bermanfaat. ^^.

Daftar Isi Jquery Accordion

di Senin, Agustus 23, 2010 62

Selamat malam teman-teman,^^. Sehat selalu untuk kita semua ,,amin.

Sekian lama mutar otak untuk bahan postingan kali ini,akhirnya dapat juga, hehe. Browsing kesana-kemari demi mendapatkan sebuah titik terang postingan, hmmm. Kali ini bahas daftar isi aja deh, walaupun kedengarannya sudah basi, tapi nggak apa-apa , tujuannya untuk sharing aja, Just sharing ,,oke ^^. Daftar Isi ini berbeda dengan postingan ane kemarin yang di requeskan oleh salah satu teman bloger, teman teman bisa membaca Cara Membuat Daftar Isi. Nah, kalau bicara soal daftar isi, pasti teman-teman sudah pada tahu fungsinya,??..yup..^^. Daftar isi menurut definisi ane -->> berfungsi untuk menampilkan link-link postingan berdasarkan waktu atau kategori ,, hehe,,betul ??.
Nah, halaman daftar isi ini sangat bermanfaat bagi pengunjung yang ingin menjelajahi lebih jauh isi dari sebuah situs/blog.

Ok, daftar isi yang ingin ane bahas kali ini adalah daftar isi dengan Jquery Accordion., daftar isi yang yang menurut ane ajib,,he. Banyak sih, daftar isi accordion yang lain, tapi ane bahas yang satu ini saja ya ,^^.
Daftar Isinya seperti ini teman-teman :

Oke, bagi teman-teman yang berminat, silahkan ikuti langkah-langkah berikut :

Biasa,.. Log In ke Blogger
Design-->>Edit HTML
Cari kode ]></b:skin> , dan letakkan kode dibawah ini di atas kode ]></b:skin>
#dafis-acc{
font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#333;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8NGpNxie0fcaehpFkye9_yKWI_M6rkwna3Vig0zUmRuhZmqkiI6CWkyZndXHGGYqtX85nFsO6nZjw98cGUTOeE_ulcsl8a2BdYVInN7EyUcumkLVGeYLEM7LND5BLyuss69k03zKbbQs/d/bg5.gif) repeat-y scroll left center #E7F7FB;
padding:2px 0;
border:1px solid #339DC6;
}
.dafis-label{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikIFaF_IexzhKKlL5pRWXJEq78ZOkwIv2PMm-OfE8wIY26dC94uqs3ZK4HTSC4v0mAGeXmsrFmBRww941zcnZkSlQi_OZT-TC6RTP1ajWKIKz0khKlOYsrwMc1-4RiIXBJaiAEapE4lTs/d/bg4.gif) repeat-x scroll 0 0 #E1F4FB;
font-weight:bold;
line-height:1.4em;
overflow:hidden;
white-space:nowrap;
vertical-align: baseline;
margin: 1px 3px;
outline: none;
cursor: pointer;
text-decoration: none;
padding: 2px 10px;
color: #fff;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
border:1px solid #2F94BA;
}
.dafis-label:hover{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMbsf6mRicx65euy5dXseAiwKlG_M2t9rA8D_vBN532DnhAarkH07j2nOq6_3R8kB-i_2O8mQDIfOch5hMVkbOUlx113TR4p-oSfZG8mawBoEAaGiOpIfbx9Cq-5MZVjKE1iJ7ZPzSPEs/d/bg2.gif) repeat-x scroll 0 0 #E1F4FB;
color:#003366;
}
.dafis-daf ol{
margin:0 0 0 30px !important;
padding:0 !important;
}
.dafis-daf ol li{
background-color:#C9E9F4;
line-height:1.5em;
margin:1px 3px !important;
white-space:nowrap;
text-align:left;
border:1px solid #339DC6;
}
.dafis-daf ol li a{
text-decoration: none !important;
color:#333 !important;
display:block;
padding-left:10px;
}
.dafis-daf ol li a:hover{
background: #7BC4DF;
border-left: 5px #333 solid;
padding-left: 5px;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
}
Kemudian cari kode </head> , dan letakkan kode di bawah ini di atas kode </head>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'/>

Simpan Template

Sesudah di save, masuk ke Edit Entry-->> buat postingan baru., dan masukkan kode di bawah ini ke dalam postingan teman-teman.

Ubah URL dengan URL blog teman-teman.Publish/terbitkan. Selesai,^^.

Untuk merubah warna silahkan lihat pada kode warna coklat, dan ganti dengan kode warna yang teman-teman sukai. Kode warna silahkan lihat disini.

Sekian dari ane , semoga bermanfaat^^.

Membuat Blangko Kontak [ Contact Form ] dengan Google Docs

di Sabtu, Agustus 21, 2010 49

Selamat malam teman-teman. Selamat weekend ya,..dan selamat bermalam minggu. Hehehe.

Sesuai dengan om judul diatas ane ingin mensharingkan kepada teman-teman cara membuat Contact Form , biasa disebut Kontak Saya / Contact Us. Contact Form, mungkin adalah salah satu widget wajib yang harus dimiliki setiap blogger. Karena dengan memanfaatkan contact form para pembaca blog kita bisa mengirimkan sekedar kritik saran kepada pemilik blog, ataupun ingin mempertanyakan sesuatu hal. Dan dengan memanfaatkan sebuah contact form kita mendapatkan hubungan timbal balik antara admin (dalam hal ini pemilik blog atau website) dengan pengunjung blog/website tersebut, yang dapat menghindari komunikasi satu arah.

Dan telah kita ketahui semua saat ini telah banyak sekali penyedia jasa Contact Form, salah satunya yaitu [ Email Me Form ] , yang ingin membuat kontak dengan [ Email Me Form ] silahkan kunjungi situs tersebut dan ikuti langkah-langkahnya. Atau entry di Mbah Google dengan mengetikkan cara membuat Contact Form dengan Email Me Form dan anda akan melihat banyak sekali result yang akan membahas nya. Tapi kali ini ane tidak membahas tentang Emailmeform, melainkan salah satu contact form sejenisnya yaitu [Google Docs]. Google Docs ini memiliki kesan yang berbeda dibandingkan dengan contact-contact lainnya.

Silahkan lihat disini [ Kontak saya ] untuk melihat hasil dari Google Docs. Bentuknya sangat-sangat simple dibandingkan dengan Form yang lain.

Baik, bagi teman-teman yang berminat silahkan ikuti langkah-langkah berikut :

Login di Google Docs dengan menggunakan Google ID teman-teman.
Klik di [ Create New ] kemudian drop ke bawah dan pilih [ Form ].
Kemudian Klik [Theme : plain] untuk merubah theme/tema kontak yang ingin teman-teman buat, tetap pada Plain untuk kontak tanpa tema/putih.
Berikut contoh tema kontak dari google docs.
Kembali ke Edit untuk mengisi . Ganti Untitled Form dengan kata yang teman-teman sukai, misal : Contact Us/ Kontak Saya. Kemudian isi dibawahnya dengan kata-kata yang ingin teman-teman sampaikan untuk pengunjung. Misal : Silahkan Isi Form ini untuk memberikan saran dan kritik anda.
Lalu pikirkan elemen apa yang ingin teman-teman masukkan kedalam Form di Sample Question 1. Untuk contoh simpel biasanya diisi dengan Name/Nama, Email, Subject dan Message/Pesan. Check List/Conteng Make this a required question untuk membuat supaya wajib diisi. Contoh :
Untuk membuat elemen, klik di Add Item di pojok kiri atas , dan pilih Text. Dan masukkan lagi dengan kata-kata yang ingin teman-teman tulis. Misal email , pesan atau lainnya.
Setelah selesai membuat form teman-teman dianjurkan untuk mengklik More Option kemudian Edit Information. Isi form tersebut, supaya ada pesan untuk pengunjung yang telah mengirimkan pesan ke kontak anda, klik save apabila sudah diisi. Contoh :
Kembali ke More Option dan pilih Embed. Copy kode tersebut ke dalam notepad teman-teman.
Selesai.

Bagaimana memasukkannya ke dalam Blog ??.

Log In ke Blogger teman-teman.
Klik Posting -->> New Entry .
Isi Judul Posting teman-teman. Misal : Contac Us / Kontak Saya.
Edit HTML dan copas semua kode yang anda simpan di notepad tadi ke dalam postingan teman-teman.
Publish Post. Selesai .

Sekian dari ane. Semoga bermanfaat. ^^.

Silahkan Isi Form ini untuk memberikan kritik dan saran teman-teman :

Cara Membuat Kotak Komentar Facebook [UPDATED]

di Selasa, Agustus 17, 2010 31

Selamat Pagi,.!! Merdeka...!!! Hidup Indonesia Raya..!!

Facebook adalah sebuah social network yang luar biasa digemari oleh dunia. Jaringan sosial yang mampu membuat kita berinteraksi di dunia maya dengan teman lama atau baru kita. Semakin hari Facebook mengoptimalisasikan websitenya supaya tetap berada paling depan diantara situs lainnya. Dengan aplikasi-aplikasi yang di buat Facebook kita bisa terhubung dimana saja dan kapan saja, tidak lain halnya dengan blog. Facebook bisa ke blog.

Contoh saja ane ,,mau sharing ke teman-teman semua untuk cara pemasangan kotak komentar facebook di blog, ini di untukkan kepada teman-teman yang membuka dari facebook namun tidak mempunyai blog, mereka bisa ikut berkomentar dengan akun facebook mereka. Sangat Menarik,..^^.

Yang tertarik silahkan ikuti langkah berikut :

Langkah 1.

Pertama login ke akun blogger anda.
Kemudian buka facebook anda, login terlebih dahulu, lalu masuk ke aplikasi facebook developers .
Kemudian buat nama aplikasi terlebih dahulu , klik tombol " Buat Aplikasi baru (create new aplication)"
Contoh :
Setelah itu teman-teman akan masuk kedalam menu pengaturan aplikasi , masuk ke menu terhubung (connect) ,lalu masukkan url blog anda semisal blog ane adalah http://www.elvindinatablog.co.cc/,masukkan pada akhiran blog dengan tanda / jadi nantinya adalah http://www.elvindinatablog.co.cc/ ,lihat gambar :
Setelah itu kembali ke menu dasar (Basic) untuk melihat ID Aplikasi (ID Aplication). Simpan dahulu ID Aplikasi anda.
Simpan/Save.

Langkah 2.

Masuk blog anda. Design. Edit HTML. Expand Template Widged
cari kode <body> Setelah ketemu tambahkan kode ini dibawahnya :
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : ' APP-ID teman-teman ',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};

(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
Kemudian cari kode <b:skin><![CDATA[/* dan kopy kode dibawah, berada diatasnya.
<b:if cond='data:blog.pageType == "item"'>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/>
</b:if>
<meta content='URL blog teman-teman' property='og:site_name'/>
<meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='APP-ID teman-teman' property='fb:app_id'/>
<meta content='Profile-ID-Facebook teman-teman' property='fb:admins'/>
<meta content='article' property='og:type'/>
Cari lagi ( control F ) <data:post.body/> jika yang ditemukan ada dua silahkan masukkan dibawah kode yang kedua. Kopy kode dibawah ini tepat dibawahnya.
<b:if cond='data:blog.pageType == "item"'><br/> <p align='left'><a href='http://www.elvindinatablog.co.cc/2010/08/cara-membuat-kotak-komentar-facebook.html' target='new'><img border='0'/></a></p><div><fb:comments expr:title='data:post.title' expr:url='data:post.url' expr:xid='data:post.id' width='450'/></div><div style='background-color: #f2f2f2;border: solid 1px #cccccc; font-size:10px; padding:3px;width:100%;'><b> by <a href='http://www.elvindinatablog.co.cc/2010/08/cara-membuat-kotak-komentar-facebook.html' target='_blank' title='Facebook Comment'>Mau Pasang Kotak Komentar kayak Gini? Klik Disini</a></b></div></b:if><br/>
Save Template. Dan Selesai. Mungkin butuh waktu untuk koneksi facebooknya,,jadi harap bersabar.
NB : Untuk kata yang berwarna HIJAU silahkan ganti dengan URL Blog, APP ID dan Profil ID Facebook anda.

Sekian dari ane. Semoga bermanfaat ^^.

Cara Memasang Menu Horizontal

di Senin, Agustus 16, 2010 4

Apa kabar teman-teman. Selamat menunaikan ibadah pusa bagi yang menjalankannya. Hmm,, kali ini ane ingin posting tentang Menu Horizontal. Artikel ini di tulis berdasarkan salah satu request sobat blog ane yang ingin membuat menu horizontal, sebagai sobat yang baik,,hehe,, apa lagi di bulan ramadhan ini, alangkah baik nya jika ane membantu,,hihi.

Tutorial ini ane dapatkan dari blog sejuta umat o-om.com , he. Soalnya ane pun masang menunya dari tutorial beliau. Baik, mari langsung ke TKP..^^.

Menu horizontal merupakan kumpulan beberapa link yang diletakkan secara horizontal dan biasanya ditempatkan di bawah header. Fungsi dari trik blogger ini adalah sebagai salah satu navigasi dalam blog agar memberikan layanan kemudahan shortcut link bagi pengunjung blog teman-teman.

Caranya :

Pertama masuk halaman Edit HTML
Kopi-paste semua kode CSS dibawah ini lalu letakan diatas kode ]]></b:skin>
/*-- (Menu/Nav) --*/
#nav{background:#222; height:32px; padding:4px 0 0; margin-bottom:0px}
#nav-left{float:left; display:inline; width:600px}
#nav-right{float:right; display:inline; width:100px}
#nav ul{position:relative; overflow:hidden; padding-left:0px; margin:0; font:1.0em Arial,Helvetica,sans-serif}
#nav ul li{float:left; list-style:none}
#nav ul li a, #nav ul li a:visited{display:block; color:#fff; margin:0 5px; padding:5px 4px; text-decoration:none}
#nav ul li a:hover{color:#800000; background-color:#fff; margin:0 5px; padding:5px 4px}
#nav ul li a.current, #nav ul li a.current:visited, #nav ul li a.current:hover{margin:0 8px; background-color:#fff; color:#fff; padding:5px 7px}

/*-- (Search) --*/
#search{background:#f9f9f9 url(http://oom.blog.googlepages.com/search.gif) 6px 2px no-repeat; -moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px; border:1px solid #b3b3b3; float:right; height:25px; margin:0 0px 0 0; width:180px}
* html #search{margin-right:8px}
#search input{font-family:Verdana,Arial,Helvetica,sans-serif; background:transparent; border:0; color:#555; float:left; font-size:12px; margin:5px 0 0; padding:0px 2px 2px 27px; width:140px}

Kemudian cari kode <div id='outer-wrapper'><div id='wrap2'> kemudian copi-paste semua kode dibawah ini, dan letakan kodenya dibawah kode warna hijau diatas.

<div id='nav'>
<b:section class='header-tabs' id='header-tabs' preferred='yes' showaddelement='no'>
<b:widget id='LinkList1' locked='true' title='Top Tabs' type='LinkList'>
<b:includable id='main'>
<div class='widget-content'>
<b:if cond='data:title'/>
<div id='nav-left'>
<ul>
<li><a href='/'>Home</a></li>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</div>
</b:includable>
</b:widget>
<b:widget id='HTML3' locked='true' title='Search' type='HTML'>
<b:includable id='main'>
<div id='nav-right'>
<form expr:action='data:blog.homepageUrl + "search"' id='searchform' method='get' name='searchform'>
<b:if cond='data:title'/>
<div id='search'>
<input class='s' id='s' name='q' onblur='if (this.value == '') {this.value = 'Cari artikel disini';}' onfocus='if (this.value == 'Cari artikel disini') {this.value = '';}' type='text' value='Cari artikel disini'/>
<input id='searchsubmit' type='hidden' value='Search'/>
<data:content/>
</div>
</form>
</div>
</b:includable>
</b:widget>
</b:section>
</div>

Simpan Template teman-teman. Dan Lihat hasilnya.

Catatan : Untuk menambah menu, silahkan buka kembali "Elemen Halaman" kemudian perhatikan widget paling atas, disitu sudah terlihat witget baru dengan title "Top Tabs" silahkan klik edit dan tambahkan menu yang ingin ditampilkan. Semoga BErhasil,..!!!

Sekian dari ane. Semoga bermanfaat. :) .

Sumber o-om.com

Elvindinata Blog

16 Free Useful Web Icons Source, Siap Untuk di Download

NgeBlog = Pilihan + Kebebasan

5 Atractive Feedburner Email Subscription Box (Blogger)

jPost | Template Baru Untuk Blogger

Daftar Isi Jquery Accordion

Membuat Blangko Kontak [ Contact Form ] dengan Google Docs

Recent Post dengan Tambahan Thumbnails dan Simple Spy

Recent Post dengan Thumbnail

Cara Membuat Kotak Komentar Facebook [UPDATED]

Cara Memasang Menu Horizontal

Sahabat Ane Nih

Artikel Populer

Subscribe

CBOX

Statistik

BlogRoll