Rippons Birdwing

Showing posts with label Blogger Tricks. Show all posts

Screenshot menggunakan MsPaint

Bagi para blogger, melakukan screenshot untuk bahan posting merupakan hal yang tak asing lagi. Saat ini ada banyak applikasi untuk melakukan screenshot windows seperti Corel capture, !Quick Screen Capture, dll. Sebenarnya hanya dengan menggunakan applikasi mspaint.exe pun kita dapat melakukan screenshot windows tanpa harus menginstall applikasi lain yang terkadang tidak gratis.

Oke deh langsung saja.

pertama-tama jalankan microsoft paint,
aktifkan windows yang ingin di ambil screenshot-nya
pada saat windows aktif, tekan tombol Alt dan tombol Print Screen [Prt Scr] bersamaan.
setelah itu kembali ke mspaint.exe, pada jendela mspaint klik kanan => Paste Ctrl+V.
terakhir simpan file

Selamat mencoba..^_^

Upload Script di Google Code

Aseem tenan..!, listrik ko' dari tadi ko' jyar-pet..jyar-pet.. bikin bete' wae. Padahal sebenernya kali ini kita mau bikin postingan yang serius looh.. Tapi gara-gara listrik yang ga' konsekwen, inspirasi jadi buyar. Wis langsung wae lah, pada saat ini penggunaan javascript memegang peranan yang cukup besar pada perkembangan web. Beberapa developer membagi-bagikan scriptnya kepada blogger yang bodo dan buta script kaya' kita secara cuma-cuma namun ga' pernah ikhlas. Iya tooh, mau tak mau kita harus memberikan backlink gratis ke developer pembuat script kalo kita mau memakai script buatannya, wajar deeh kan gratisaaan.. Javascript sepertinya merupakan hal yang wajib ada pada blog. mungkin layaknya sayuran tanpa micin ya, kalo blog ga' ada javascriptnya?. Bahkan ada beberapa blog yang menggunakan script hingga mencapai kulminasi MANIAK, hingga yang lebih parah para blogger sengaja memasang script pada blog untuk menjahili pengunjung. Edaaan...!

Uyeee.. balik ke judul, pada postingan membuat daftar isi pada blog, kita telah mengetahui cara upload script pada Google Site, namun ada beberapa kelemahan, google site terkadang sulit untuk terkoneksi dengan blog sehingga script tidak ter-eksekusi dengan baik dan hasilnya hanya memperlambat loading blog. Kali ini kita mencoba untuk menggunakan jasa hosting gratis lain dari Google, yaitu Google Code. Dan karena usul dari teman sebaiknya untuk panduan seperti ini sebaiknya ada gambarnya, maka akan saya kasih gambarnya deeh.. Tapi awas aja yah kalo blog kita dibilangin kaya' buku komik. Oke deh, lanjuut.. langsung aja yah.

Pertama-tama login ke Google Code menggunakan akun Google

Setelah itu klik Create a new project

Isikan nama project, ringkasan project, deskripsi project, pada version control system pilih Mercurial dan pada source code license pilih GNU GPL v3, project label boleh dikosongkan lalu klik Create project.

Setelah project jadi, tindakan selanjutnya adalah, meng-upload script. Masuk halaman download dan klik new download

Pilih file yang akan di upload, lalu klik Submit file

Setelah selesai meng-upload, untuk mengetahui lokasi URL file sehingga kita dapat menggunakan sourcenya, klik file, lalu pada jendela baru klik kanan file ==> Copy Link Location, atau arahkan kursor pada file dan lihat URL-nya pada jendela browser.

Selesai.

Selamat mencoba..^_^

Membuat Daftar Isi Pada Blog

Uyyeeaahh... balik lagi.. bikin postingan ga' mutu lagi..

