Minggu, 24 Januari 2010

TRANSLATE THIS BUTTON

Mumpung masih mau mosting...hihihihi. Masih bersangkut paut dengan translate penuh gaya untuk blog kita tersayang. Halah tersayang kayak pacar saja nih...hihihihi. Sebelumnya BeBeN si ganteng kalem pernah memosting tentang Translate dengan bergaya roll. Sekarang mah menggunakan jasa web nih sobat blogger. Lumayan free-free juga...kekekekekkk!!! Prosesnya juga gampang, semudah membalikkan telapak tangan. Tapi tangan genderuwo wekekekekkkk. Begini cara mendapatkan layanan translator ini.

<!-- Begin TranslateThis Button -->

<div id="translate-this"><a href="http://translateth.is/" class="translate-this-button">Translate</a></div>

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://x.translateth.is/translate-this.js"></script>
<script type="text/javascript">
TranslateThis();
</script>

<!-- End TranslateThis Button -->

Sikat deh tuh scriptnya ke dalam blog sobat. Seperti tradisi kita, pilih saja Add a Gadget pilih deh yang berjenis HTML/Javascript. Bagaimana...mudah kan!!! Kalau sobat mau meletakkannya sesuka hati yaaa...silahkan bereksperimen ria dengan template sobat sendiri. Yang penting GAYA...dan STYLISH.

Kalau kurang jelas dan ada apa-apa, silahkan kunjungi web yang punya proyeknya. Translate Powered By : TranslateThis Button.
Selamat berjumpa kembali, di acara bloglang selanjutnya.

Sabtu, 23 Januari 2010

TRANSLATE ROLL

Pusing pembukaannya nih...bl3ng kel4pa. Begini aja, tau dong dengan feature Form dalam bahasa HTML atau web...kekekekekkk. Pokoknya itu lah, ngerti sukur enggak juga pahami saja...hehehehe ~_~' Kalau dikasih contoh pasti mengerti. Check this one for a Form.

Yang seperti itu tuh form tuh sobat ^,^. Nah bengong malas kesana kemari, bermain-main deh dengan HTML editor. Bagaimana jadinya fungsi Form ini bisa dipakai untuk menterjemahkan sebuah Blog. Bakalan menarik nih!!!

Tuh contohnya keren banget kan ^.^ Nah silahkan kalau mau, ini kodenya. Pakai blockquote ah nulisnya. Biar kelihatan gaya gito LOH!!!

<form action="http://translate.google.com/translate"><input name="u" id="url" value="http://URL-YOUR-BLOG.blogspot.com/index.html" type="hidden"><select name="tl" style="background-color: rgb(255, 1, 1);"><option value="ar">Arabic</option><option value="sq">Albanian</option><option value="nl">Belanda</option><option value="bg">Bulgarian</option><option value="zh-CN">Chinese</option><option value="zh-TW">china(tradition)</option><option value="cs">Ceko</option><option value="ca">Catalan</option><option value="hr">Croatian</option><option value="da">Danish</option><option value="en">English</option><option value="de">German</option><option value="ja">Japan</option><option value="fr">French</option><option value="iw">Hebrew</option><option value="hi">Hindi</option><option value="hu">Hungarian</option><option value="id" selected="selected">Indonesia Raya</option><option value="et">Estonian</option><option value="it">Italian</option><option value="ko">Korea</option><option value="lv">Latvian</option><option value="lt">Lithuanian</option><option value="no">Nirwegia</option><option value="gl">Galician</option><option value="mk">Macedonian</option><option value="mt">Maltese</option><option value="pl">Polish</option><option value="pt">Portugis</option><option value="tl">Filipino</option><option value="ro">Romanian</option><option value="ru">Rusian</option><option value="sr">Serbian</option><option value="fi">Somolia</option><option value="sk">Slopak</option><option value="sw">Swahili</option><option value="su">Swedia</option><option value="es">Spanyol</option><option value="sl">Slovenian</option><option value="tr">Turki</option><option value="Thai</option><option value="uk">Ukraina</option><option value="vi">Vietnam</option><option value="cy">Welsh</option><option value="yi">Yiddish</option><option value="el">Yunani</option></select><input name="sl" value="en" type="hidden"><input name="hl" value="en" type="hidden"><input name="ie" value="GSO-8859-1" type="hidden"></><input value="Pilih Bahasa" style="background: rgb(255, 255, 255)" type="submit"></form>
Sok tuh diambil kode-kodenya. Masukkan saja via Add a Gadget pilih yang HTML/Javascript...LoL. Ganti tulisan yang berwarna biru dengan alamat blog sobat. Prikitiiiwww...!!! Kalau mau kelihatan tidak berantakan dengan kode-kodenya, sobat bisa mengakalinya dengan menjadikan kode-kode tersebut menjadi sebuah file berupa javascript.

