Cara Menggunakan Google Drive Untuk Javascript

Informasi Online - Sejak pihak Google resmi menghapus salah satu fasilitas yakni Google Code, banyak pengguna Google Code yang kebingungan dimana harus mengupload file Javascriptnya apalagi yang mempunyai link back.
Sebenarnya pihak Google pun tidak serta merta langsung menghapus fasilitas tersebut, para pengguna masih diberi waktu tenggang untuk me-backup file mereka yang telah disimpan di Google Code sebelumnya. Pihak Google memberi opsi lain, pengguna bisa menggunakan provider lain antara lain: GitHub, Bitbucket, Dropbox dan lain-lain.

Dan siapa sangka pihak Google masih menyediakan fasilitas upload file Javascript melalui Google Drive dan ternyata lebih mudah dan cepat dibandingkan dengan Google Code dan juga para pengguna diberikan ruang 15 GB Gratis untuk menyimpan file Foto, Dokumen dll :)

Disini saya akan mencoba berbagi cara menggunakan Google Drive untuk upload file Javascript.
Hal utama untuk bisa menggunakan Google Drive yakni harus mempunyai akun Gmail.

1. Login Gmail
2. Klik tombol Grid Aplikasi Google (menu sebelah kanan-atas) dan pilih Google Drive

3. Lihat menu sebelah kiri, klik Baru > folder (untuk membuat folder),
   nama folder bisa dibuat sesuai keinginan anda lalu klik Buat untuk menyimpan folder
   sebagai contoh: saya membuat folder Javascript

4. Untuk menggunakan folder yang telah di buat tadi, tinggal klik 2x nama Foldernya

5. Untuk me-Upload File: klik Baru > unggah file
   Pilih file yang mau di upload sebagai contoh saya mengupload file js. Yang ada di Download
   

6. Setelah file js tadi terupload atau terunggah 100 % selanjutnya klik kanan pada file dan pilih 'Bagikan' Untuk mengatur opsi supaya kode nya bisa di lihat diweb atau blog.

7. Cara mengunakan kode nya buat blog yaitu copy code yang tampil dan pastekan sementara dulu di notepad.

8. Selanjut nya contoh menggunakan code nya untuk hosting yaitu mengambil code di tandai yang sudah di pastekan di notepad tadi Gabungkan URL nya sehingga kode menjadi seperti contoh kode di bawah ini .

Note:

URL yang diberikan oleh Google Drive:
https://drive.google.com/file/d/0B3q0-wpa2PDWLTZveGk2cWlZZ0E/view?usp=sharing
Gabungkan code ini:
https://googledrive.com/host/masukan kode yang di tandai warna merah disini
sehingga kode nya menjadi seperti dibawah ini:
https://googledrive.com/host/0B3q0-wpa2PDWLTZveGk2cWlZZ0E
Supaya menjadi kode widget code keseluruhan seperti ini:
<script src="https://googledrive.com/host/0B3q0-wpa2PDWLTZveGk2cWlZZ0E" type="text/javascript"/></script>

Cara diatas bisa juga diterapkan untuk code HTML, CSS dan JavaScript yang bisa anda coba sendiri.
Selamat Berkreasi! :)

Cara Membuat Halaman/Fanspage Facebook dan Like Box di Blog

Informasi Online - Fans page atau halaman facebook pada dasarnya digunakan untuk membangun sebuah komunitas atau grup online.

Pada akun biasa/pribadi hanya mampu menampung hingga 5000 teman sedangkan fanpage tidak terbatas.
Para blogger juga banyak yang membuat fans page facebook agar para penggemarnya dapat selalu mengikuti artikel-artikel terbaru blognya, dan dapat like (suka) dan share agar blognya semakin terkenal dan mendapatkan banyak pengunjung.

Lalu bagaimana cara membuat halaman di Facebook? Disini indolaron akan berbagi tutorial membuat halaman/fanspage facebook dan like box.

Cara Membuat Halaman/Fanspage Facebook

1. Login ke Facebook anda, lalu kunjungi http://www.facebook.com/pages/create.php.
   Pada halaman ini anda akan menemui 6 jenis kategori, silahkan pilih kategori halaman yang sesuai dengan kebutuhan atau minat anda, misal Merk atau Produk.
