Trik Komputer

Kamis, 20 Januari 2011

Cek Google Update for Your Pagerank

Bisa menjadi berita buruk dan baik jika embah google sudah mengeluarkan update PageRank bagi sebuah web/blog. Alhamdulillah naik nih blognya Beben si bloglang anu ganteng kalem tea euy :x yang Prodigy of Head ini sob ;;) Walau beratnya gak edan eling juga ternyata bisa naik juga blog si jagur :)) Berikut report dari !

Web Page URL: http://beben-koben.blogspot.com

The Page Rank:

- 4/10

(the page rank value is 4 from 10 possible points)

Web Page URL: http://ben-tools.blogspot.com

The Page Rank:

- 2/10

(the page rank value is 2 from 10 possible points)

Sok sana dicek yang punya sobat-sobat, semoga naik juga yah :) Salam si bloglang Beben ganteng tea :P \m/

PlugChat jQuery Plugin

Hihihi BW ketemu ada yang unik dan gaya, langsung deh cari sumbernya. Fasilitas yg diberikan mungkin baru chat room dan search (bagi free account). Kalau Olark khusus chat saja kan. Didukung dengan 25 theme yg bisa diganti sesuai selera ditempat itu juga sob b-) Dapat dengan mudah diintegrasikan dengan, facebook situs kita twitter pengguna, dan lain-lain. Juga memiliki beberapa aplikasi (plugin) yang dapat ditambahkan di bar itu sendiri, menjadi toolbar untuk menambah nilai situs anda. Semua ini dalam User Interface kuat (UI) dengan jendela yang dapat diposisikan, diubah ukurannya, diminimalkan seolah-olah kita sudah dalam sistem operasi.

Untuk free account caranya cukup mudah saja sob, kita hanya tinggal mencomot scriptnya dan tinggal letakan diatas tag </body>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">var plugChatInTheme = "plugchatin";</script>
<script type="text/javascript" src="http://static.plugchat.in/js/plugchatin-en.min.js"></script>

Untuk script tulisannya berbeda warna, jangan dipasang lagi memang sudah punya ;) Tinggal masukin deh script yg 2 itunya saja (warna merah).

Yang jadi pertanyaan, kalau semua blogger pasang macam gini dimana kita nongkrongnya!!! Mau buat satu room khusus untuk kita para blogger buat nongkrong-nongkrong gitoooh :-/ Begitu saja pemberitahuan Beben si bloglang anu ganteng kalem tea mengenai PlugChat jQuery Plugin :-bd See you bai...bai :-h

Rabu, 19 Januari 2011

Blogger Reading List Ready to Use

Blogger Reading List (Note:Kami secara perlahan menambahkan fitur ini untuk semua pengguna, beberapa fungsi mungkin tidak tersedia untuk semua pengguna tapi segera akan diperbaiki) Dengan Blogger Reading List, kita dapat membaca semua posting terbaru dari blog favorit kita tepat di Dashboard Blogger kita! Blogger Reading List, terletak di bawah daftar blog pada dashboard, memungkinkan kita untuk berlangganan blog dengan feed. Ini akan update langsung setiap kali posting baru diterbitkan pada setiap blog dalam Reading List kita. Selain itu, kita dapat memeriksa posting terbaru kami melalui Blogger Buzz dari tab "Blogger Buzz", dan Blog terbaru catatan dari "Blogs of Note" tab.

Beben si bloglang anu ganteng kalem tea juga kurang ngeuh dalam perbedaan reading list ini dengan follow yg tersedia dari friendconnect itu. Soalnya gak pernah follow juga sih :D Tapi satu hal, dengan fasilitas satu ini kita tidak akan ketinggalan mengikuti update dari blog yg kita ikuti sob. Pokokna top markotop, full stylish, dinamis dan melankolis ;)) Mungkin jika baru login dan menemukan feature ini akan ada tulisan pemberitahuannya pada dashboard sobat. Kalau belom dan tidak ada, tunggu saja dan berdo'a. Dengan begini tidak usah capek-capek meminta follow, dan followlah blog dengan bijak karena memang tertarik dengan konten dan isinya bukan karena embel-embel apapun juga :) blogger help. Sekian dan terima kasih...salam bloglang blogger full style b-) \m/

Facebook Skins FBskins.com