Tulis kembali kode-kode diatas tadi menjadi seperti ini :

<!--
document.write('ISIKAN KODE-KODENYA DISINI');
//-->

Setelah itu save di notepad dengan nama bahasa.js, language.js, atau beben.js juga bisa. Yang penting berekstensionkan .JS filenya. Setelah disave dengan nama yang diinginkan sobat, lalu dihosting deh filenya tadi. Kalau sudah dihosting, tinggal memanggil file tersebut dengan gaya javascript.

<script src='http://URL-HOSTINGAN/FILE.js' type='text/javascript'></script>

Maka akan terlihat hasilnya sama dengan translate roll yang seperti di atas. Wong namanya juga supaya tidak kelihatan berantakan...wkwkwkwkwwkkkk.

GOOD LUCK HAPPY BLOGGING.

Jumat, 22 Januari 2010

MY BLOGGER TRICK

Huiii...ehem-ehem...prikitiiiiwww!!! Bloglang is BACK. Biasa kembali dari berpetualang di dunia ayam kekekekekkk. Now its about a great web long long there in Pakistan. He's Mohammad Mustafa Ahmedzai owner My Blogger Trick. Sepenggal kalimat yang selalu tertera di akhir postingan dia.
As a 20 year old student, the only income I rely on is my pocket money. Bearing the running costs of MBT Blog has become really difficult. We educate thousands of bloggers a week with our tutorials. To help us go forward with the same spirit, a small contribution from your side will highly be appreciated.
HiHiHi...bahasa kumpeni!!! Tutorial dasar untuk para blogger dan bergaya-gaya dengan blognya. Seperti BeBeN yang penuh dengan gaya juga toh...wkwkwkwkwkwk. Pokoknya maknyus-maknyus artikel dari dia. Nih aku kasih linknya menuju semua trik yang dia punya Tricks from Blogger Trick. Unique

Komentarnya sok silahkeun diisi yah...kekekekkk.

WASSALAMU'ALAIKUM WARAHMATULLAHI WA BARAKATUH ^_^

Kamis, 21 Januari 2010

MODERN BLOCKQUOTE STYLE

HiHiHiHi...ketemu agih nich ma akyu..khu khu khu. Apa tuh yang dimaksud dengan blockquote!!! Tulisan yang sedikit menjorok dari paragraph utama dari sebuah postingan/artikel. Nah Blockquote ini sendiri bisa diberikan sedikit gaya dengan bantuan sedikit sentuhan edit-edit CSS. Contoh blockquote yang ada di BeBeN seperti ini :
Aenean tincidunt, justo sodales tempus venenatis, diam neque cursus dolor, vel pretium nisi eros eu eros. Curabitur porttitor hendrerit ullamcorper. Beben mesum sum item tem.
Tuh kan menjorok sedikit ke dalam dan ada stylishnya kan??? Yaaa untuk menekankan sebuah kalimat mutiara, pesan, tanda atau kata-kata yang dianggap oleh sobat bermanfaat. Lumayan nih ada 8 buah gayanya hasil karya Fun with blogger.

#blockquote1 {
background: #f5f5f5;
border-left: 0.8em solid #ccc;
border-right: 0.8em solid #ccc;
font: italic 105% Georgia, "Times New Roman", Times, serif;
padding: 0.75em;
}
Hasilnya :

