Showing posts with label Tips Trick Blogger. Show all posts

Tuesday, April 30, 2013

Cara Membuat Label Berputar-putar Di Blog

Salam blogging sobat-sobat ku semua, kali ini saya sedikit share tentang cara membuat label berputar-putar di blog, cara ini sudah banyak di bahas oleh master-master blog terdahulu.

Disini saya hanya mengulas ulang, siapa tahu ada sobat blogger yang belum mengerti, ataupun sudah pernah melihat dan ingin mempraktikkan di blog sobat. Dengan menggunakan cara ini tampilan widget label akan lebih ringkas, dan tidak terlihat terlalu panjang ataupun terlalu lebar, karena lebar dan panjangnya bisa sobat sesuaikan sendiri.

Saya kira cukup sekian saja penjelasan saya, mari kita menuju ke pokok pembahasan yaitu cara membuat label berputar-putar di blog.

Berikut ini langkah-langkah cara membuat label berputar-putar di blog:

1. Seperti biasa sobat harus login dulu di akun blog sobat

2. Pilih rancangan / desing dan klik edit HTML dan lanjutkan

3. Centang "Expand Template Widget" untuk menghindari apabila terjadi kesalahan

4. Sobat cari kode berikut:

Untuk template lama cari kode ini: <b:section class='sidebar' id='sidebar' preferred='yes'>

Untuk template baru cari kode ini: <b:section-contents id='sidebar-right-1'>

5. Setelah ketemu sobat copy paste code berikut ini tepat di bawah kode yang sobat cari tadi

Klik show untuk melihat

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "300", "200", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

Keterangan:

Kode berwarna kuning adalah lebar widget, bisa sobat sesuaikan sediri.
Kode berwarna hijau adalah tinggi widget, bisa sobat sesuaikan sendiri.

6. Klik save / simpan template

Catatan:

Apabila label belum muncul sobat setting secara manual dahulu seperti gambar di bawah ini.

Demikianlah Cara Membuat Label Berputar-putar Di Blog. Silakan mencoba dan semoga bermanfaat sobat..

Cara Memasang Buku Tamu / CBOX Di Blog Muncul Dari Berbagai Arah

2:09 AM Tips Trick Blogger No comments

Cbox atau lebih dikenal sebagai buku tamu merupakan hal yang tidak asing lagi di dunia blogger, sudah banyak tutorial-tutorial yang membahas tentang cara pemasangan Cbox, baik dengan cara standar maupun dengan cara pengubahan kode CSS.

Kali ini saya akan memposting cara memasang Cbox auto hiden dari segala arah, segala arah maksudnya yaitu Cbox dapat ditempatkan atau muncul dari bagian sebelah kiri blog, kanan blog, bawah blog, dan atas blog, dan disertakan juga animasi gambar gif sebagai background.

Saya kira cukup sekian bla bla bla penerangan saya, dan mari kita menuju kepokok pembahasan.

Berikut ini adalah Cara Memasang Buku Tamu / CBOX Di Blog Muncul Dari Berbagai Arah:

Seperti biasa sobat harus Login dulu di akun blog sobat
Pilih Tata Letak
Tambah Gadget HTML/Java Script
Selanjutnya copy paste kode script di bawah ini dan masukan ke dalam Gadget HTML/Java Script.

Klik show untuk melihat

Klik save / simpan.

Keterangan:

Kode warna merah adalah warna gambar, silakan sobat sesuaikan sendiri sesuai selera bila ingin mengganti gambarnya
Kode warna kuning adalah penepatan dimana cbox akan muncul, bila sobat ingin cbox muncul dari atas ganti kode tersebut menjadi TOP, dari sebelah kiri LEFT, dari sebelah kanan RIGHT .
Kode warna putih adalah jarak cbox dari sebelah kanan. Silakan sobat sesuaikan sendiri.
Texts berwarna hijau adala tempat untuk menaruh strip kode cbox sobat (atur cbox sobat agar backgroudnya transparant untuk hasil yang lebih sempurna).