Setelah mengumpulkan artikel mengenai baik itu tut atau hanya info saja, mungkin web dan blog berikut ini yang dapat mewakili dalam menghiasi facebook sobat-sobat :) adalah bagian dari network saja dari situs skin agar terlihat berbeda, memberikan kita akses ke lebih dari 50.000 skin facebook!
Ribuan skins gratis.
FBSkins menawarkan gaya yang berbeda, warna, dan tema. Gunakan profil kita untuk memamerkan berbagai kulit dengan tema Musik, Selebriti, Film, TV, Cute, Cinta, dan begitu banyak lagi. Tidak ada harus menyalin dan menyisipkan kode apapun. Setelah plug-in diinstal, pilih kulit dan plug-in akan memuat karya seni kita. Proses instalasi memakan waktu kurang dari satu menit dan bekerja dengan semua browser.
*Update: Skin sekarang kompatibel dengan browser SEMUA termasuk Firefox, Internet Explorer, Google Chrome dan Safari!
Skins buatan Sendiri (customize)
Apakah kita dapat membuat pernyataan tentang siapa kita, dan apa yang kita suka, merancang tata letak kita sendiri! Mengapa tidak membuat skin untuk grup kita atau organisasi. Builder FBSkins memungkinkan kita untuk meng-upload gambar atau foto pilihan kita. Gambar ini sekarang akan menjadi bagian dari profil Facebook kita. Kita sekarang seorang desainer dan dapat menyesuaikan FBSkin kita sesuai dengan keinginan.
*Update: Kita kini dapat membuat edit sendiri agar skin, warna, tabel dll tampak edan punya dan full stylish!

More Features for your Facebook...

FBskins

Semakin dikembangkan dengan hadirnya dislike button for FB b-)

You must first install the plugin. Click here to get yours today!

Silahkan kunjungi dan acak-acak web dan blognya guna mendapatkan cara dan tutorialnya yak \m/

Selasa, 18 Januari 2011

Widget in Tab Menu Wordpress Style

Kabar hangat dari mybloggertricks, blogger satu ini mengeluarkan trik bagaimana cara membuat Wordpress Tab Menu Style Widget. Blog yg membikin emotikon versi untuk komentar di blogspot itu loh ;;) Keunikan dari tab karya @mybloggertricks ini yaitu, tab ini akan menghasilkan dimana nanti kita ketika melakukan Add a Gadget sudah ada didalam tab tersebut :-/ Mengirit tempat, full stylish, dan tentu gaya punya b-) Untuk mengambil bahan-bahannya silahkan sobat baca disana saja . Hal yg perlu diperhatikan oleh sobat² sekalian jika ingin menggunakan trick ini yaitu:

Backup full your template.
Terintegrasi dengan jQuery Plugin.
Mulai misinya...wekekekekkk.

Pada template carilah kode <div id='sidebar-wrapper'> dan catat/ingat jenis widget apa saja yg sobat add disana. Ini penting dilakukan karena nantinya pasti kita akan melakukan perpindahan isi widget (jika perlu juga sih) :P Contohnya seperti ini:<b:widget id='LinkList1' locked='false' title='Your Title I' type='LinkList'/><b:widget id='HTML2' locked='false' title='Your Title II' type='HTML'/><b:widget id='Profile1' locked='false' title='Your Title III' type='Profile'/>Perhatikan tulisan kode yg dibedakan warnanya itu, nah itu yg harus sobat catat dan dingat-ingat ;)

Kode CSS

/*--- Wordpress Style MBT Menu Tabs ---*/
.MBT-tabs {
list-style:none;
list-style-type:none;
margin:0 0 10px 0;
padding:0;
height:26px
}
.MBT-tabs li {
list-style:none;
list-style-type:none;
margin:0 0 0 4px;
padding:0;
float: left
}
.MBT-tabs li:first-child {
margin:0
}
.MBT-tabs li a {
color:#fff;
background:#333333;
padding:5px 5px;
display:block;
text-decoration:none;
font:bold 12px Arial,Helvetica,Sans-serif;
}
.MBT-tabs li a:hover,.MBT-tabs li a.MBT-tabs-current {
background:#A46F38;
color:#fff;
text-decoration:none
}
.MBT-tabs-content {
background:#212121
}
.MBT-tabviewsection {
margin-top:10px;
margin-bottom:10px;
}

KOde HTML dan jQuery script

Letakan persis dibawah kode
<div id='sidebar-wrapper'>
Jika tidak menemukannya mungkin dikarenakan perbedaaan ID, yg penting tag div pada sidebar template sobat dah :D

<div class='MBT-tabviewsection'>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function($){
$(".MBT-tabs-content-widget-MBT-id").hide();
$("ul.MBT-tabs-widget-MBT-id li:first a").addClass("MBT-tabs-current").show();
$(".MBT-tabs-content-widget-MBT-id:first").show();
$("ul.MBT-tabs-widget-MBT-id li a").click(function() {
$("ul.MBT-tabs-widget-MBT-id li a").removeClass("MBT-tabs-current a");
$(this).addClass("MBT-tabs-current");
$(".MBT-tabs-content-widget-MBT-id").hide();
var activeTab = $(this).attr("href");
$(activeTab).fadeIn();
return false;
});
});
//]]>
</script>