#blockquote3 {
font: 12px/18px normal "Courier New", sans-serif;
padding-left: 60px;
padding-top: 5px;
padding-bottom: 5px;
background-color: #000;
color: white;
border-top: 1px solid #ccc;
margin: 1px;
background-image: url(http://i48.tinypic.com/2hnxcmo.jpg);
background-position: middle left;
background-repeat: no-repeat;
line-height: 1.5em;
}
Hasil :

#blockquote2 {
font: 14px/22px normal helvetica, sans-serif;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 30px;
padding-left: 15px;
border-left: 3px solid #ccc;
}

Hasil :

#blockquote4 {
width: 30em;
background: url(http://i49.tinypic.com/23tmpmh.jpg) top left no-repeat;
color: #030;
font-size: 1.1em;
line-height: 0.9;
font-style: italic;
padding: 0.5em;
margin: 0;
}

Hasil :

#blockquote5 {
background: #ffffcc;
border: 5px double gold;
border-width: 5px 0;
color: #CC6600;
font: bold 105% Arial, Helvetica, sans-serif;
padding: 0.5em 0.75em;
text-align: left;
}

Hasil :

#blockquote6 {
display:block;
font-family:Courier New,arial,tahoma;
font-size:9pt;
overflow:auto;
margin:5px 10px;
padding: 2px 15px 2px 25px;
background:url(http://i50.tinypic.com/raomxl.jpg) left top;
background-repeat:repeat-y;
}

Hasil :

blockquote {
margin : 0 20px;
padding: 10px 10px 10px 20px;
background : #9FCFFF;
font: bold .9em "comic sans ms", arial, Helvetica,verdana, Georgia;
color : #484848;
border: 5px dashed #fff;
}

Hasil :

blockquote {
background: rgb(0, 0, 0) none repeat scroll 0% 0%;
color: lightgreen;
padding: 5px 10px;
}

Hasilnya ah :Mungkin dengan sedikit sentuhan kreatifitas sobat bisa lebih memperindah blockquotenya ^,^. Nah hal yang perlu diperhatikan disini bagaimana caranya menggunakan trik ini di dalam sewaktu memosting.

Perhatikan kode-kode #blockquote1, #blockquote2, #blockquote3, #blockquote4, #blockquote5, #blockquote6 didepannya terdapat tanda "#". Apabila ketika memostingnya menggunakan perintah...

<div id="blockquoteX">KETIKKAN KATA-KATANYA DISINI</div>

Kalau memakai trik ini tidak akan mengganggu blockquote yang memang sudah ada, kalau sobat sudah ada trik blockquote. (Paling jadi ada 2 gaya...xixixi) Kalau kode yang blockquote saja, penulisannya dalam memosting seperti berikut :

<blockquote>KETIKKAN KATA-KATANYA DISINI</blockquote>

Kalau sobat sudah ada trik ini, harap diganti kodenya seperti yang diatas entuh ^.^. Kalau tidak, bisa bentrok deh...kekekekekkk.

Adios amigos permios...see you next time. Good luck yaw!!!

Rabu, 20 Januari 2010

SO MILD, USEFULLY

Ringan tapi bermanfaat, so nice nice deh ah. Biasa lagi ngebloglang gak ada kerjaan melongoin blog master. Dikarenakan bahasa kumpeni, eh ngeuhnya pas praktek. Sobat mungkin sudah tidak asing lagi fasilitas yang diberikan oleh RSS atau Feedburner. Nah disini BeBeN sang bloglang hasil dari melongonya.

Lansung saja pada prakteknya. Coba klik link berikut Posts Via Feeds, maka akan terpampang halaman postingan kita via FeedBurner. Adapun penulisan link default dari FeedBurner sebagai berikut :

<a href='http://NAME-YOUR-BLOG.blogspot.com/feeds/posts/default?orderby=published' target='_blank'>Posts Via Feeds</a>

Nah coba sekarang coba klik link yang ini Posts Via Feeds2. Bagaimana...ngeuh tidak apa perbedaannya. Adapun penulisan untuk link yang seperti ini yaitu...

<a href='http://www2.blogger.com/feeds/YOURBLOG-ID/posts/default?orderby=published' target='_blank'>YOUR TITLE</a>