2. Pada kolom Pilih Kategori: tentukan kategori dari halaman yang akan anda buat , dan beri nama halaman tersebut pada kolom yang tersedia lalu beri tanda centang pada Saya setuju dengan Ketentuan Halaman Facebook, Setelah itu langsung saja klik Mulai
   
   
3. Isi pengaturan dari halaman yang hendak dibuat,
   
   
   
   - Kolom Tambahkan deskripsi dengan informasi umum tentang...: Silahkan beri penjelasan tentang halaman yang anda buat.
   Misal: Tempat Sharing Informasi Online,berita ringan,tutorial blogger,free download,dan mengupas tentang cara meraup dollar via online, informasi lowongan pekerjaan, kerjasama bisnis, dan lain-lain.
   - Kolom Situs web (misal: situs web Anda, tautan Twiter atau Yelp): Silahkan masukkan alamat situs blog atau web atau alamat profil google plus anda, jika tidak ada maka boleh dikosongkan.
   - Pada bagian akhir ada pertanyaan silahkan jawab Ya atau Tidak
   
4. Klik Simpan Info
5. Silahkan masukkan lambang gambar atau foto pada step Foto Profil atau langsung saja klik tombol Lewati/Skip
6. Tentukan alamat web facebook anda, saran saya dalam pemilihan nama, sama dengan cara memilih nama alamat blog agar unik dan mudah ditemukan di google. Setelah itu tekan Atur Nama atau Lewati
7. Enable Ads, pada bagian ini langsung Lewati saja.

Sampai tahap ini, anda telah berhasil membuat dan mempunyai alamat Halaman Facebook.
Tahap selanjutnya yakni membuat tombol LIKE dan Memasangnya di Blog sobat tapi catan url halaman anda karena akan dibutuhkan untuk menuju tahan berikutnya.

Langkah-Langkah Membuat  Like Box/Tombol Like Facebook

1. Buka halaman berikut: http://developers.facebook.com/docs/reference/plugins/like-box
   akan muncul halaman sbb:
   
   
   
   Setting Facebook Like Box:
   - Facebook Page url: url Facebook Page anda.
   - Height-Width: Tinggi dan lebar tampilan facebook like.
   - Color scheme: pilih light jika ingin tampilan terang, dan dark untuk tampilan gelap.
   - Show Friends' Faces: Centang untuk menampilkan foto profil likers.
   - Show Post: Centang jika ingin menampilkan postingan
   - Show Header: Centang jika ingin menampilkan tulisan header "Find Us on Facebook".
   - Show Border: Centang jika ingin memberi border atau kosongkan agar transparan.
   (Lihat preview tampilan di bawah form tersebut)
2. Jika sudah sesuai dengan keinginan anda, lalu klik Get Code
3. Kemudian akan muncul pop-up window yang menampilkan 4 jenis kode, HTML5, iFrame , XFBML dan URL, pilih salah satu dan copy kodenya. (Untuk Blogger, saya sarankan pilih HTML 5).
   
   

Langkah-langkah Memasang Like Box di Blog

1. Login ke Blogger anda > Buka Dashboard > Tata Letak > Klik add a gadget/tambah gadget.
2. Pilih opsi HTML/Javascript.
3. Masukkan kode yang telah dicopy ke dalam kotak kode lalu Save
4. Like box telah siap digunakan, dan setiap pengunjung blog/website yang menyukai blog/website anda dapat dengan mudah meng-klik like pada like box yag telah disediakan.

Jika pemasangan kode dan like box tidak muncul:

• Copy paste saja semua kode ke dalam HTML/Javascript.
  Misalnya ketika memilih HTML 5, kemudian ada dua kolom yang masing-masing berisi dua kode, jangan pisahkan pemasangan kode, pasang saja keduanya ke gadget HTML/Javascript secara berurutan, yaitu taruh kode kedua di bawah kode pertama. Kemudian save.
• Atau opsi lain yaitu gunakan pilihan code IFRAME

Menampilkan Menu Penghasilan di Dahsboard Blogger

Pada tulisan ini saya hanya ingin berbagi pengetahuan saja menurut pengalaman pribadi Admin. Jika ada diantara sobat yang bingung saat hendak mendaftar di Google Adsense via blog yang berflatform Blogspot/Blogger mungkin akan menemukan sedikit perubahan.

Coretan ini dikhusus-kan bagi sobat yang ingin main di Google Adsense ya, jika agann tidak bertujuan kearah sana menu penghasilan saya rasa tidak diperlukan.

Jika kita langsung mendaftar di situsnya yakni: https://www.google.co.id/adsense kita akan sisuruh daftar via Blogger langsung, dan jika settingan blogger anda masih Default maka di Dashboard blogger anda tidak ditemukan Menu Penghasilan.

