Showing posts with label Widgets. Show all posts
Showing posts with label Widgets. Show all posts

Wednesday, April 28, 2010

7 Manfaat Widget Google Friend Connect


Penulis: Anawia putra | anawia.com





Sudah tahu apa itu google friend connect, Google friend connect adalah
suatu program komunitas sosial seperti BlogCatalog,  MyBlogLog, dan
 lain-lain. Bagi pengguna blogger mungkin tidak asing lagi karena sudah
tertanam didalamnya secara otomatis. karena blogger juga milik google
jadi otomatis sudah dipasangnya.




Bagi pemilik blog ber mesin wordpress harus mendaftar terlebih dahulu
untuk digunakan di blognya. caranya bisa dibaca di
cara
memasang google friend connect
yang pernah saya tulis di blog
saya.





Kebanyakan blogger hanya memajang widget ini sebagai trend saja. Tanpa
memanfaatkannya lebih jauh lagi. Padahal widget tersebut memiliki fungsi
yang besar untuk membesarkan situs kita. Untuk itu saya mencoba
membahas setidak nya 7 manfaat dari google friend connect.




7 manfaat itu antara lain :



1. Dapat mempromosikan tulisan terbaru



Bagi pengguna blogger akan secara otomatis memberitahu artikel terbaru
kita dihalaman dashboard para follower atau di halaman href="http://www.blogger.com/home" target="_blank">http://www.blogger.com/home
setelah anda masuk ke account blogger anda. Jika tulisan anda menarik,
mereka akan segera berkunjung ke blog anda.




2. Dapat digunakan untuk mempromosikan produk terbaru
kita.




Tanpa disadari tenyata google friend connect bisa dimanfaatkan sebagai
alat untuk mempromosikan produk. Melalui fitur nawala yang ada
didalamnya. cara menggunakannya yaitu dengan mengirim pesan nawala yang
isinya produk yang ingin anda promosikan. Kemudian kirimkan ke
follower-follower anda. Pesan akan terkirim dalam bentuk email. artinya
anda tidak perlu capek membuat autoresponden, karena google friend
connect telah dapat dimanfaatkan untuk itu.




3. Bisa mengetahui minat pembaca



Buat sebuah pertanyaan untuk mengetahui minat pembaca dengan mengakifkan
polling yang tersedia. Dengan mengetahui minat pembaca, maka anda dapat
menulis artikel yang disukai pembaca, dengan demikian maka tulisan anda
akan dilahap habis oleh pembaca. Mempromosikan produk sesuai dengan
minat mereka mungkin akan sangat baik untuk produk yang anda
recomendasikan.




4. Meningkatkan pertumbuhan blog



Dengan berjalannya manfaat pada point 1. saat anda mempromosikan
tulisan-tulisan anda maka secara tidak langsung membantu meningkatkan
pertumbuhuan blog anda dan ini harapan dari semua blogger. Karena itu
tingkatkan follower blog anda agar pertumbuhan blog yang anda miliki
lebih baik dari sebelumnya.




Banyak cara untuk meningkatkan follower blog kita. dan ini hanya
membutuhkan kreatifitas kita misalnya dengan memberikan bonus ebook atau
yang lain. sekedar contoh saya memberikan
2
bonus ebook
untuk pelanggan follower saya lihat di link tadi.




5. Dapat menjaring pelanggan lebih luas



Siapapun dapat dengan mudah menjadi pelanggan follower anda.

bergabung dalam situs Anda dengan sekali klik. Mereka dapat menggunakan
account Google, Yahoo, Twitter dan account lainnya. karena itu membuka
gerbang untuk menjaring pelanggan yang lebih luas lagi.



6. Pengunjung dapat berinteraksi dengan pengunjung yang lain



Kelebihan google friend connect yang memberi manfaat untuk pemilik blog
adalah adanya fasilitas untuk berinteraksi sesama follower. Dengan
demikian mereka akan menjadi lebih kerasan berada di blog anda. Mereka
sebagai follower juga bisa menilai dan memberi rating blog anda.
mengundang teman-teman mereka dalam penerbitan hasil kegiatan mereka
 kepada mereka jaringan sosial. lebih mendalam melibatkan pengunjung
 dengan situs Anda begitu juga


antara pengunjung yang satu dengan yang lainya



7. Pelanggan follower dapat bertambah
otomatis




Bertambah otomatis artinya pelanggan yang suka dengan blog anda bisa
mengundang sahabat-sahabat mereka untuk bergabung menjadi follower.
Dalam hal ini terjadi secara otomatis tanpa anda suruh. Fitur seperti
inilah yang menurut saya bisa menjadikan facebook besar seperti sekarang
ini. tapi ini hanya pendapat saya.




Nah dari 7 manfaat ini sebenarnya masih bisa anda gali menjadi 10 atau
lebih mungkin manfaat dari anda memasang widget follower. Terima kasih
kesempatannya kepada Om Agus telah menerbitkan tulisan sederhana saya.



Satu pertanyaan untuk menutup ulasan saya mengenai manfaat follower ini
adalah Sudahkah anda
memasang
follower widget
dan sudah pula kah anda memanfaatkannya ?

Friday, October 9, 2009

New Related Posts + Thumbnails (Alternatif selain LinkWithin)

Sudah pernah memasang widget related posts dari layanan Linkwithin? kalo belum, paling tidak rekan pernah melihat widget ini ya. sebagai contoh rekan bisa melihat contoh widget tersebut di blog saya yang versi english disini dan disini. silahkan buka salah satu postingan saya, dan lihat sample widget tersebut pada akhir postingan.