<ul class='MBT-tabs MBT-tabs-widget-MBT-id'>
<li><a href='#widget-MBT-id1'>Subscribe</a></li>
<li><a href='#widget-MBT-id2'>Latest Tricks</a></li>
<li><a href='#widget-MBT-id3'>Search</a></li>
</ul>

<div class='MBT-tabs-content MBT-tabs-content-widget-MBT-id' id='widget-MBT-id1'>
<b:section class='sidebar' id='sidebar1' preferred='yes'>
</b:section>
</div>
<div style='clear:both;'/>

<div class='MBT-tabs-content MBT-tabs-content-widget-MBT-id' id='widget-MBT-id2'>
<b:section class='sidebar' id='sidebar2' preferred='yes'>
</b:section>
</div>
<div style='clear:both;'/>

<div class='MBT-tabs-content MBT-tabs-content-widget-MBT-id' id='widget-MBT-id3'>
<b:section class='sidebar' id='sidebar3' preferred='yes'>
</b:section>
</div>
</div>
<div style='clear:both;'/>

Save

Setelah itu tengok deh ke bagian Page Elements template, dan lihatlah disana sudah terpasang Add a Gadget terintegrasi dengan tab yg tadi dibuat. Isikanlah dengan widget sobat yg tadi Beben si bloglang anu ganteng kalem tea suruh simpan/ingat :)
Wiss ah permios,demo bisa dilihat di dummies blog Beben atau temennya Master Mohammad Mustafa Ahmedzai ;)

Be a Creative II

Kotak komentar yang tidak terbuka secara benar akan mengurungkan niat si pembaca untuk berkomentar!!! Berikut screenshot embed komentar pada blogspot yg jelek mutunya :D

Sebenarnya mudah saja jika ingin memperbaiki masalah tersebut. Tapi nanti dulu, disini Beben si bloglang anu ganteng kalem tea bukan hanya mau berbagi cara membenarkan embed form comment blogspot tapi mau berbagi juga form action untuk berkomentar ;) Silahkan kunjungi blog tools gaya punya ini untuk melihat aksi kerjanya . Disana ada artikel cara memperbaiki dan aksi dari form action get comments blogspot posted.

Sering kali para blogger termasuk Beben, bolak balik ke web w3school untuk melakukan search kode bagaimana untuk bisa jadi begini. Terilhami dari situ maka disini Beben juga akan berbagi form action search (mau disimpan dalam blog juga boleh) agar kita tidak repot saat akan melakukan pencarian kode yg kita inginkan. Hasil bentuk akan seperti ini

Kode HTML

Masukin semua kode via Add a Gadget ► HTML/Javascript

Please becareful if you want to edit that coded :) Untuk kode HTML aksi berkomentar melalui Post ID dan Blog ID bisa sobat ambil juga, tapi tolong jangan dihilangkan link sang penciptanya yak :))

Kode HTML Form Komentar

<div style="display:block;width:205px;text-align:center;padding:15px 1px 5px;cursor:help;border:1px solid #555;-moz-border-radius:10px;border-radius:10px;background:#debe94;color:#111"><form action="http://www.blogger.com/comment.g" method="get" target="top"><label for="blogid">Your <a href="http://www.google.com/support/blogger/bin/search.py?ctx=en%3Asearchbox&query=blog+ID" target="top">Blog ID</a>:</label><br><input size="25" name="blogID" id="blogid" type="text"><br><label for="postid">The <a href="http://www.google.com/support/blogger/bin/search.py?ctx=en%3Asearchbox&query=Post+ID" target="top">Post ID</a>:</label><br><input size="25" name="postID" id="postid" type="text"><p style="font-size:10px;">[ <a href="http://beben-koben.blogspot.com">Prodigy of Head</a> ]</p><input value="Post Comment" type="submit"> <input value="Clear!" type="reset"></form></div>

Sekian dan terima kasih, ingat halaman ini akan terus Beben Update seperti halaman² lainnya jika menemukan tema sejenis.

Kunjungi dummies blog saya http://embah-google.blogspot.com disana sudah saya sediakan source artikel dengan keyword yg sudah saya pilih dengan ditetapkan tanggal mentok sampe ujung tahun supaya berada pada awal postingan (dari sana sobat dapat pelajaran macam blog mana yg cepat terindeks lewat blogsearch.blogspot.com) Mau itu jenis templatenya, jenis gaya bahasa, jenis blablabla lainnya dan tools pilihan di http://ben-tools.blogspot.com Khusus artikel di dummies blog akan selalu update jika memang ada blogger memosting, soalnya itu langsung dari blogsearch.blogspot.com. Semua demi kemajuan blogger INDONESIA RAYA!!!

Lanjutan dari ini saja ah kasih judul postingannya :D
Other's
http://www.google-type.com/

Senin, 17 Januari 2011