Selanjutnya adalah cara membuat tombol cbox (tombol untuk menampilkan cbox)

Tetap login di akun blog sobat
Masukan script berikut bersamaan dengan script di atas dalam gadget HTML / Java Script

Keterangan:

Kode berwarna merah adalah gambar tombol, bisa sobat ubah sesuai selera.
Kode warna kuning adalah dimana tombol akan ditempatkan, TOP untuk menempatkan tombol di atas, BOTTOM untuk menempatkan tombol di bawah, LEFT untuk menempatkan tombol di sebelah kanan.
Kode warna biru anda sesuaikan jarak tombol TOP dari atas blog, BOTOM dari bawah blog.

Demikianlah Cara Memasang Buku Tamu / CBOX Di Blog Muncul Dari Berbagai Arah. Semoga bermanfaat bagi sobat semua.

10 Software Buat Posting Lebih Mudah di Blog

2:02 AM Tips Trick Blogger No comments

1. Windows Live Writer

Aplikasi editor ini dikembangkan oleh microsoft dan memiliki banyak kesamaan seperti aplikasi office yang familiar buat anda sehingga sangat memudahkan untuk beradaptasi dan menggunakan editor ini dengan cepat. Fiturnya antara lain multiple blog account, kompatibilitas dengan beberapa platform blog, rich text formatting, draft saving dan kategorisasi posting, memasukkan gambar dan tag, spell checking, ping search engine otomatis dan sinkronisasi perubahan draft pada editor dengan blog. Fitur lebihnya antara lain adalah fitur seperti memasukkan peta dan video dan halaman preview sebelum posting. Kelebihan lainnnya adalah mendukung 28 bahasa lain selain bahasa inggris.

http://get.live.com/betas/writer_betas

2. ScribeFire

Addon populer firefox untuk editor blog ini dapat membantu anda untuk posting blog langsung dari browser firefox. Setelah instalasi scribefire, anda akan melihat notepad kecil seperti icon pada status bar firefox. Anda bisa mengkliknya untuk membuka editor scribefire ini pada halaman aktif firefox. Editor ini membutuhkan hampir setengah ruang screen. Jika anda mengklik icon scribefire ini anda bisa memilih untuk membuka editor tersebut pada new tab atau window terpisah. ScribeFire ini cukup nyaman sehingga anda tidak perlu menginstal program berat dan cukup membuka editor pada browser anda dengan mudah. Fiturnya antara lain rich text formatting, editing halaman HTML dan pilihan preview posting anda sebelum mempublikasikannya. Anda juga bisa mengkategorisasikan post anda, memasukkan tag technorati dan mengakses halaman del.icio.us dari halaman scribefire. ScribeFire ini kompatibel dengan banyak program blog seperti wordpress, blogger, typepad, drupal, textpattern, MetaWeblog dan lain sebagainya.

http://www.scribefire.com

3. Qumana

http://www.qumana.com

Qumana ini memiliki satu fitur dimana blog editor tidak memilikinya, yaitu Q ads yang terintegrasi dengan editor blog. Jika anda menulis posting pada editor blog anda, anda bisa memasukkan iklan dari editor blog itu sendiri. Anda bisa memilih tipe iklan yang tampil dengan kata kunci spesifik yang anda pilih. Sayangnya Q ads ini tidak menampilkan banyak iklan untuk ditampilkan. Meskipun begitu, Qumana ini memiliki semua yang diperlukan oleh editor blog yang bagus seperti rich text formatting, multiple blog accounts, memasukkan tag dan kategori, download recent post, memasukkan video dan lain sebagainya. Editor ini sangat ringan, artinya tidak memerlukan terlalu banyak resource dan ruang di komputer anda dan selain itu ada fitur bernama DropPad, clipboard kecil seperti utiliti untuk drag and drop teks, link dan gambar. Anda cukup dobel klik pada DropPad untuk membuka editor blog ini.