Nah, Kali ini saya coba berbagi lagi tutorial alternarif pengganti layaknya widget Linkwithin, tampilannyapun sangat mirip sekali. Tapi yang ini agak berbeda, dan kita mesti repot sedikit karena semua dilakukan secara manual. Widget ini sebenarnya sudah dibahas tuntas oleh pembuatnya Aneesh diblognya disini



Biar gak bingung saya translate aja ya caranya disini:



1. Pertama, masuk dulu ke halaman Edit HTML, jangan lupa memberi tanda centang pada  "Expand Widget Templates"




2. Cari kode ini </head>




3. Kemudian ganti dengan kode dibawah ini




<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type="text/css">
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}

#related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:black;
}
#related-posts a:hover{
color:black;
}

#related-posts  a:hover {
background-color:#d4eaf2;
}
</style>
<script src='http://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/>
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->
</head>





4. Sekarang cari lagi kode dibawah



<div class='post-footer-line post-footer-line-1'>



Jika tidak menemukan kode diatas, coba cari kode seperti ini



<p class='post-footer-line post-footer-line-1'>



Kalo sudah ketemu, tinggal masukan semua kode dibawah ini dibawah salah satu dari kode diatas yang rekan temukan.




<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger widgets</a>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle="Related Posts";
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</div><div style='clear:both'/>
</b:if>
<!-- Related Posts with Thumbnails Code End-->



5. jangan lupa disimpan dah lihat hasilnya



Untuk menampilkan berapa banyak jumlah related posts bisa dengan mengedit kode dibawah ini:



var maxresults=5;




Untuk mengganti title, kita bisa mengedit kode ini:



var relatedpoststitle="Related Posts";



Selamat Mencoba aja :)

Thursday, September 17, 2009

Launching Entrecard Referral Program


Buat rekan yang sudah bergabung dalam layanan
Entrecard
mungkin sudah menerima informasi ini di inbox mail masing-masing ya, dimana
dalam info singkat tersebut Entrecard saat ini telah meluncurkan fasilitas
terbaru yaitu sistem "Entrecard Referral Program". Seperti kita ketahui
sistem referall merupakan cara lain untuk merujuk pengguna baru untuk bergabung
dalam suatu layanan. Kita cukup memasang link atau banner yang sudah disediakan
pihak Entrecard, sebagai imbasnya tentu saja kita akan menerima lebih banyak
credit tentunya.



 


Ada satu hal yang menarik, selama masih dalam masa promosi,
jika pengguna baru yang tergabung dalam referral kita mempertahankan widged Entrecard ini selama 14
hari, maka kita akan mendapat imbalan dan menerima 300 kredit Entrecard sebagai
ucapan terima kasih. 


 


Untuk mencoba fasilitas ini, silahkan login ke dashboard masing-masing, lalu
pilih pada link "Referral Program" silahkan pilih link atau beberapa pilihan
banner sesuai dengan ukuran yang rekan inginkan. lalu pasang kode tersebut pada
blog masing-masing.


 


Oh iya, Entrecard widget saat ini hanya support pada blog ber-konten English
saja, untuk blog indonesia mau gak mau harus bersabar dulu ya. ya sudah, kalo gak keberatan rekan bisa langsung bergabung melalui referall saya
disini

Tuesday, September 15, 2009

Cara Mudah Berbagi Aktivitas Sosial dengan Widget Bloggybits


BloggyBits merupakan
layanan yang memungkinkan kita memasang widget cepat berupa aktivitas terbaru
pada beberapa jaringan sosial terpopuler dan menanamkannya kedalam situs atau
blog. Situs sosial yang didukung saat ini diantaranya adalah: Twitter, Digg,
Flickr, StumbeUpon, Delicious atau Rss Feed.






Proses untuk setting wigdet dapat dikatakan sangat mudah, setelah memilih
dan menekan tombol, situs akan memproses data, kemudian mengembalikan tampilan
visual widget dan kode untuk menyalinnya ke situs atau blog kita. Yang jelas,
layanan ini bisa di gunakan langsung tanpa harus login sama sekali :)

Sunday, September 13, 2009

Meningkatkan Trafik Blog Melalui Twitter Dengan Memasang Button Tweetmeme / ReTweet

Banyak sekali usaha untuk meningkatkan trafik, salah satunya mungkin
membagikannya melalui jejaringan sosial twitter. Namun sekedar hanya
berbagi artikel melalui twitter sendiri saja tidak cukup lho, tidak masalah kalo
list friend di Twitter kita sudah mencapai ribuan follower, tapi kalo cuman
50-100 sepertinya tidak terlalu efektif. Nah, dari pada pusing tiap hari mem-follow
orang2 yang gak jelas, apalagi tujuan utama hanya kesedar memperbanyak teman,
alangkah baiknya kita meminta bantuan pembaca sendiri untuk membagikan link
artikel kita di twitter mereka masing2. Cara yang paling mudah salah satunya
bisa dengan memasang button dari
Tweetmeme
atau Retweet.



 



Untuk memasang button Tweetmeme ini sangat mudah, pertama masuk kehalaman
EDIT HTML
, kemudian beri tanda centang pada Expand Template Widget.
Kalo sudah, cari kode yang warna merah dan letakan
kode button warna hijau tepat dibawahnya.


 


<div class='post-header-line-1'/>



<div style='float:right; margin-left:10px;'>

<script type='text/javascript'>

tweetmeme_url = &#39;<data:post.url/>&#39;

</script>

<script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'>
</script>

</div>


 




Hampir sama dengan cara diatas, memasang button Retweet ini juga sangat mudah, pertama masuk kehalaman
EDIT HTML
, kemudian beri tanda centang pada Expand Template Widget.
Kalo sudah, cari kode yang warna merah dan letakan
kode button warna hijau tepat dibawahnya.


 