Saya teringat bahwa dulu blog saya pernah muncul menu Penghasilan di Dasboard. Namun pada blog ini kog tidak ada. setelah saya menganalisa ternyata ada pada bahasa. Google Adsense hanya mensuport Bahasa Indonesia tapi tidak mensuport menu Blog Berbahasa Indonesia.
Langsung saja kita simak cara memunculkan menu Penghasilan di dasboard blog:
1. Login ke Blogger
2. Pilih menu Setelan > Bahasa dan Pemformatan > Pilih Bahasa Inggris

3. Refresh halaman maka menu penghasilan akan muncul, seperti gambar:

Bagaimana sobat...? Di Dasboard blog sobat sudah ada menu penghasilan nya..?
Jika menu penghasilan sudah muncul, anda sudah bisa memulai mendaftar di Google Adsense :)

Membuat Halaman 404 Pada Blogspot

Halaman Error 404 adalah halaman yang akan ditampilkan bila halaman yang sebenarnya tidak ditemukan.
Saya yakin diantara sobat yang pernah Googling dengan suatu keyword tertentu dan kadang setelah diklik ternyata halaman yang kita akses telah dihapus oleh Admin/Penulis. Nah cara ini berguna untuk membantu pengunjung yang salah mengakses link / halaman yang ada di blog kita dengan memberikan petunjuk atau saran pada halaman error yang mereka akses.
Tutorial ini saya peroleh dari salah satu sobat indolaron yakni Mas Achmad Muharya.

Secara default jika kita mengakses link blogspot yang salah maka akan keluar info:

1. Sorry, the page you were looking for in this blog does not exist.atau
2. Maaf, laman yang Anda cari di blog ini tidak ada.

atau tampilanya kira-kira seperti ini:

Penasaran seperti apa sih Halaman Error 404 yang saya coba jabarkan?
Silahkan sobat buka Homepage blog masing-masing trus ditambahin kalimat/kata apapun, misal:
http://nama.blogspot.com/ganteng gimana gan hasilnya..?? :p
Nah coba klik http://indolaron.com/pelit dah tahu kan apa maksud dan arti dari postingan kali ini.

Disini ada 2 cara untuk membuat Halaman ERROR 404 yakni dari setelan blog (Preferensi penelusuran) atau dengan modifikasi HTML yang kita masukkan di bagian body blog.

CARA I: - Setelan blog

1. Login ke account blogspot
2. Setelah di Dashboard > Setelan > Preferensi penelusuran > klik edit pada Pesan Khusus untuk Laman Tidak Ditemukan
akan muncul tampilan kotak seperti ini:

3. Copy kode ini, lalu paste pada kotak Pesan Khusus untuk Laman Tidak Ditemukan

<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Maaf Halaman Yang Anda Cari Tidak Di Temukan Atau Sudah di hapus<br><a href="URL Blog">Klik DISINI</a> untuk kembali ke Beranda <br> Have a nice Day...</h3><img src="URL gambar 404"/>

4. Klik Simpan Perubahan
Note:
* URL Blog : ganti dengan link blog atau homepage blog anda
* URL gambar 404: isi dengan link gambar ERROR 404 sesuai selera anda, misal:
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkiCmOxYbfME_pIs2j3uh6ASJb-koO7QlAbZ935SDfGOsn3wEl2g8drtH3OmaZXLwUxeivKVvTysFW7cbO842vw1H62-GKypkx-IVFhaJFebZH4AIOEqHAmkaX0vKIth0Ajs_C1ev8bEs/s400/404_not_found.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi82pJwmGJvKiAjLUsccNZM6VQG_M2yg17bAx7UUNeG8y8BapumW_nv9Hbi0NbEtiQjWaNQUh-QJAHj4CyNsqfSqdY5pjSVwYwLa9R5jtgri9h0FF13jQawrA1n1aWBlvSfpkG3DT5z-ow/s1600/ERROR_404.png 

CARA II: - Modifikasi HTML

1. Login ke account blogspot
2. Setelah masuk di Dashboard lalu pilih Template > Edit HTML
3. Cari kode ini ]]></b:skin>
4. Masukkan kode CSS berikut tepat diatas kode ]]></b:skin>

#error-page {
text-align:center;
background-color:#fff;
position:fixed !important;
position:absolute; /* IE6 Fallback */
top:0px;
right:0px;
bottom:0px;
left:0px;
padding-top:100px;
z-index:99999;
}