4. Zoundry

http://www.zoundry.com

Aplikasi ini memudahkan anda untuk mengatur account blog anda. Anda tinggal memberikan url blog anda dan kemudian zoundry akan menentukan dimana platform blog dan setting API pada blog tersebut. Anda juga bisa mendownload hingga 500 entri blog ke komputer anda sehingga bisa berfungsi sebagai backup blog. Editor ini memiliki interface WYSIWYG dan HTML, dan juga anda dapat menemukan banyak pilihan format toolbar. Setting kategori posting dan tag untuk technorati juga didukung. Selain itu ada juga spell checker dan translator bahasa. Fitur lainnya adalah anda bisa menambahkan link afiliasi pada posting blog anda dan menghasilkan komisi ketika siapapun membeli melalui link tersebut. Zoundry ini juga memiliki toolbar browser untuk firefox dan internet explorer dengan fitur “blog this” dan link dimana anda bisa sharing rekomendasi produk anda melalui email atau halaman jaringan sosial, selain itu anda juga bisa mendapatkan potongan diskon belanja dengan toolbar ini.

5. Thingamablog

http://thingamablog.sourceforge.net

Editor blog open source dan feed reader ini dikombinasikan dalam satu aplikasi desktop dan berjalan independen. Anda bisa menggunakan aplikasi ini untuk posting pada blog FTP dan SFTP. Selain itu thingamablog juga menyediakan beberapa template blog yang bisa anda gunakan jika ingin membuat blog baru. Mengkonfigurasi Thingamablog untuk pertama kali dapat merepotkan buat pemula. Tetapi jika anda mau ke situs thingamablog ini, banyak tutorial bagus yang bisa anda ikuti. Editor posting thingamablog ini memiliki hampir semua pilihan formatting dasar dengan spell checker. Anda dapat melihat preview posting anda pada WYSIWYG atau mode HTML. Gambar-gambar tersebut dapat di-upload dari komputer atau anda bisa memberi link gambar online tersebut. Thingamablog itu membutuhkan Java Virtual Machine untuk di-instalasikan pada komputer anda.

6. Flock

http://flock.com/

Flock memiliki aplikasi editor blog yang dapat bekerja pada platform blogging seperti blogger, blogsome, livejournal, typepad, wordpress, xanga dan berbagai platform hosting blog lainnya. Anda juga bisa mengkonfigurasi banyak akun blog pada flock. Anda bisa menggunakan klipboard web flock untuk mengkoleksi snippet ketika surfing web dan menambahkan gambar dari akun flickr atau photobucket atau mengupload gambar dari komputer. Flock juga memiliki uploader cepat yang bisa anda gunakan untuk mengupload file pada web. Editor flock memiliki fitur formatting dan anda dibatasi pada beberapa jenis font dan ukurannya. Disini anda tidak akan menemukan tombol “insert table” atau “strikethrough”. Meskipun anda bisa memberi tag pada posting anda, anda tidak bisa mengkategorisasikannya.

7. W.Bloggar

http://wbloggar.com/

Aplikasi editor blog ini tersedia pada bahasa inggris, perancis, jerman, portugis dan spanyol. Aplikasi ini juga mendukung sejumlah platform blog seperti blogger, movable type, typepad, drupal, wordpress, live journal dan lain sebagainya. Anda bisa mengirim ping posting anda melalui weblogs, blo.gs, technorati, dan ping-o-matic. Mengkonfigurasi w.Bloggar pada blog anda terutama blog dari blogger mungkin bisa menyusahkan tentunya jika anda tidak terlalu paham teknologi. Meskipun begitu, anda bisa mencari saran dan tutorial yang ditulis oleh pengguna w.bloggar pada halaman web-nya. w.Bloggar ini memiliki banyak pilihan formatting, mendukung banyak akun blog, memiliki fitur spell check dan kategorisasi dan banyak lagi. Anda bisa mengeset FTP untuk mengupload file dan gambar. Editor ini memiliki mode html dan anda bisa melihat kode tersebut pada posting anda. Hal ini mungkin sedikit membingungkan untuk blogger baru tapi mode preview yang disediakan bisa cukup membantu. Kelebihan w.bloggar ini adalah kecepatan mempublikasikan posting yang cukup cepat.