Ganti deh YOURBLOG-ID dengan ID sobat. Kalau pas memosting lihat di address bar paling ujung, nah entuh ID. Pasti ada yang bertanya-tanya apa fungsinya!!! Pikir ajah olangan apa fungsinya posts via RSS tuh...wkwkwkwkwkkkk.

Bagi yang membutuhkan animasi dalam mebuat banner atau apapun, silahkan mencoba jasa web yang satu ini Create a GIF. Nih satu lagi hasil dari melongo, untuk berping ria. Autopinger. Source trick posts via RSS by : phydeaux3. Semoga bermanfaat ^_^'

CORNER JS

picCornerBack to bloglang no get nothing-nothing...kekekekek!!! Terpaksa memosting tentang nyekrip deh. Bagi yang suka bergaya-gaya dengan penampilan blognya. Mari simak kemari bagaimana membuat corner atau sudut pada gambar dengan menggunakan corner javascript. Untuk melihat aksinya silahkan klik link ini Live Demo. So seksi dan begitu elegan hehehehe.

License permits free of charge use on non-commercial and private web sites only under special conditions (as described in the license). Please read Netzgestade Non-commercial Software License Agreement. Support to Mozilla Firefox 1.5+, Opera 9+, Safari and IE6+. Yuk kita proses, halaaaahhh proses!!!

  1. Log in terlebih dahulu ke account sobat.
  2. Masuk pada halaman Edit HTML.
  3. Masukkan script berikut diatas/sebelum tag </body>.
  4. Ini scriptnya, harap di download dolo Scriptnya.
  5. Entar nulisnya jadi begini kawan setelah kita menghosting script yang di download tadi.
    <script type="text/javascript" src="CORNER.JS"></script> .
  6. SAVE deh.
Nah sekarang caranya menghadirkan trik corner ini bagaimana bisa berfungsi di dalam postingan kita. Sebelumnya mari kita lihat screen shoot berikut.

Nah disana ada 12 gambar berikut dengan efek yang bisa dihasilkan dengan menggunakan corner.js ini. BeBeN kasih contohnya yang dari blog saja yah ^,^. Kalau kita sudah beres meng-upload sebuah gambar dari blog ini akan didapatkan kode seperti berikut :

<img style="cursor:pointer; cursor:hand;width: 320px; height: 256px;" src="http://1.bp.blogspot.com/LINK-URL-GAMBAR.png" border="0" alt=""id="BLOGGER_PHOTO_ID_12345678901234" />

Nah kita tinggal menambahkan class saja pada kode gambar tersebut.

<img style="cursor:pointer; cursor:hand;width: 320px; height: 256px;" class="KODE-YG-MAU-DIPAKAINYA" src="http://1.bp.blogspot.com/LINK-URL-GAMBAR.png" border="0" alt=""id="BLOGGER_PHOTO_ID_12345678901234" />

Apa saja KODE-YG-MAU-DIPAKAINYA itu, berikut kode-kode yang bisa sobat pakai (urut nomor yang terdapat pada screen shoot diatas tadi):

  1. class="corner"
  2. class="corner ishade50"
  3. class="corner ishadow20"
  4. class="corner ishade50 ishadow20"
  5. class="corner ishadow40 inverse"
  6. class="corner iradius16"
  7. class="corner iradius24 ishadow33 inverse"
  8. class="corner iradius20 ishadow33"
  9. class="corner iradius8 ishade75 ishadow33"
  10. class="corner iradius16 ishade66 ishadow30"
  11. class="corner iradius32 ishade50 ishadow25"
  12. class="corner iradius48 ishade33"
  13. 12 kode yang terdapat pada screen shot.
  14. class="corner iradius12 ishade50 ishadow20"
  15. class="corner iradius10 ishade66 ishadow25"
  16. class="corner iradius8 ishade75 ishadow30"
  17. class="corners iradius32"
  18. class="corners iborder1 icolorffffff"
Ah capek ah, dah lah sok dicoba triknya sobat.

GOOD LUCK AND SEE YOU AGAIN WITH ME IS BLOGLANG.