5. Sekarang cari kode ini </body>
6. Lalu masukan kode HTML berikut ini diatas kode </body>

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/>Oops ! | Error 404</title>
</b:if>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='error-page'>
<h1><img src='URL gambar 404'/><br/>
You Enter a wrong page, please check Your URL once more.<br/>
Please go to <a href='URL Blog' title='Home'>Homepage</a> 
</h1>
</div>
</b:if>

7. Kemudian Simpan template.
Note:
* URL gambar 404: isi dengan link gambar error 404 sesuai selera, misal:
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkiCmOxYbfME_pIs2j3uh6ASJb-koO7QlAbZ935SDfGOsn3wEl2g8drtH3OmaZXLwUxeivKVvTysFW7cbO842vw1H62-GKypkx-IVFhaJFebZH4AIOEqHAmkaX0vKIth0Ajs_C1ev8bEs/s400/404_not_found.png
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi82pJwmGJvKiAjLUsccNZM6VQG_M2yg17bAx7UUNeG8y8BapumW_nv9Hbi0NbEtiQjWaNQUh-QJAHj4CyNsqfSqdY5pjSVwYwLa9R5jtgri9h0FF13jQawrA1n1aWBlvSfpkG3DT5z-ow/s1600/ERROR_404.png
* URL Blog : ganti dengan link blog atau homepage blog anda
SELAMAT BERKREASI.....

Tampilan Baru Edit HTML Template Blogger

Beberapa hari tidak sempet update di blogger/blogspot dikarenakan ada kesibukan yang lain, dan hari ini pengen otak-atik template blog...ELADALAH tampilan Editor HTML kok beda, kaget plus bingung saya kira error :o .
Karena penasaran, kemudian saya buka blog yang lain lah kok juga sama....??? E ternyata mulai 10 April 2013 Google mengumumkan telah melakukan inovasi penyesuaian untuk Editor HTML template blogger/blogspot :p .

Jika anda melihat pada bagian editor template blogger, maka anda akan menemukan bahwa sekarang fitur tersebut mendukung line numbering, syntax highlighting, auto-indentation dan code folding.

Tampilan Baru Edit HTML Template Blogger diantaranya:

1. Tampilan yang paling mencolok adalah setiap baris html ada nomor urutnya persis di Notepad++
2. Setiap kode HTML dibedakan dengan SyntaxHighligter (kode warna-warni sesuai kelompoknya).
3. Tombol Expand Widget Templates tergantikan dengan adanya tombol Format template
4. Menggunakan sistem Collapse (klik tanda ► ) disamping nomor urut untuk menampilkan kode yang disembunyikan.


5. Editor HTML tidak lagi berbentuk popup, tapi embedded di dalam layout halaman.
6. Preview hasil editing juga tak membuka halaman baru tapi menyatu dengan Editor HTML/ditampilkan dalam 1 frame.
7. Pencarian kode dengan Ctrl+F harus di dalam kotak/bidang.


8. Penambahan fungsi Ctrl+Shift+F (untuk mengganti teks kode satu persatu) dan Ctrl+Shift+R (untuk mengganti semua kode sekaligus).

Dengan fitur atau inovasi ini diharapkan para pengguna blogspot akan lebih friendly dengan kode-kode HTML. Demikian sedikit ulasan dari indolaron, semoga kedepannya blog ini selalu memberikan info-info yang bermanfaat.
Happy Blogging :)

Membuat Recent Comments Lebih Elegan

Membuat Recent Comments atau Komentar Terbaru sebenarnya banyak sekali caranya dari mulai menggunakan Widget Creator, Alamat Feed maupun Javascript

Fungsi dari widget ini sudah jelas yakni untuk menampilkan komentar terbaru pada blog. Dan sobat Info Dari Om pernah menanyakan cara membuat widget seperti ini, pada kesempatan ini, saya akan mencoba memberikan Tutorialnya.

Dan tergantung kreatifitas Anda saja untuk membuat widget seperti ini, bisa diotak-atik sendiri kode-kodenya sesuai dengan selera Anda masing-masing :)

O.K gak usah panjang lebar langsung saja jika Anda ingin membuat widget seperti ini, silahkan terapkan Tutorial berikut

Langkah-langkah Membuat Recent Comments Lebih Elegan