<div class='post-header-line-1'/>


 


<script type="text/javascript">

url = '<data:post.url>';

</script>

<script type="text/javascript" src="http://www.retweet.com/static/retweets.js"></script>






Jika ingin ukuran kecil:






<script type="text/javascript">

url = '<data:post.url>';

size = 'small';

</script>

<script type="text/javascript" src="http://www.retweet.com/static/retweets.js"></script>


 


Sedikit informasi, Tweetmeme atau Retweet memiliki nilai counter tersendiri untuk
menilai seberapa banyak link kita yang telah dibagikan oleh pembaca. kita dapat
melihat nilai tersebut langsung pada buttonnya.


 


Oh iya berhubung account twitter lama saya kena suspend dari pihak
twitter tanpa alasan yang jelas, jadi saya mengundang kembali pembaca setia o-om.com
untuk bergabung melalui account twitter yang baru
disini

Friday, August 28, 2009

Berbagi lewat Navbar blogger



Mengamati perkembangan blogger sepertinya tidak akan ada habisnya, 
dihari jadi blogger yang ke 10 tahun ini terlihat blogger semakin berbenah diri
dan terus saja memperbaiki platform andalan mereka. Jika sebelumnya blogger
menambahkan fitur terbaru pada label dengan

style label cloud
, kali ini blogger menambahkan lagi fitur terbaru yang kali
ini berkaitan dengan navigation bar (navbar).








Jika diperhatikan, ada satu tambahan baru berupa link "share" yang
dikhususkan untuk mempermudah pengunjung untuk membagikan konten-konten berguna. 
Terlihat ada 4 tujuan layanan populer ketika pengujung mengklik link "berbagi"
pada fitur ini yaitu pengunjung dapat membagikannya langsung via Email, Twitter,
Facebook dan Google Reader.







Di lain cerita, menurut saya pribadi, dengan adanya fitur "share from
navbar"
mungkin saja ini usaha blogger untuk menghindari penggunanya agar
tidak meng-hidden fasilitas navbar yang sudah disediakan  blogger sejak
hadir pertama kali. Yah tapi mo gimana lagi, kita juga berusaha khan agar
tampilan blog pribadi di blogger bisa terlihat profesional dan gak berkesan
gratisan. Jadi ya terserah, navbar ini mau ditampilkan apa tidak hehehe


Tuesday, August 25, 2009

Menampilkan Label Cloud di Blogger


Jika sebelumnya blogger hanya menyediakan label dalam bentuk daftar bullet,
namun sekarang sepertinya sudah ada penambahan fasilitas baru lagi dimana sudah
tersedianya widget label Cloud (awan). Ini dapat rekan lihat
langsung pada widget label masing-masing. Setelah
diaktifkan, label yang lebih populer muncul dalam font yang lebih besar daripada
label yang kurang populer.




Pilih Label - Fasilitas lain yang ditambahkan pada label yaitu kita
dapat memilih dengan menyeleksi label mana saja yang ingin ditampilkan.





Info selengkapnya baca di

http://buzz.blogger.com


Tuesday, June 16, 2009

Memasang Widget Recent Post + (Thumbnails dan Comment Count)

Beberapa rekan mungkin sudah ada yang pernah memasang Widget Recent Post +
Thumbnails
+ Comment Count ini ya, bagi yang belum pernah tidak ada salahnya mencoba
memasang widget cantik ini yang saya ketahui pembuatnya bernama Kranti,
yaitu owner dari

Bloggertriks.com
. Kalo tidak salah dulu saya pernah juga menulis tentang
Recent Posts menggunakan Javascript, tapi yang terbaru ini rada beda, dimana
widget ini tidak hanya menampilkan recent post doank, tetapi juga dilengkapi
dengan penambahan fasilitas gambar dan juga jumlah komentar. Silahkan lihat
samplenya di
zoomtemplate.com








Ok tanpa banyak omonk langsung ke tutorial saja yoooo.




Untuk memasang widget ini caranya sangat mudah, kita tinggal copy-paste aja
semua kode dibawah ini, kemudian langsung paste aja dalam gadget
HTML/javascript
(Tuju tab Layout - Page Elements - Add a Gadget - pilih
HTML/javascript)




<script language="JavaScript">

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";


showRandomImg = true;

boxwidth = 298;

cellspacing = 8;

borderColor = "#ffffff";

bgTD = "#000000";

thumbwidth = 40;

thumbheight = 40;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = false;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 5;

home_page = "http://schemar-mag.blogspot.com/";

</script>

<script src="http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js"
type="text/javascript"></script>




Apa saja yang perlu diedit?




boxwidth -
Ukuran Lebar Widget

cellspacing - Spasi
diantara cells


borderColor -
Warna Border

thumbwidth & thumbheight - Ukuran
lebar dan tinggi gambar Thumbnails

fntsize -
Ukuran Font pada title

acolor -
Warna title

aBold -
Tebal huruf pada title? (true or false)

numposts -
Jumlah recent post yang ditampilkan?

home_page : http://NAMABLOGKAMU.com/
(Ubah sesuai URL blog masing2)


Thursday, May 14, 2009

Page Peel Efek menggunakan jQuery & CSS

Kalo tidak salah dulu saya pernah nulis tutorial tentang iklan bergaya Page
Peel ya? coba buka arsip dulu...nah ketemu :) oh iya ternyata ada 2 tutorial

berbeda yang pernah di publish, yang pertama untuk tampilan menggunakan style

Page Ear Javascript
, trus..sama ini yang kedua

Sexy Curls jQuery Plugin
. Nah, buat rekan yang rada asing dengan istilah Page
Peel, silahkan buka kembali arsip terdahulu pada kedua link diatas ya.