Selasa, 19 Januari 2010

RECENT POST WITH JSON SCRIPT

Huy...prikitiw, BeBeN nih balik lagi!!! Biasa kembali dari ngebloglang nih. Tutorial standar nih, mengenai Recent post. Memang dari bloggernya sudah ada sih add a gadgetnya bikinan Blogger Buster. Kita tinggal masuk ke halaman Page Elements, Add a Gadget, lihat ke sebelah kiri cari yang bertuliskan More Gadgets, add deh Recent Posts jadi deh kita punya recent post di blog kita. Nah kalau mau alternatif lain mengenai recent post atau artikel ini bisa saja kok. Seperti pepatah kuno bilang "masih banyak jalan menuju Blog Roma"...kekekekekkk.

Sebenarnya postingan ini cuma mengamankan tutorial ini dari si empunya link. Kenapa aku katakan demikian!!! Coba sobat klik address berikut ini : "http://feeds.feedburner.com/~r/wolverinehacks/~3/423845145/how-to-show-10-posts-instead-of-5-posts.html"   pasti bakal masuk ke feed burner HTTP Error (Code) and Message: (404) null. Ayo deh kita lanjut kalau ada yang kepingin recent post ini.

  1. Log in ke dalam account sobat terlebih dahulu.
  2. Pilih Layout--->Page Elements--->Add a Gadget--->Pilih HTML/Javascript.
  3. Masukkan deh script berikut ini :
  4. <script>
    function rp(json) {
    document.write('<ul>');

    for (var i = 0; i < numposts; i++) {
    document.write('<li>');
    var entry = json.feed.entry[i];
    var posttitle = entry.title.$t;
    var posturl;

    if (i == json.feed.entry.length) break;

    for (var k = 0; k < entry.link.length; k++) {
    if (entry.link[k].rel == 'alternate') {
    posturl = entry.link[k].href;
    break;
    }
    }

    posttitle = posttitle.link(posturl);
    var readmorelink = "(more)";
    readmorelink = readmorelink.link(posturl);
    var postdate = entry.published.$t;
    var cdyear = postdate.substring(0,4);
    var cdmonth = postdate.substring(5,7);
    var cdday = postdate.substring(8,10);
    var monthnames = new Array();
    monthnames[1] = "Jan";
    monthnames[2] = "Feb";
    monthnames[3] = "Mar";
    monthnames[4] = "Apr";
    monthnames[5] = "May";
    monthnames[6] = "Jun";
    monthnames[7] = "Jul";
    monthnames[8] = "Aug";
    monthnames[9] = "Sep";
    monthnames[10] = "Oct";
    monthnames[11] = "Nov";
    monthnames[12] = "Dec";

    if ("content" in entry) {
    var postcontent = entry.content.$t;
    } else if ("summary" in entry) {
    var postcontent = entry.summary.$t;
    } else
    var postcontent = "";
    var re = /<\S[^>]*>/g;
    postcontent = postcontent.replace(re, "");
    document.write(posttitle);

    if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);

    if (showpostsummary == true) {
    if (postcontent.length < numchars) {
    document.write(postcontent);
    } else {
    postcontent = postcontent.substring(0, numchars);
    var quoteEnd = postcontent.lastIndexOf(" ");
    postcontent = postcontent.substring(0,quoteEnd);
    document.write(postcontent + '...' + readmorelink);
    }
    }
    document.write('</li>');
    }
    document.write('</ul>');

    }
    </script>

    <script>
    var numposts = 10;
    var showpostdate = false;
    var showpostsummary = false;
    var numchars = 100;
    </script>

    <script src="http://NAME-YOUR-BLOG.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script>
  5. Gantilah tulisan NAME-YOUR-BLOG dengan nama blog sobat.
  6. SAVE.
Catatan :
  • var numposts = 10 (Max 25 post).
  • var showpostdate = false (ganti dengan true) maka akan tampil tanggal pada bagian ujung title postingannya.
  • var showpostsummary = false (ganti dengan true) maka akan tampil penjelasan beberapa kalimat mengenai postingan kita.
TERIMA KASIH...PRETTT!!!