1. Masuk ke account Blogger sobat
2. Pilih Tata Letak >> Tambah Gadget/Widget >> Tambahkan HTML/JavaScript

<style type="text/css">
#komentar {
font:normal 11px Comic Sans MS,Verdana,Arial,Sans-Serif;
background-color:#597624;
margin:0px 0px;
padding:10px 10px;
color:#000;
border:2px solid #597624;
-webkit-box-shadow:inset 0px 0px 2px #000;
-moz-box-shadow:inset 0px 0px 2px #000;
box-shadow:inset 0px 0px 2px #000;
}

#komentar ul {
margin:0px 0px;
padding:0px 0px;
border-top:1px solid #455F20;
border-bottom:1px solid #799D1A;
}

#komentar ul li {
border-top:1px solid #799D1A;
border-bottom:1px solid #455F20;
padding:3px 0px;
list-style:none;
}

#komentar ul li b a,
#komentar ul li b a:link,
#komentar ul li b a:visited,
#komentar ul li b {
color:#D7E5FD;
text-shadow:0 1px 1px rgba(0,0,0,0.4);
}

#komentar ul li b:before {
content:url(http://3.bp.blogspot.com/-abTiDALn6h0/TpJYHn1AmoI/AAAAAAAAA8I/hRAhFSBZhlY/s1600/feed-icon-green.png);
margin:0px 4px 0px 0px;
display:inline-block;
*display:inline;
vertical-align:middle;
}
</style>
<script type="text/javascript">
var jmlkomentar = 10,
jmlkarakter = 25,
home_page = "http://www.indolaron.com";
</script>
<script src="http://indolaron-js.googlecode.com/svn/trunk/elegan_rc.js" type="text/javascript"></script>

3. Save template

Keterangan:
- http://3.bp.blogspot.com/-abTiDALn6h0/TpJYHn1AmoI/AAAAAAAAA8I/hRAhFSBZhlY/s1600/feed-icon-green.png
bisa diganti dengan url icon sesuai selera Anda inginkan
- angka 10 : jumlah komentar yang ditampilkan
- angka 25 : jumlah karakter
- http://www.indolaron.com ganti dengan alamat blog anda

SELAMAT BERKREASI....!!!! :)

Cara Mengatasi ERROR 401 - svn trunk

Anda pernah mengakses blog/website dan menemukan Alert seperti ini, atau bahkan mungkin Error seperti ini menimpa pada Blog Anda sendiri..???? :p

Alert itu adalah ERROR 401, itu menandakan bahwa script yang di gunakan sudah rusak dan harus diganti agar setiap kali anda membuka web/ blog tidak disuruh mengisi username dan pasword.
Hal ini terjadi karena adanya 1 atau beberapa script yang rusak /dihapus /atau yang paling fatal adalah tempat penyimpanan kode tersebut kena baned oleh mbah google.

Jika ini terjadi pada blog Anda, maka Anda tidak usah resah karena Informasi Online akan mencoba memberi solusinya. Silahkan simak Tutorial ini dengan seksama

Langkah-langkah Mengatasi ERROR 401 - svn trunk

1. Coba ANDA lihat pada bagian yang ada dikotakan berwarna merah di atas ada tulisan https://indolaron.googlecode.com jadi sudah dipastikan yang rusak berhubungan dengan code script.
2. Lalu untuk mencari+mengetahui letak code script yang rusak,
Login > Template > Edit HTML > Lanjutkan > Centang Expand Template widget
*[ pada kasus ini saya mencari dengan keyword = https://indolaron.googlecode.com_bla_bla_bla]
Klik Ctrl + F pada keyboard nanti akan keluar seperti gambar di bawah ini:

3. Kita akan menemukan seperti gambar kode no 2 coba copy script tersebut mulai https sampai ke js sebagai contoh saya menemukan kode : https://indolaron.googlecode.com/svn/trunk/TESTING.js
4. Lalu pastekan di adressbar dan jika muncul seperti gambar di bawah ini:

Authorization Required

This server could not verify that you are authorized to access the document requested. Either you supplied the wrong credentials (e.g., bad password), or your browser doesn't understand how to supply the credentials required

Maka ini lah penyebab ERROR 401 tersebut :)
5. Untuk mengatasi hal tersebut Hapus code script yang dimaksud kemudian ganti dengan script yang fungsinya sama

Tips:
Jika anda sering comot code script maupun menerapkan Tutorial yang berisi script dari blog orang lain, usahakan simpan script di tempat penyimpanan sendiri.