8. Blog Desk

http://www.blogdesk.org

Aplikasi ini ada pada versi bahasa inggris, jerman, dan spanyol dan mendukung banyak platform blog. Meskipun begitu, aneh juga karena tidak memiliki platform blogger pada daftar platform yang didukung, hal ini berarti pengguna blogger harus mengkonfigurasi blognya secara manual. Blog desk ini memiliki beberapa fitur keren seperti image wizard yang dapat membantu anda untuk memasukkan gambar pada blog dan mengeditnya, kamus bahasa dalam 14 bahasa, frasa yang sering digunakan dan notebook. Selain itu juga ada dukungan untuk technorati tag, pinger, dan spell checker. Jika anda menggunakan blog desk pada vista, anda mungkin harus mendownload file dhtmled.ocx dari halaman download microsoft.

9. Post2Blog

http://www.bytescout.com/post2blog.html

Aplikasi ini sangat ringan dan memiliki fitur bagus yang ditawarkan. Bar formattingnya memilik banyak pilihan sehingga anda bisa memasukkan smileys, strike texts dan menambahkan musik. Selai n itu ada juga pilihan untuk menambahkan iklan dari amazon pada posting anda. Fitur lainnya antara lain technorati tag atau area pinging. Post2Blog juga memiliki integrasi bagus dengan RSS reader seperti RSS bandit dan sharp reader. Anda bisa mengupload gambar bersamaan dengan posting anda pada flickr, imageshack atau situs FTP lain yang anda pilih. Anda bisa mendownloa posting terbaru dan membuat file PDF dari posting tersebut jika anda mau. Post2Blog ini memiliki add-on firefox dan IE dan juga toolbar MS Word sehingga anda bisa posting langsung dari tempat-tempat tersebut. Anda bisa mengekspor file-file post2blog dan mengaturnya pada berbagai device portabel. Fitur yang tidak bisa ditemukan adalah memasukkan kategori posting. Post2blog ini mendukung platform blog seperti blogger, wordpress, typepad, movabletype, livejournal, dan blogware.

10. Blezzer

http://larryborsato.com/bleezer/

Aplikasi ini mendukung berbagai platform blog seperti blogger, movable type, wordpress, drupal dan lain sebagainya, selain itu aplikasi ini bekerja dengan baik pada sistem windows, mac dan linux. Tool wysiwyg disini memiliki hampir semua pilihan dasar, spell checker, dukungan technorati dan tag del.icio.us, kategori posting dan layanan ping. Anda bisa mengupload gambar anda menggunakan fitur “upload file” dan mengesetnya untuk situs FTP. Kelebihan bleezer ini adalah keringanan programnya sehingga tidak membebani komputer terlalu berat, cocok jika anda menggunakan komputer-komputer lama.

Cara Membuat Permalink di Blog

8:33 AM Tips Trick Blogger No comments

Cara Membuat Permalink di Blog - Apa kabar sobat blogger semua!!! Kali ini saya akan mempostingan jawaban atas pertanyaan sobat blogger tentang cara membuat / memasang permalink di blogspot sama persis dengan permanen link di blog ini. Sekedar informasi, postingan sebelumnya adalah cara membuat logo. Sebelum kita ke TKP ada baiknya saya jelaskan sedikit dulu tentang Permalink ( permanen link).

Permalink adalah istilah untuk link aktif permanen pada suatu artikel di halaman posting yang di biasanya di letakan di bawah atau sesudah postingan, fungsinya tidak lain dan tidak bukan yaitu untuk meningkatkan seo on page blog sobat. Biasanya sobat yang newbie menemukan artikel seperti ini dengan keyword cara membuat link tetap atau tambahan detail postingan yang letaknya di bawah artikel, sebelum sobat tahu bahwa namanya adalah permanen link.