Ok lanjut, nah kali ini saya menemukan Page Peel terbaru buatan

Sohtanaka.com
dengan koding yang tentu saja sangat berbeda dengan kedua Page
Peel diatas,  Sohtanaka tidak menggunakan setup koding yang
rumit, jadi rekan tinggal langsung memasangnya saja dihalaman blog. Walaupun
masih ada
sedikit yang harus diedit, itupun hanya sekedar mengubah tampilan gambar
dan link tujuannya saja. Bila dilihat sekilas, untuk style tampilannya hampir
sama saja, dimana ketika kita mengarahkan mouse pada area PagePeel ini, maka
akan terlihat halaman menggulung layaknya anda membuka selembar kertas dan
menemukan halaman lain dilembar sebaliknya. Lihat demonya

disini
.








Cara Pasang:




Letakan script code jQuery dibawah ini diatas kode <b:skin><![CDATA[




<script src='http://code.jquery.com/jquery-latest.js'
type='text/javascript'/>

<script type='text/javascript'>

$(document).ready(function(){

//Page Flip on hover

$(&quot;#pageflip&quot;).hover(function() {

$(&quot;#pageflip img , .msg_block&quot;).stop()

.animate({

width: &#39;307px&#39;,

height: &#39;319px&#39;

}, 500);

} , function() {

$(&quot;#pageflip img&quot;).stop()

.animate({

width: &#39;50px&#39;,

height: &#39;52px&#39;

}, 220);

$(&quot;.msg_block&quot;).stop()

.animate({

width: &#39;50px&#39;,

height: &#39;50px&#39;

}, 200);

});

});

</script>




Kemudian letakan kode CSS dibawah ini diatas kode ]]></b:skin>




#pageflip {

position: relative;

right: 0; top: 0;

float: right;

}

#pageflip img {

width: 50px; height: 52px;

z-index: 99;

position: absolute;

right: 0; top: 0;

-ms-interpolation-mode: bicubic;

}

#pageflip .msg_block {

width: 50px; height: 50px;

overflow: hidden;

position: absolute;

right: 0; top: 0;

background: url(http://img222.imageshack.us/img222/9213/subscribe.png) no-repeat
right top;

}




Letakan kode ini dibawah tag <body>




 <div id='pageflip'>

<a href='
http://feeds2.feedburner.com/namafeedkamu'>

<img alt='' src='http://img224.imageshack.us/img224/8315/pageflip.png'/>

<span class='msg_block'/>

</a>

</div>


 


Silahkan disimpan dan lihat hasilnya. Ingat! Tampilan diatas hanya sebagai contoh saja ya, rekan bisa mengganti gambar dan
link tujuan apa saja sesuai keinginan. Silahkan langsung dicoba :)


Tuesday, March 3, 2009

Akhirnya pilihan jatuh pada GFC Blogger (Followers)


Agak sulit memang menentukan mana yang pantas ditampilkan antara GFC Blogger (Followers)
dan Google Friend Connect, toh dua2 sama saja dan tidak ada bedanya
khan. Mungkin rekan juga berpikir untuk apa sih saya repot2 dan heboh sendiri
nentuin pilihan, sampai2 di pasang sistem polling segala lagi hehehe. Gini lo
friend...masalahnya simple aja, siapa sih yang mau membuang widget yang jelas2
berisi informasi penting dari keberadaan member, apalagi jumlah membernya sudah
bejibun, sayang rasanya bila salah satu widget ini sampai dihilangkan..tul gak?
"BETULLLL" hehehe. Yah, paling tidak dengan memasang sistem polling vote saya
bisa lebih mudah melihat widget mana yang paling banyak disukai pembaca :)





Melihat hasil polling yang sudah saya tentukan selama 5 hari ini, tercatat
ada sekitar 126 responden telah memberikan hak suaranya *halah* hehehe. Hasil
vote sudah jelas bahwa responden lebih banyak yang memilih untuk tetap memasang
kedua widget ini saja, hasil bisa dilihat pada jumlah polling vote yang tercatat sekitar 59 (46%) suara, diikuti dengan pilihan Follower sebanyak 47 (36%) dan pilihan paling sedikit dari GFC yaitu sebanyak 31 (24%) suara.







Niat awal memang saya berencana untuk mempertahankan ke dua widget ini, nah
berhubung kemaren dapat kiriman email langsung dari pihak blogger yang isinya
kurang lebih menerangkan adanya perubahan setting pada status following 
menjadi "private" bila kita tetap memasang ke dua widget ini dan disarankan kita
sebaiknya kita menggunakan salah satunya saja, ciaaauuu saya gak mau ambil
resiko ah, mending salah salahnya saya non aktifkan, sekalian cari amannya saja
hehehe




Trus, kenapa pilihan harus jatuh ke Followers ya? berdasarkan jumlah vote
Follower urutan yang kedua khan hehehe. Rekan gak usah ikutan bingung milih yang
terbaik, pilih aja salah satunya, disini tidak ada masalah integrasi ini dan
itu-nya kok..toh widget ini sama-sama engine dari Google Friend Connect (GFC).




Yang sudah terlanjur daftar di GFC o-om.com, sekarang bisa beralih ke
Followers saja ya..saya tunggu dukungan rekan semua. thanks


Friday, January 30, 2009

AddInto: Alternatif berbagi Sosial Bookmark