Kalo kita tanya,"Gimana kalo kita buat daftar isi pada blog kita?". Lu pada pasti jawab "Yaah mbel, itu sih dah banyak yang posting, kaliii..!!!". Uyeeaahh.. kalo kata kita, "itu sih cara orang ga' kreatif yang males, tinggal tangkringin URL script orang yang udah susah-susah bikin ama upload script.. Kasiaan sama yang buat doonk.. Lagian kalo cara begituan kaya'nya ga' ada gregetnya deeh, kali ini kita bakal membuat widget yang merupakan hasil usaha sendiri. kita akan edit scriptnya, kita akan upload scriptnya, kita buat widgetnya, kita rasakan hasil kerja keras kita. Gimana... mau...?"

Pertama-tama, buat text dokumen baru menggunakan notepad atau dari start menu => run ketik notepad, itu sih dah pada tau'..

Iya deeh.. tapi yang ini belum pada tau' kan.. nih ta' ajari jurus mautku (weleeh mbel... gayamu.. gomballl..)

Pada notepad ketikkan ini, atau copas aja deh, timbang kelamaan,

//<![CDATA[
function showrecentposts(json) {
for (var i = 0; i < numposts; i++) {
    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, "");
    if (!standardstyling) document.write('<div class="bbrecpost">');
    if (standardstyling) document.write('<br/>');
    document.write(posttitle);
    if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
    if (!standardstyling) document.write('</div><div class="bbrecpostsum"">');
    if (showpostsummary == true) {
      if (standardstyling) document.write('<br/>');
      if (postcontent.length < numchars) {
         if (standardstyling) document.write('<i>');
         document.write(postcontent);
         if (standardstyling) document.write('</i>');}
      else {
         if (standardstyling) document.write('<i>');
         postcontent = postcontent.substring(0, numchars);
         var quoteEnd = postcontent.lastIndexOf(" ");
         postcontent = postcontent.substring(0,quoteEnd);
         document.write(postcontent + '...' + readmorelink);
         if (standardstyling) document.write('</i>');}
}
    if (!standardstyling) document.write('</div>');
    if (standardstyling) document.write('');
}
if (!standardstyling) document.write('');
if (standardstyling) document.write('');
document.write('');
if (!standardstyling) document.write('');

}
//]]>

kalo udah selesai kita akan menyimpannya sebagai text javascript, Save As... judulnya_terserah.js dan dalam kotak Save As Type: pilih All files.

Untuk hasil optimal sebaiknya file di simpan dengan ekstensi *.js jangan *.txt

Nah langkah pertama selesai.. lanjut langkah kedua..

1. Buka tab baru pada browser anda.. (ciaaa.. serasa guru kursus aja..) masuk ke Google sites login menggunakan akun google

2. setelah masuk halaman utama google site klik create site.

3. pada pilihan template, pilih blank template