Display QR Codes With jQuery Plugin

Mungkin sudah tidak asing dimata kita, ketika kita melihat sebuah tooltip pada link berupa title dan gaya CSS-nya. Secara default pada browsingan jika sobat memasang sebuah syntax link disertai atribute title, maka akan ada tulisan titlenya tersebut diatas cursor kita :) Yaaa masa kagak tau sih apa itu tooltip? Coba saja disetiap link yg ada di blog Prodigy of Head ini sobat² sorot! Pasti sudah pada mengerti yak apa itu tooltip :) Bagaimana sekarang jika sebuah syntax ketika disorot yang munculnya adalah QR Code :-? Sedikit penjelasan mengenai ... Mungkin bagi yg kurang familiar dengan QR Code ini, bertanya-tanya buat apa memasang tooltip pada syntax. Memang gunanya bukan untuk digunakan di komputer sob, melainkan untuk membuka link pada ponsel, kamera, video atau alat yg memang mendukung untuk fasilitas ini :D Tentunya full stylish, gaya dan unik kan :)) b-) Santer diluaran sana android, nah dengan dukungan Chrome Browse fasilitas ini sangat membantu dan mendukung :) Expand here for look screenshot

qrTip jQuery Plugin

jQuery Script Plugin

Hostingkan script yg panjang (yang bukan warna merah itu) kalau perlu, dan letakan keseluruhan jQuery script tersebut diatas tag </body>

Kode CSS

.colorTip{
/* This class is assigned to the color tip span by jQuery */
display:none;
position:absolute;
left:50%;
top:-30px;
padding:6px;
background-color:white;
font-family:Arial,Helvetica,sans-serif;
font-size:11px;
font-style:normal;
line-height:1;
text-decoration:none;
text-align:center;
text-shadow:0 0 1px white;
white-space:nowrap;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
}
.pointyTip,.pointyTipShadow{
/* Setting a thick transparent border on a 0x0 div to create a triangle */
border:6px solid transparent;
bottom:-12px;
height:0;
left:50%;
margin-left:-6px;
position:absolute;
width:0;
}
.pointyTipShadow{
/* The shadow tip is 1px larger, so it acts as a border to the tip */
border-width:7px;
bottom:-14px;
margin-left:-7px;
}
.colorTipContainer{
position:relative;
text-decoration:none !important;
}
.colorTip img {
padding: 5px;
background: white;
}
.black .pointyTip{ border-top-color:#333;}
.black .pointyTipShadow{ border-top-color:#111;}
.black .colorTip{
background-color:#333;
border:1px solid #111;
color:#fcfcfc;
text-shadow:none;
}

Masukan diatas kode ]]></b:skin> Dengan begitu tanpa menuliskan embel-embel apapun pada syntax link, sobat sudah mempunyai tooltip QR Code. Tetapi jika variasi warna dinilai kurang maknyusss, sobat bisa menambahkan kode CSS berikut dan masukan sama persis dengan cara diatas tadi!

.white .pointyTip{ border-top-color:white;}
.white .pointyTipShadow{ border-top-color:#ddd;}
.white .colorTip{
 background-color:white;
 border:1px solid #DDDDDD;
 color:#555555;
}
.yellow .pointyTip{ border-top-color:#f9f2ba;}
.yellow .pointyTipShadow{ border-top-color:#e9d315;}
.yellow .colorTip{
 background-color:#f9f2ba;
 border:1px solid #e9d315;
 color:#5b5316;
}
.blue .pointyTip{ border-top-color:#d9f1fb;}
.blue .pointyTipShadow{ border-top-color:#7fcdee;}
.blue .colorTip{
 background-color:#d9f1fb;
 border:1px solid #7fcdee;
 color:#1b475a;
}
.green .pointyTip{ border-top-color:#f2fdf1;}
.green .pointyTipShadow{ border-top-color:#b6e184;}
.green .colorTip{
 background-color:#f2fdf1;
 border:1px solid #b6e184;
 color:#558221;
}
.red .pointyTip{ border-top-color:#bb3b1d;}
.red .pointyTipShadow{ border-top-color:#8f2a0f;}
.red .colorTip{
 background-color:#bb3b1d;
 border:1px solid #8f2a0f;
 color:#fcfcfc;
 text-shadow:none;
}

Punya deh 6 gaya variasi :-" Cara penulisan syntax untuk warna berbeda ini sedikit menambahkan atribut saja.

<a href="http://blah-bleh-bloh.com/" title="" class="WHITE/GREEN/BLUE/RED/YELLOW">your title</a>

Pilih satu atribut class yg akan dipakai (jangan semua ditulis macam itu) :))

Harap diperhatikan dan dipertimbangkan jika ingin memakai trik ini. Semua atribut title akan berubah menjadi QR Code.

Resource by: <?
Happy blogging \m/