Permalink kali ini saya sudah di lengkapi dengan author box dimana di dalamnnya bisa di pasangi foto / gambar milik sobat, juga di lengkapi dengan url artikel yang auto drag ( otomatis ter blok ) . Contohnya bisa sobat lihat tepat di bawah artikel.

Sobat yang tertarik dengan widget yang satu ini, silahkan ikuti tutorial berikut.

Cara Membuat Permanen Link di Blog

1. Login ke akun blog sobat.
2. Klik rancangan --> Edit HTML --> Centang kotak expand template widget
3. Letakkan kode berikut di atas kode ]]></b:skin>

.admin-tulisan{
width:auto;
background:#f2f2f2;
border:2px solid #000000;
margin:30px 0 10px 0;
display:block;
font-family:"julee";
color:#000;
}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{
background:#FF0000;
border:none;
border-bottom:1px solid #000000;
color:#fff;
font-family:"julee";
text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
padding:5px 10px;
margin:0 0 0 0;
display:block;
}
.admin-tulisan h4 a{color:#000000;}
.admin-tulisan img{
background:#000000;
width:90px;
height:100px;
border:1px solid #000000;
margin:3px 10px 0 0;
float:left;
padding:2px;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
}

4. Cari kode <data:post.body/> ( gunakan Ctrl + F ) dan letakkan kode berikut tepat di bawahnya.

<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <b><data:post.author/></b> ~ Tips dan Trik Blogspot</h4>
<div class='kontainer'>
<img alt='Christian angkouw' src='http://i1108.photobucket.com/albums/h405/christian410/269111_225685127450056_100000257112719_900053_7432574_n.jpg'/>
Sobat sedang membaca artikel tentang <b><a expr:href='data:post.url'><data:post.title/></a></b>. Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya
<textarea cols='50' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='1'><a href="<data:post.url/>" target="_blank"><data:blog.pageName/></a></textarea>
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'>
<a href='http://christiantatelu.blogspot.com/2012/03/cara-membuat-permalink-di-blog.html' target='_blank'>:: Get this widget ! ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>

5. Klik save dan lihat hasilnya.

Tambahan :

Ganti kode yang berwarna biru dengan Url foto / gambar milik sobat
Sesuaikan angka yang berwarna merah dengan ukuran template blog sobat ( ukuran textarea )

Cara Membuat Buku Tamu Auto Hide di Blog

8:30 AM Tips Trick Blogger No comments

Cara Membuat Buku Tamu / Guestbook Auto Hide di Blog - Apa kabar sobat blogger??? Pertama - tama saya memohon maaf atas komentar - komentar sobat blogger yang belum sempat saya balas sebelumnya, karena hidungku ( mampet ), aktivitas blogging ku terhenti hampir seminggu. Setelah sebelumnya memposting artikel cara memasang artikel acak di blog, kali ini dengan hidung yang masih cenat - cenut saya akan menjawab permintaan dari salah satu sobat blogger yang meminta cara membuat buku tamu auto hide di blog seperti yang tampak di sidebar blog ini.

Auto hide Shuotbox adalah efek yang akan membuat buku tamu muncul tanpa di klik dan tersembunyi tanpa di klik pula ( di lewati pointer mouse ), hanya beda sedikit dengan buku tamu show / hide. Sobat yang tertarik memasang widget ini, silahkan masukkan kode berikut diHTML/Javascript blog sobat.

<div id="cboxdiv" style="text-align: center; line-height: 0">

</div>

<br />
<div style="text-align:center">
<span style="float:right; color:#000000;">Get this <a target="_blank"href="http://christiantatelu.blogspot.com/2012/03/cara-membuat-buku-tamu-auto-hide-di.html"> widget! </a></span>
</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script>

</div>

Caranya :

Klik rancangan --> Elemen laman --> Tambah gadget --> HTML/Javascript
Masukkan kodenya di kotak yang di sediakan.
Klik Save

Tambahan :
Ganti kode yang berwara biru dengan kode buku tamu milik sobat. Sobat yang belum punya buku tamu silahkan buat terlebih dahulu di cbox ( seperti blog ini) , fibox, shoutchamp atau pada penyedia chatbox gratisan lainnya.

Cara Membuat Tampilan Popular Post Berjalan

8:25 AM Tips Trick Blogger No comments

Popular post atau istilah kerennya postingan yang terpopuler, seperti contoh popular post yang ada di sidebar blog saya ini. Bagaimana menarik bukan? Kalau kita cuma pakai yang standar maka tidak akan bergerak seperti itu, lalu membuatnya bagaimana? Caranya sangat mudah, pertama, tentu anda harus memasang gadget popular postnya terlebih dahulu, dengan klik rancangan - elemen laman - tambah gadget - tambahkan popular post/entri populer.

Kemudian anda masuk ke edit HTML, expand widgetnya dicentang,dan cari kode seperti ini

Kemudian, perhatikan kode di bawah ini

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
<ul>
<marquee align='left' direction='up' height='250' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
<b:loop values='data:posts' var='post'>
<li>
<b:if cond='data:showThumbnails == "false"'>
<b:if cond='data:showSnippets == "false"'>

<a expr:href='data:post.href'><data:post.title/></a>
<b:else/>

<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</b:if>
<b:else/>
<b:if cond='data:showSnippets == "false"'>

<div class='item-thumbnail-only'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
</div>
<div style='clear: both;'/>
<b:else/>

<div class='item-content'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</div>
<div style='clear: both;'/>
</b:if>
</b:if>
</li>
</b:loop>
</marquee></ul>

*Kode yang berwarna MERAH adalah kode yang harus anda tambahkan.
*Pratinjau terlebih dahulu sebelum menyimpan template.

Memasang Widget Google Translate Pada Blog

8:14 AM Tips Trick Blogger No comments

Posted by Fhianjunioron Saturday, March 14, 2013

Sesuai dengan namanya. Widget ini berfungsi untuk menerjemahkan bahasa yang satu ke bahasa yang lain. Dengan memasang widget ini, maka pengunjung yang berasal dari negara lain juga bisa menikmati konten diblog anda. Selain itu, anda juga bisa memanfaatkan widget ini untuk belajar bahasa asing lho. Menarikkan?

Sebenarnya google translate ini sudah pernah saya bahas pada beberapa waktu yang lalu. Namun karena widget ini sudah mengalami perubahan yaitu menggunakan icon-icon bendera sehingga tampilannya menjadi lebih menarik.

Contohnya seperti ini yang dibuat oleh mad tomatoe

dan ini yang dibuat oleh kang rohman

Oleh sebab itu, pada postingan ini saya ingin membahas kembali dengan menyajikan widget buatan saya sendiri. Seperti yang dibawah ini

Widget ini saya buat dengan mengganti icon bendera yang berbentuk seperti pin dan diberi sedikit efek shadow sehingga hasilnya menjadi seperti diatas. Semoga tidak terlalu mengecewakan.

Bagi anda yang tertarik, silahkan copy kode dibawah ini.

Untuk Google Translate 2 baris. Gunakan kode dibawah ini:

Untuk Google Translate 3 baris. Gunakan kode dibawah ini:

1. Kalau sudah, buka kotak HTML/ javascript lalu pastekan kodenya kedalam kotak.

2. Klik Save. Selesai. Silahkan lihat hasilnya.

Jika anda merasa letaknya kurang pas dengan kolom sidebar anda. Anda bisa menyesuaikan jaraknya dengan mengganti nilai 0 pada padding-left. Semakin tinggi nilainya semakin lebar jaraknya. Dan jika anda ingin mengganti icon benderanya dengan icon lain. Silahkan ganti tulisan bewarna merah dengan alamat url icon anda.

Selamat mencoba. Semoga bermanfaat.. ,,,

fhian junior

Kumpulan Widget Blog Yang Keren Dan Ringan

6:54 PM Tips Trick Blogger No comments

posted by fhianjunior 26 April 2013

Berhubung banyaknya request yang datang melalui search engine tentang Widget Keren Untuk Blog,Kumpulan Widget untuk blog,Widget yang ringan untuk blog,Widget untuk menghias blog,maupun kata kunci yang lainnya,yang mana sebagian sahabat mungkin ada yang tidak terpuaskan apa yang liandhara sajikan atau merasa tertipu dan kecewa apa yang liandhara share pada postingan yang lalu yang berjudul Kumpulan Widget Blog Yang Keren Dan Ringan.

Maka dari itulah,sebagai rasa permohonan maaf dan rasa tanggung jawab liandhara yang merasa merugikan atau ada sebagian dari para sahabat pengunjung blog ini yang merasa kurang puas apa yang telah liandhara sampaikan pada postingan tersebut,maka sebagai pelengkap postingan tersebut berikut ini Posting lanjutan Kumpulan Widget Blog Yang Keren Dan Ringan Jilid Dua

1. Widget Burung Twitter Di Blog

<script type="text/javascript"
src="http://bloggerblogwidgets.googlecode.com/files/way2blogging.org-tripleflap.js"></script><script
type="text/javascript">

var twitterAccount = "@TwitterKu";

tripleflapInit();

</script><noscript><span
style="font-size:10px;"><a
href="http://liandharaa.blogspot.com">Get this</a></span></noscript>

Cara pasangnya,masuk ke dasbord,klik tata letak,klik add gadget,lalu patekan kode diatas dan jangan lupa ganti @TwitterKu dengan nama twitter sahabat, pada kotak html yang tersedia,lalu klik simpan.

2. Widget Google plus badge

<div class='widget-content'> <div style="float: right; margin-right: 10px;"> <span style="font-size: 60%"><a href="http://liandharaa.blogspot.com/2013/02/surat-terbuka-untukmu-mister-google.html" target="_blank" title="Widget G+ Circles ">Get Widget</a></span></div> <br /> <div class='g-plus' data-action='followers' data-height='300' data-href='https://plus.google.com/101385423073163418247' data-source='blogger:blog:followers' data-width='260'> </div> <script type='text/javascript'> (function() { window.___gcfg = {'lang': 'in'}; var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script> </div>

Cara pasangnya sama pada Widget twitter diatas,sahabat tinggal mengganti kode yang berwarna merah dengan url atau kode goggle plus sahabat saja.

3.Widget Translate atau terjemahan, klik disini.
Karena widget ini sudah saya posting ditempat yang berbeda,silahkan sahabat kunjungi postingan tersebut.

4. Widget Langganan Artikel Terbaru Via Email

<form onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TutorialInternetDanBlog', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" action="http://feedburner.google.com/fb/a/mailverify" style="border: 0px solid rgb(222, 222, 222); padding: 3px; text-align: left; background: url("http://3.bp.blogspot.com/_c6kkookxcew/sdzycinypwi/aaaaaaaaeiq/-wctpr_ksfm/s400/feedreader_2.jpg") no-repeat scroll right center rgb(255, 255, 255);" target="popupwindow" method="post"><input value="en_US" name="loc" type="hidden" /><input value="TutorialInternetDanBlog" name="uri" type="hidden" />

<p style="text-align: left; margin-bottom: 3px;"><b><img style="margin: 0pt 5px 5px 0pt; float: left; cursor: pointer;" alt="Feed" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3a42cau3MqLfgi9_v5uHMR6zW7Rb1KDzxWO4879ZFrd10XuMYZCPztL9gKZbvFWTMS-Jurxg0yYvG2KkRqqeZluxEs8f5H2NxMFftFv0nBJIKsCASVi7IbdHMqJjsRWZd7fU8bUFousxz/s1600/feed-jobindo.png" border="0" height="16" width="16" />Langganan Artikel Terbaru via Email </b>

</p><table style="margin-bottom: 3px;" border="0" cellpadding="0" cellspacing="0" width="400"><tbody><tr><td rowspan="2" valign="top" width="75"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCPJRre8BEmHCbCyTBFmE9QTU1bozhh5JwTE0GKdGD6MLahT2Orx9ekGYabOZaVpiG1BlCFqzHpo6K37hh4ITQBuFGa6qyWW_OeqB8-XTSkJI1nff86yXlX6gvhR7Jb6V9mlLS3F-M3Zlf/s1600/Newspaper-db2.png" height="55" width="70" />

</td><td align="left" height="24" valign="top" width="205"><input onblur="'if" onfocus="'if" style="width: 200px;" class="feedinput" value="Masukkan Email" name="email" size="200" type="text" /></td><td align="left" valign="top" width="119"><input id="imageField" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggQYdMx7UmVXD5bFJRWIicKkaLuHqa-c2BljoArchgbcmq5OLiW6_NOqQfnZrofnS0z7TZfZWgwRfbLmvmWoM01hCeKLBCTLDYc4PM2pUjg5gVxxvlHRgSLHRngU-eBuJf3wLI_ksxob37/s1600/subscribe-dbjobindo.png" name="I2" type="image" align="left" height="24" width="82" />

</td>

</tr>

<tr>

<td colspan="2" align="right" height="24" valign="top"><div align="left">»</div></td>

</tr><tr></tr>

</tbody></table></form>

Cara pasangnya sama seperti widget-widget sebelumnya,yang perlu sahabat ganti adalah kode yang berwarna merah,ganti dengan kode atau nama feed pada feedburner sahabat,jika sahabat belum punya kodenya,daftarkan dulu blog sahabat pada feedburner,jika belum tahu caranya,klik disini tentang panduannya.

5.Widget Semut Berkeliaran Di blog
Widget ini liandhara dapat saat berkunjung ke blog sahabat saya kang Aldi sijok http://dapurtutorial.blogspot.com.

<script language="JavaScript" src="http://dapurtutorial.googlecode.com/files/Widget%20Semut.txt" type="text/javascript"></script> <script language="JavaScript" type="text/javascript"> cot("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg90SwXChCppTuHizVahzbw9wOEzn400g2eSlCpmTgxSVCsuMEPejXlisnFR-C_5kRe-YZCxeJQvBk7HpXEEsCjNJTPV8oVLg64Dd12msHJT38nvH5z84IbHRpX_T8QVQ2YpqX40iyr1brT/s75/semut.gif") </script>

Welcome To My Site

Just Sharing Bro N Sis

Tips Dan Trik Komputer

Belajar Internet

Ngasal Aja Bro tapi Pas Kena Di Hati ,, hahaha

Tuesday, April 30, 2013

Cara Membuat Label Berputar-putar Di Blog

Cara Memasang Buku Tamu / CBOX Di Blog Muncul Dari Berbagai Arah

10 Software Buat Posting Lebih Mudah di Blog

Sunday, April 28, 2013

Cara Membuat Permalink di Blog

Cara Membuat Buku Tamu Auto Hide di Blog

Cara Membuat Tampilan Popular Post Berjalan

Memasang Widget Google Translate Pada Blog

Thursday, April 25, 2013

Kumpulan Widget Blog Yang Keren Dan Ringan

posted by fhianjunior 26 April 2013

Popular Posts

Members

Labels

Blog Archive

Statistik

Tuesday, April 30, 2013

Sunday, April 28, 2013

Thursday, April 25, 2013

posted by fhianjunior 26 April 2013

Social Profiles

Popular Posts

Members

Labels

Blog Archive

Statistik