4. masukkan judul situs (judulnya bagusnya nama saya deeh.. tapi kalo ga' mau, terserah deeh....^_^)

5. isi captcha klik create site (iyaa.. ga' diajarin juga tau..)

6. setelah situs jadi, pada halaman Home klik Create page, (itu looh, tombol yang ada palang ijonya..)

7. Pilih halaman type List (yang ke-empat)

8. Masukan nama halaman (judulnya terserah juga),

9. klik create page.

10. setelah kita masuk ke halaman list yang kita buat tadi klik Attachments

11. pada kotak Attach a file: upload file Java-script yang tadi kita buat.

12. Setelah file selesai di upload, klik kanan pada kata 'download'=> Copy Link Location.. salin Link ke notepad

contoh link

https://sites.google.com/site/neranjikematian/list0/Myrecentspost.js?attredirects=0&d=1

nah URL inilah yang akan kita gunakan sebagai target widget kita, namun karena yang akan kita gunakan hanya URL target text javascript-nya saja maka kita akan hapus direct downloadnya dengan cara memotong URL dari belakang hingga akhir ekstensi file (dalam hal ini js adalah ekstensinya)
contoh link target yang sudah di potong redirect-nya

https://sites.google.com/site/neranjikematian/list0/Myrecentspost.js

13. Naah.. pada tahap ini kita sudah selesai..

Lanjut langkah ketiga.. soalnya kalo kelamaan, buat mbayar warnetnya ntar kurang, lagi.. yang kemaren aja masih ngutang..^_^.

1. Masuk dashboard, design, edit layout, pada page elemen, tambahkan gadget HTML/Javascript.

2. Masukkan kode berikut :

<div style="border: 1px solid #666666); overflow: auto; height: 250px;" margin="5px" ;>

<script style="text/javascript" src="https://sites.google.com/site/neranjikematian/list0/Myrecentspost.js"></script><script style="text/javascript">var numposts = 1000;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script><script src="http://www.ripponsbirdwing.co.cc/feeds/posts/default?orderby=published&alt=json-in-script&max-results=999&callback=showrecentposts"></script>

</div>

# pada URL yang berwarna merah, ganti dengan URL download javascript yang tadi kita upload

# pada URL yang berwarna biru, ganti dengan URL blog kita

3. Save

4. Selesai.. Test..

Naah gimana rasanya...?
Hasil keringat sendiri.. pasti bau dooonk... wahahahaaayy...

Tapi bener deeh, katanya jika segala sesuatu yang kita miliki adalah hasil kerja keras kita sendiri maka akan lebih bermakna...
(ciaa.. so' tua lu aah...! )

Uyeee... Selamat mencoba..

Update...
Setelah kita periksa, sering terjadi permasalahan saat blog melakukan koneksi ke Google site. Maka script terkadang tidak ter-eksekusi dengan baik, dan akan memperlambat loading blog.

Perbaikan...

Selain Google Site, kita dapat menggunakan Google Code untuk meng-upload script, atau kita bisa langsung mengedit HTML/Javascript dengan cara mengganti semua script dengan script ini:

Pada URL yang berwarna biru, ganti dengan URL blog yang ingin ditampilkan daftar isinya, terserah.. mau di isi URL blog kita atau URL teman kita. Jadi artinya, script ini juga dapat digunakan untuk menampilkan daftar isi blog lain looh.

Google Site Verification

Google site verification merupakan salah satu meta tag yang sebaiknya ada di source HTML blog/web kita. Kegunaan elemen meta yang satu ini adalah sebagai alat verifikasi bahwa kita adalah pemilik suatu blog, sehingga blog tidak dianggap sebagai unverified web dengan anonymus owner dalam directory index Google. Elemen meta ini harus kita letakkan disektor head sebelum body.

Bagi yang mau tau, langsung saja kita oprek.. Kalo yang udah tau' dan ga' mau tau..bodo amat..!

1. Sign in/login ke Google Webmaster menggunakan akun google

2. pada halaman home klik 'Add a site...' dan masukan URL/alamat blog kita, lalu klik continue

3. pada halaman Verify ownership, pilih Add a meta tag to your site's home page (radio button kedua dari atas) maka kita akan diberikan instruksi untuk menyalin meta tag yang diberikan. contohnya:

4. Bagi pengguna blogspot : masuk ke dashboard --> design --> Edit HTML

cari <head> copy dan paste-kan meta tag ke template pada sektor head.

contoh:

<head>

<title> JUDUL BLOG </title>

</head>
<body>

isi blognya

</body>

Bagi pengguna Wordpress masuk dashboard => Tools

salin meta tag padaWebmaster Tools Verification =>Google Webmaster Tools

5. Save Templates pada blogger atau Save Changes pada wordpress

6. Kembali ke Google Webmaster dan klik Verify.

msvalidate.01

Kegunaan dari msvalidate.01 sama dengan goggle-site-verification dalam versi MSN dan tentu saja untuk memverifikasi kepemilikan situs pada directory index MSN. caranya:

1. Login ke Bing Webmaster Tools menggunakan akun hotmail atau live messenger, jika belum punya akun buat terlebih dahulu.

2. klik Add Site, masukkan URL/alamat blog kita lalu klik Submit, loading..

3. pada pop-up Verify ownership, pilih Options 2: Copy and paste a <meta> tag in your default webpage

salin meta tag yang diberikan. contohnya:

4. Bagi pengguna blogspot : masuk ke Edit HTML lagi

cari copy dan paste-kan meta tag ke template pada sektor head.

Bagi pengguna Wordpress masuk Tools lagi. (bolak-balik..ya..)

salin meta tag padaWebmaster Tools Verification =>Bing Webmaster Center

5. Save Templates pada blogger atau Save Changes pada wordpress

6. Kembali ke Bing Webmaster dan klik Verify

y_key

Sama seperti google-site-verification dan msvalidate.01, y_key pun digunakan untuk verifikasi. caranya:

1. Login ke Site Explorer menggunakan akun Yahoo!
2. klik My Sites, masukkan URL/alamat situs ke kotak isian URL lalu klik Add My Site.

3. Pada halaman Authentication, klik By adding a META tag to my home page.

salin meta tag yang diberikan. contohnya:

4. lakukan langkah 4.5 seperti yang diatas

6. Kembali ke Site Explorer dan klik Ready to Authenticate.

Selesai...

Selain sebagai verifikasi pada blog atau situs, dengan elemen meta ini kita dapat mengevaluasi blog atau situs menggunakan webmaster tools, sehingga kekurangan yang ada pada blog dapat kita perbaiki.

Selamat mencoba...

Optimalisasi HTML

Bermula dari pertanyaan kawan, "Mbel, kandangku ko' abot yo.?". Waduuh.. kerjaan lagi nih. Mendingan kalo di bayar.. Maka dengan berat hati kita ngoprekin blog-nya dia. Uuuh sirahku jadi cekot-cekot, soalnya waktu kita anjurkan buat ganti templatenya.. katanya, "Jangan doonk.. rugi tau..!". Aseeeeemmm...

Salah satu penyebab lambatnya loading blog/web adalah besarnya ukuran template blog/web.

Jika ukuran templatenya saja sudah besar, gimana nanti kalau sudah di isi postingan ? Mungkin bagi beberapa blogger yang sudah susah-payah membangun sebuah blog, akan merasa sayang untuk mengganti template-nya. Iya doonk.. emangnya nyewa warnet ga' pake duit..!

Bila kita merasa sayang untuk mengganti template, maka salah satu cara agar loading blog lebih baik adalah dengan meng-optimalkan template. salah satu caranya adalah dengan menghilangkan baris kosong pada template.

Caranya :

1. Login ke blogger, masuk dashboard, rancangan, edit HTML

2. Klik download template lengkap sebagai backup.

3. copy template xml script ke notepad.

contoh xml sebelum di edit:

<?xml version="1.0" encoding="UTF-8" ?>-baris
<!DOCTYPE html>-baris
<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>-baris
<head>-baris
    <meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>-baris
    <b:if cond='data:blog.isMobile'>-baris
      <meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>-baris
    <b:else/>-baris
      <meta content='width=1100' name='viewport'/>-baris
    </b:if>-baris
    <b:include data='blog' name='all-head-content'/>-baris
    <title><data:blog.pageTitle/></title>-baris

    <b:skin><![CDATA[
/* Variable definitions
   ====================
   <Variable name="keycolor" description="Main Color" type="color" default="#ffffff" value="#ffffff"/>-baris

   <Group description="Page" selector="body">-baris
     <Variable name="body.font" description="Font" type="font"
         default="normal normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>-baris
     <Variable name="body.background.color" description="Background Color" type="color" default="#000000" value="#000000"/>-baris
     <Variable name="body.text.color" description="Text Color" type="color" default="#ffffff" value="#ffffff"/>-baris
   </Group>-baris
-----------------------------------------------
</html>

Tampak diatas, setiap syntax di pisahkan dengan baris

4. Dengan notepad atau secara langsung di halaman edit HTML, kita akan menghilangkan baris kosong pada template.

5. Ganti setiap syntax yang dipisahkan oleh baris dengan spasi sehingga setiap syntax hanya di pisahkan oleh spasi. Sehingga jadinya seperti ini:

<?xml version="1.0" encoding="UTF-8" ?>spasi<!DOCTYPE html>spasi<html b:version='2' class='v2' expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>spasi<head>spasi<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>spasi<b:if cond='data:blog.isMobile'>spasi<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>spasi<b:else/>spasi<meta content='width=1100' name='viewport'/>spasi</b:if>spasi<b:include data='blog' name='all-head-content'/>spasi<title><data:blog.pageTitle/></title>spasi<b:skin><![CDATA[/* ----------------------------------------------- </html>

6. Setelah selesai mengganti semua baris syntax dengan spasi, klik pratinjau. Jika terjadi kesalahan parse cari kesalahannya lalu perbaiki. Kalo soal beginian cari sendiri, ya.. sekalian belajar gitu..

7. Jika hasil pengeditan dapat di tampilkan dalam hasil pratinjau, maka save template.
8. Buka blog dan test hasilnya, jika ada kesalahan dan ada yang tidak beres pada blog, upload template yang tadi kita download.

Dengan cara ini, maka gap pengeksekusian setiap syntax lebih dekat. Sehingga dapat mengurangi sedikit waktu loading.

Selamat mencoba, dan selamat berpusing ria..^_^

Image Processing

Sebuah blog atau website akan tampak monoton dan menjemukan jika tidak ada image di dalamnya. Memang harus kita akui bahwa, tampilan blog/web yang indah dengan graphic yang bagus, elemen flash, streaming java yang menyenangkan merupakan salah satu faktor yang akan membuat pengunjung betah berlama-lama memandangi blog kita. Tapi bila hal itu membuat kinerja CPU mereka menjadi berat dan mengganggu pekerjaan lainnya, mereka akan lebih suka menutup browsernya, jelas mereka lebih sayang sama CPU-nya doonk..
Membangun sebuah blog layaknya gabungan karya seni dan ilmu pengetahuan untuk membuat suatu halaman web yang indah namun mudah diakses. Seperti yang sudah kita ketahui, banyak looh pengunjung yang tidak sabaran dan tidak mau menghabiskan waktunya untuk sekedar menunggu loading blog/web yang lama, begitu juga mesin pencarian, mereka punya banyak tugas untuk mengindex blog/web lain.

Ada satu cara sederhana dari sekian banyak cara untuk mempercepat load blog kita, yaitu dengan cara melakukan kompressi pada image yang akan kita tampilkan pada blog.
Ada baiknya kita memiliki sedikit kemampuan pengeditan media graphic seperti Adobe Photoshop, Image Ready, atau Macromedia Firework.
Jika menggunakan ImageReady atau Firework, file akan otomatis di optimalisasikan untuk web. Namun jika menggunakan photoshop, pastikan file disimpan untuk web 'save for web...' dan sebaiknya gunakan kualitas medium atau low. Dengan begitu kita dapat meng-optimalkan image, dengan ukuran file yang kecil tanpa mengurangi kualitas gambar. Banyak tips dan trik yang mengatakan bahwa file image dalam format .png akan lebih cepat load, namun sebenarnya hal itu merupakan suatu 'kesalahan'. Perlu diketahui bahwa banyak applikasi browser yang tidak mensupport format .png.

Sebuah halaman blog/web sebaiknya dapat di load dalam waktu kurang dari 10 detik. Jika tidak, maka pengunjung-lah yang kita rugikan, kasihan doonk... Sungguh suatu hal yang akan sangat menyenangkan apabila blog kita merupakan blog yang ringan dan indah kan..?

Pages