Addinto merupakan
layanan yang memudahkan pengujung untuk menyimpan, berbagi dan
mempromosikan konten anda keberbagai macam jaringan sosial. Sama halnya
dengan layanan sosial bookmark lainnya yang sudah pasti anda kenal
seperti Addtoany dan
Addthis, cara kerja Addinto
kurang lebih sama saja. Cukup dengan memasang widget atau satu small button saja maka pengunjung bisa dengan leluasa memilih lalu mengirimkan konten anda ke media
jaringan sosial, situs favorit atau hanya sekedar berlangganan via Rss Feed.








Selain itu layanan Addinto juga menyediakan fasilitas one button one
content yang sudah terintegrasi dengan beberapa platform, termasuk blogger
tentunya. Karena masih berstatus beta, saya sendiri belum bisa mengatakan
layanan ini lebih bagus dibanding kedua seniornya diatas, tapi tidak
ada salahnya khan anda juga mencobanya :)



Tuesday, January 27, 2009

Sexy Curls jQuery Plugin: Alternatif iklan bergaya Pagepeel


Sekitar 4 bulan yang lalu saya pernah mempopulerkan

iklan bergaya Pagepeel
yang ternyata 100% berhasil diaplikasikan pada platform blogger. Nah,
PagePeel yang baru kali ini atau kita sebut saja dengan
Sexy Curls
jQuery Plugin
sesuai dengan nama yang diberikan oleh si pembuat
kode Elliott Kember memang jauh berbeda dengan yang sebelumnya,
dimana
Sexy Curls
tidak hanya menggunakan standar Javascript tapi diperlukan
juga plugin jQuery
untuk bisa menjalankan aplikasi ini.








Contoh Sexy Curl bisa anda lihat di
agusramadhani.com 




Selain itu ada sedikit perbedaan saat anda mengarahkan mouse pada area
pagepeel, kalo yang dulu saat mouse diarahkan iklan secara otomatis akan
menggulung kebawah, sedangkan yang menggunakan Sexy curls kita harus
menarik iklan ini menggunakan mouse secara manual ditandai dengan pointers
Diagonal Resize.




Tutorial Cara Pasang (Installasi):




1. Download dulu file

Sexy Curls jQuery Plugin




2. Kemudian Extrack file hasil download .zip atau .rar di
folder anda.




3. Silahkan Edit File turn.js (menggunakan notepad
misalkan)




Note: dalam file
turn.js
inilah semua konfigurasi yang anda perlukan. Agar anda tidak
pusing tujuh keliling, saya sertakan saja contoh dari beberapa kemungkinan yang
perlu anda edit. Lihat code yang diedit dengan warna merah.




 // Set up the wrapper objects

var turn_hideme = $('<div id="turn_hideme">');

var turn_wrapper = $('<div id="turn_wrapper">');

var turn_object = $('<div id="turn_object">');

var img = $('<img id="turn_fold" src="http://www.domain.com/turn/'+
(options.




http://www.domain.com/turn/
hanya sebagai contoh saja, anda harus sesuaikan sendiri alamatnya.
Pastikan turn.js disimpan dalam folder
/turn




Sebenarnya masih banyak configurasi yang lain, selebihnya dibaca saja ya pada
manualnya.




4. Upload semua file yang ada kedalam folder (/turn/) ke hosting milik
anda (pages.google.com
atau geocities.com misalkan)




5. Langkah akhir lakukan pemanggilan javascript, atau dari pada puyeng langsung
copy paste aja kode dibawah ini. jangan lupa mengganti alamat url dibawah
ditandai dengan warna merah dibawah.




<script src='http://www.domain.com/turn/jquery1.3min.js'/>

<script src='
http://www.domain.com/turn/jqueryui.js'/>

<script src='
http://www.domain.com/turn/turn.js'/>

<link href='
http://www.domain.com/turn/turn.css'
rel='stylesheet'/>


<script type='text/javascript'>

$(document).ready(function(){

$(&#39;#target&#39;).fold();

});

</script>


<img id='target' src='http://www.domain.com/turn/turn/code.png'/>




Letakan kode diatas dibawah kode <head>, atau bisa juga diletakan diatas
kode <b:skin><![CDATA[

 


Yah mungkin segitu aja dulu, silahkan dicoba aja :)


Friday, January 23, 2009

Cara pasang Widget Feedback di Blogger


Mungkin sebagian rekan belum memahami bener maksud saya memasang
fasilitas feedback
di blog ini. Konsep saya dari awal sebenarnya fasilitas ini sebagai sarana komunikasi dan cara mudah saling berinteraksi layaknya forum, jadi tidak hanya komunikasi satu arah antara saya dengan pengunjung saja, semua juga harus aktif dan sebisanya terlibat untuk saling membantu satu sama lain seputar masalah blogging. Yah..untuk sementara ini saya lihat saja dulu perkebangannya, jika memang fasilitas ini berguna akan tetap saya pertahankan, bila tidak, dengan berat hati saya terpaksa menghapusnya :(








Kembali ketopik, karena banyak rekan yang ingin mencoba memasang fasilitas feedback ini di blog masing2, jadi langsung saja saya tulis tutorialnya. Silahkan ikuti intruksi dibawah ini:




Cara memasang widget Feedback diblogger:




1. Buat account anda di
http://getsatisfaction.com/


2. Bila account sudah tercipta, langsung saja tuju ke menu Widgets


3. Pada halaman ini ada pilihan 4 widget yang bisa anda pilih sesuai
keperluan. pilih saja salah satunya.


4. Kemudian pilih Get the code for this widget,
silahkan Copas saja semua kode.


5. Untuk cara memasangnya di blog/site sebenarnya disitu sudah ada
petujnuk yang menyarankan kita meletakan kodenya sebelum tag </body>,
menurut saya lupakan cara ini, ada cara yang lebih mudah dimana kita bisa
langsung meletakan semua kodenya pada Page Elements dengan menambahkan
Add a Gadget.


6. Selesai, silahkan simpan pekerjaan anda dan lihat hasilnya, gak ribet khan
:)






Masih kurang puas menggunakan fasilitas feedback dari layanan
http://getsatisfaction.com/ alternatif
lainnya saya sarankan anda coba melalui layanan
https://www.kampyle.com/ semoga info ini
bermanfaat :)

Monday, January 19, 2009

Melihat Semua Informasi Situs/Blog via DataOpedia


DataOpedia merupakan layanan web yang memberikan
informasi terlengkap dan
paling komprehensif mengenai informasi sebuah blog/situs
. Layanan yang baru
dilaunching pada bulan desember 2008 ini memungkinkan kita untuk melihat
berbagai informasi dan fakta penting tentang apapun yang sekiranya berharga pada
blog/situs yang ingin dilacak semua informasinya, seperti Trafik, PagerRank, Online buzz, informasi kontak dan populeritas situs tersebut pada layanan
jaringan sosial. Singkatnya semua fakta-fakta penting dan informasi apapun pada
situs/blog bisa anda lihat melalui layanan DataOpedia.








Data Opedia saat ini memiliki 50 sumber informasi yang di kumpulkan menjadi
satu dan disusun sebagai one-stop-resource untuk memudahkan anda melihat
informasi yang ada. Selain dapat diakses melalui situs web, anda juga dapat
mengakses layanan ini melalui beberapa media diantaranya Email, Twitter, Cell
phone, type-in dan Firefox Add-ons
. Tidak hanya itu saja, jika memang
diperlukan, kita dapat juga memasang widged pencarian dan badge yang menampilkan
semua informasi situs di blog anda. Pastikan sebelum memasangnya anda sudah
terdaftar dan memiliki account dilayanan ini :)




Bugs: Setelah mencoba beberapa kali layanan DataOpedia, saya
melihat ada sedikit kesalahan, dimana layanan ini tidak mampu menampilkan
informasi URL blog/site yang menggunakan tanda penghubung "-" (contoh o-om.com),
semoga saja kesalahan ini cepat diperbaiki :)



Friday, December 12, 2008

Menjaring trafik dengan Google Friend Connect (GFC)


Semenjak rilis pertama bulan mei lalu, Google Friend Connect sekarang sudah
tersedia dalam versi beta. Layanan yang diusung untuk memfasilitasi dan
membangun komunitas sosial ini bila diperhatikan mirip dengan
blogger follower.
Yang membuatnya berbeda, Google Friend Connect tidak dibatasi hanya pada
pengguna Google (termasuk blogger) saja tapi pengguna Yahoo, AOL dan OpenID juga
dapat memanfaatkan fasilitas jaringan sosial ini.








Bagaimana Goolge Friend Connect mampu meningkatkan trafik ke blog anda?




Seperti komunitas sosial lainya yang sudah banyak digunakan seperti
mybloglog
dan blogcatalog, Friend Connect juga bisa dikatakan sebagai sarana penghubung dan memudahkan anda berinteraksi langsung dengan satu sama lain. Dengan menambahkan Friend Connect, maka pemilik situs/blog dapat
melihat, mengundang, dan berinteraksi dengan teman-taman mereka yang bergabung
dalam situs jaringan sosial semacam Facebook, Google Talk, Hi5, Orkut, dan Plaxo.
Menambahkan fitur ini, tentu blog anda akan menjadi lebih interaktif yang
akhirnya akan meningkatkan traffic situs tersebut. Untuk mempelajarinya
lebih lanjut silahkan tuju langsung ke alamat ini

http://www.google.com/friendconnect




Jika berkenan, o-om.com mengundang semua pembaca setia untuk bergabung di Google Friend Connect (GFC)
milik om. Caranya sangat mudah, anda tinggal klik saja "Join"
lalu ikuti intruksi selanjutnya. Yang sudah bergabung om ucapkan banyak terima kasih.
salam blogger :)



Sesuaikah nama dengan wajah anda?


Waks, masa gigi saya ompong? Sekilas mirip blogger bandit ya hihihi. Tapi seperti
itulah gambaran wajah om setelah memasukan nama menggunakan layanan

turnyournameintoaface
dan sepertinya kalau tidak salah ya..ada sekitar
100.000 kemungkinan wajah lainnya yang ditampilkan menggunakan pixel
style berwarna hitam. Saya sempat berpikir seandainya ada plugin
Wordpress atau Blogger menggunakan Avatar dari layanan ini pasti seru nih?
tapi gak apa2lah ini sekedar just have fun aja :)



Tuesday, December 2, 2008

WidgetEasy: Pasang Widget Rss Feed Tanpa Registrasi


Sebenarnya ada cara yang lebih instan bila anda hanya
berencana untuk memasang Widget RSS Feed tanpa harus melakukan registrasi
sama sekali. Hanya dengan mengunjungi layanan
WidgetEasy kemudian menyisipkan
alamat feed anda, maka dalam waktu kurang dari satu menit Widget Rss feed
ini siap untuk diaplikasikan ke flatform manapun termasuk Blogger dan Wordpress
tentunya.





Selain mendapatkan code dari WidgetEasy script, keuntungan lainnya, widget feed anda akan tetap ditampilkan dalam urutan daftar, sehingga
pengguna lain dapat juga menggunakannya.




Contoh widgetEasy milik o-om.com:









Bila berkenan, anda dapat
juga memasang Widget Code milik o-om.com
disini


Tuesday, October 28, 2008

PlurkAir: Desktop Client for Plurk

Selama ini saya jarang menemukan layanan aplikasi Plurk Desktop Client,
tidak seperti pesaingnya
Twitter
yang memiliki bejibun aplikasi Desktop siap pakai. Janji Plurk
dengan dukungan API ternyata belum terealisasikan juga. Walaupun aplikasi pihak
ketiga untuk Plurk sangat langka, pengguna Plurk tidak perlu berkecil hati,
karena saat ini sudah ada aplikasi Desktop Client dengan dukungan API tidak
resmi yaitu aplikasi PlurkAir dan Plurkit.



PlurkAir dan Plurkit merupakan aplikasi Desktop Client yang hanya berjalan
jika kita telah menginstall Adobe Air
.
Adobe AIR
memungkinkan aplikasi Adobe AIR runtime (*.Air)  yang akan diaplikasikan
pada perangkat komputer dan dapat berjalan disistem multi platform yaitu Linux,
Mac dan Windows.





Memang PlurkAir dan Plurkit tidak sebagus
Twhirl
(twitter Client)
ya juga sama-sama berjalan dibawah naungan Adobe Air runtime. Namun dengan

antarmuka Plurk mobile desktop, paling tidak pengguna Plurk akan dipermudah dan
lebih nyaman ber-Plurk-ria.




Download Adobe
Runtime
|

Download PlurkAir
|

Download Plurkit



Sunday, October 19, 2008

Pasang Stripe-Ad ala Navbar Blogger

Boost Your Blog's Response Rate With "Stripe Ad"

Menayangkan iklan bergaya Stripe-Ad tentu lebih baik dari pada
menayangkan iklan dalam bentuk Popup Ad (Pop-ups, pop-overs and pop-unders),
Selain dapat menghindari Popup Blocker, memasang Stripe-Ad terasa sangat pas untuk
menampilkan satu focus informasi yang dirasa penting (bisa berupa iklan baris,
pengumuman, Feed atau informasi apa saja sesuai kebutuhan).








Jika anda melihat contoh Stripe-Ad diatas pada blog ini, sekilas
terlihat hampir serupa dengan standar Navigation Bar (Navbar) Blogger.
Pengunjungpun dapat melihat langsung batang navigasi ini ketika pertama kali
mereka mengunjungi halaman blog anda. Iklan ini akan tetap tampil walaupun
pembaca melakukan Mouse Scroll pada halaman. Jika tertarik kemungkinan
besar pembaca akan mengkliknya, jika dirasa mengganggu mereka dapat dengan mudah
menutupnya dengan mengklik tombol X pada pojok kanan atas.




Stripe-Ad tentu saja bukan hal yang baru. Pengguna Wordpress biasanya
menggunakan plugin Strip-Ad buatan

MaxBlogPress
cara installasinya pun terbilang mudah dan sudah ditulis dengan
lengkap caranya, silahkan pelajari sendiri disitusnya ya :)




Cara Pasang Strip-Ad di Blogger:




1. Upload File javascript dibawah ke lokasi penyimpanan file anda, Simpan file dengan nama
Stript-ad.js




var mta_arr = new Array();

var mta_clear = new Array();

function mtaFloat(mta) {

mta_arr[mta_arr.length] = this;

var mtapointer = eval(mta_arr.length-1);

this.pagetop = 0;

this.cmode = (document.compatMode && document.compatMode!="BackCompat") ?
document.documentElement : document.body;

this.mtasrc = document.all? document.all[mta] : document.getElementById(mta);

this.mtasrc.height = this.mtasrc.offsetHeight;

this.mtaheight = this.cmode.clientHeight;

this.mtaoffset = mtaGetOffsetY(mta_arr[mtapointer]);

var mtabar = 'mta_clear['+mtapointer+'] =
setInterval("mtaFloatInit(mta_arr['+mtapointer+'])",1);';

mtabar = mtabar;

eval(mtabar);

}

function mtaGetOffsetY(mta) {

var mtaTotOffset = parseInt(mta.mtasrc.offsetTop);

var parentOffset = mta.mtasrc.offsetParent;

while ( parentOffset != null ) {

mtaTotOffset += parentOffset.offsetTop;

parentOffset = parentOffset.offsetParent;

}

return mtaTotOffset;

}

function mtaFloatInit(mta) {

mta.pagetop = mta.cmode.scrollTop;

mta.mtasrc.style.top = mta.pagetop - mta.mtaoffset + "px";

}

function closeTopAds() {

document.getElementById("mta_bar").style.visibility = "hidden";

}




2. Tuju kehalaman Edit HTML di blogger.




Copi-Paste kode CSS dibawah, letakan diatas kode
]]></b:skin>




#mta_bar { background: #FFFFE1; border-bottom: 1px
solid #808080; margin: 0 0 3px 0; padding: 4px 0; z-index: 100; top: 0; left: 0;
width: 100%; overflow: auto; position: fixed; }

* html #mta_bar{ /*IE6 hack*/

position: absolute; width: expression(document.compatMode=="CSS1Compat"?
document.documentElement.clientWidth+"px" : body.clientWidth+"px"); }

#mta_bar .left { float: left; text-align: center; font-family: Arial; font-size:
13px; font-weight: bold; font-style: normal; color: #0000FF; width:92%;}

#mta_bar .right {font-family: Arial, Helvetica, sans-serif; float: right;
text-align: center; font-weight: normal; font-size: 10px;letter-spacing: 0;
width: 30px; white-space: nowrap;}

#mta_bar .right a {font-size: 10px; color: #0000FF; text-decoration: underline;}

#mta_bar .right a:hover {font-size: 10px; color: #0000FF; text-decoration:
none;}

#left_bar a { text-decoration: none; color: #0000FF; }

#left_bar a:hover { text-decoration: underline; color: #0000FF; }




3. Masukan kode pemanggilan JS dibawah, letakan diatas kode
</head>, jangan lupa
sesuaikan dengan alamat lokasi URL dimana anda meyimpan file JS-nya.


<script src='http://www.alamatserveranda.com/Stripe-Ad.js'
type='text/javascript'/>




4. Letakan kode dibawah ini dibawah kode <body>,
Silahkan sesuaikan setingan dibawah dengan link dan deskripsi anda
sendiri.


<div id='mta_bar'>

<div id='left_bar'><span class='left'><a href='
http://feeds.feedburner.com/ooms-logs'
target='_blank'>
Kurang lebih 3200 pembaca Rss Feed
sudah bergabung, Sudahkah anda?
</a></span></div>

<span class='right' onmouseout='self.status=&apos;&apos;' onmouseover='self.status=&apos;
o-om.com.com&apos;;return
true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;'
src='
http://http://www.alamatserveranda.com/close.gif'
style='cursor:hand;cursor:pointer;'/></span></div>




5. Simpan hasil kerja anda :)




Selamat Mencoba..happy blogging with o-om.com



Saturday, October 11, 2008

Menayangkan iklan bergaya PageEar (PagePeel)

PagePeel atau biasa disebut juga dengan istilah PageEar, Magic Corner, PeelAd,
peel away ad
atau apalah namanya, merupakan salah satu cara lain
menayangkan iklan
dengan gaya (style) yang berbeda. Tidak seperti tampilan
iklan banner pada umumnya, jika anda mengarahkan mouse pada area PagePeel ini,
maka akan terlihat halaman menggulung layaknya anda membuka selembar kertas dan
menemukan halaman lain dilembar sebaliknya. Tujuan utama memasang PagePeel tentu
saja ingin mendapatkan perhatian lebih besar dari pengunjung untuk mengkliknya.









Salah satu contoh blog populer yang menerapkan PagePeel adalah
Johnchow.com. Namun
sangat disayangkan ia sendiri malah menjual layanan PagePeel (peel
away ad
) ini seharga $37.00. Yah bayar..tidak perlu berkecil hati dan jangan
sampai mengeluarkan dana paypal anda untuk membelinya.  Dari semua nama PagePeel yang saya sebut
diatas, terus terang hanya ada satu layanan saja yang berani mengratiskanya,
yaitu

PageEar
.






Meskipun gratis.. PageEar tidak kalah dengan versi PagePeel berbayar,
salah satu fitur unggulannya yaitu kemampuan PageEar untuk menjalankan gambar dan suara sekaligus. Karena PageEar dijalankan via Flash dan JavaScript based, jadi anda dapat menggunakannya pada platform (blog/site) apa saja, termasuk blogger dong
tentunya :)




Beberapa Fitur menarik dari PageEar:



  • NEW! Pageear is scalable now. You can change the peel
    size 100×100 and 500×500 Pixel by your own.   

  • Plays MP3-Files on startup, open and close of Pagepeel.

  • Possibility to leave peel open and wait for userklick to close. Close text
    is editable.  

  • Place it on the left or right upper corner

  • Open and close automaticly after X seconds

  • Speed of the small pageear could be changed

  • Flashcheck (Adobe© Flash Detection)

  • Reflecting image on corner

  • Color of the pagecorner

  • Link target on external side or own (self, new)

  • Downwardcompatibly up to Flashversion 6

  • Runs on nearly all Browser (FireFox, InternetExplorer, Opera, Safari,
    etc.)






Tutorial Cara Pasang (Installasi):




1. Download dulu file

PageEar v1.4




2. Kemudian Extrack file pageear_v14.zip di
folder anda.




3. Silahkan Edit File pageear.js (menggunakan
notepad misalkan)




Note: dalam file
pageear.js
inilah semua konfigurasi yang anda perlukan. Agar anda tidak
pusing tujuh keliling, saya sertakan saja contoh dari beberapa kemungkinan yang perlu anda edit. Lihat code yang diedit dengan warna merah.






var pagearSmallImg = 'http://alamat-server-anda.com/pageear_s.jpg';




var pagearSmallSwf = 'http://alamat-server-anda.com/pageear_s.swf';




var pagearBigImg = 'http://alamat-server-anda.com/pageear_b.jpg';




var pagearBigSwf = 'http://alamat-server-anda.com/pageear_b.swf';




var jumpTo = 'http://alamatbloganda.com/'




Sebenarnya masih banyak configurasi yang lain, selebihnya dibaca saja ya pada
manualnya.




4. Upload semua file yang ada dalam folder pageear_v14/pageear/ ke
server milik anda (pages.google.com
misalkan)




5. Langkah akhir lakukan pemanggilan javascript, atau dari pada puyeng
langsung copy paste aja kode dibawah ini. jangan lupa mengganti alamat url
dibawah ditandai dengan warna merah dibawah.




<script language='javascript' src='http://alamat-server-anda.com/AC_OETags.js'/>


<script src='http://alamat-server-anda.com/pageear.js'
type='text/javascript'/>


<script type='text/javascript'>

writeObjects();

</script>




Untuk pengguna blogger silahkan meletakan script diatas di bawah kode
<title><data:blog.pageTitle/></title> pada halaman
Edit HTML.






Bagaimana mengubah image sesuai keinginan anda?




Pertama buat image dengan ukuran 100x100 pixel, lalu simpan dengan nama
pageear_s.jpg kemudian dengan cara yang sama, buat
lagi image dengan ukuran 500x500 pixel, lalu simpan dengan nama
pageear_b.jpg Jika anda sudah membuat kedua image
diatas, silahkan upload kembali ke server milik anda.




Selamat Mencoba..happy blogging with o-om.com