Cara Upload File, HTML, CSS, Javascript Di Google Drive

Cara Upload File, HTML, CSS, Javascript Di Google Drive

Bola Hero Gawai

Cara Upload File, HTML, CSS, Javascript Di Google Drive

Google Drive
Dari informasi beberapa sumber yang saya baca, bahwa Google Code ada kemungkinan tahun depan sudah tidak bisa dipakai karena Google akan menutupnya. Nah sebagai penggantinya Google telah menyiapkan tempat baru untuk menghosting file seperti file dokumen, HTML, CSS, maupun JavaScript yaitu Google Drive.

Untuk itu kini saya mulai mengalihkan file JavaScript dan HTML blog Kompi Ajaib dari Google Code ke Google Drive dan ternyata sangat mudah dan script berjalan sempurna. Sekarang saya akan menguraikan cara upload file HTML, CSS, atau Javascript di Google Drive.

Bagi yang tertarik untuk mencobanya silahkan ikuti langkah-langkahnya di bawah ini:

1. Silahkan masuk ke Google Drive dengan link berikut https://drive.google.com/ dan login dengan akun Google Anda.

2. Kemudian klik tanda upload untuk mulai mengupload file dari komputer Anda, seperti pada gambar di bawah ini.

Cara Upload File, HTML, CSS, Javascript Di Google Drive 1

3. Silahkan pilih file yang ingin Anda upload kemudian akan muncul kotak upload, biasanya ada di bawah kanan. Tunggu proses uploadnya sampai selesai. Setelah proses uploadnya selesai silahkan klik tulisan "share".

Cara Upload File, HTML, CSS, Javascript Di Google Drive 2

4. Kemudian akan muncul dialog box baru, silahkan pilih pada option "Who has access" dengan klik tulisan "change" / "ganti"

Cara Upload File, HTML, CSS, Javascript Di Google Drive 3

5. Kemudian pindahkan pilihan dari "Private" ke "Public on the web"

Cara Upload File, HTML, CSS, Javascript Di Google Drive 4

6. Kemudian akan muncul dilog box lagi, silahkan copy link-nya dan simpan di notepad.

Cara Upload File, HTML, CSS, Javascript Di Google Drive 5

7. Nah untuk menyimpan file hostingannya di blog kita agar scriptnya dapat berjalan, ganti linknya seperti di bawah ini.

A. Biasanya linknya akan seperti di bawah ini.

https://docs.google.com/file/d/0Bz4YdwRI3rnCejVJVDNGdDZmRE/edit?usp=sharing

Perhatikan kode yang berwarna merah, kode itu yang dibutuhkan untuk langkah B

B. Silahkan ganti dengan link berikut ini:

https://googledrive.com/host/KODE UNIK GOOGLE DRIVE/

Nah silahkan ganti tulisan KODE UNIK GOOGLE DRIVE dengan kode berwarna merah pada langkah A. Sehingga penampakannya akan seperti di bawah ini:

https://googledrive.com/host/0Bz4YdwRI3rnCejVJVDNGdDZmRE/

Nah demikianlah cara upload file HTML, CSS, atau JavaScript di Google Drive ini semoga dapat dimengerti dan bermanfaat.

Thanks to: http://www.makingdifferent.com/

Share this:

Share this with short URL: Get Short URL loading short url

You Might Also Like:

Disqus
Blogger
Pilih Sistem Komentar Yang Disukai

67 Comments Add Comment

Pertamax,, wah harus ganti hosting lagi.. makasih infonya om..

Balas

Silahkan mas dicoba aja...hehehe...script saya berjalan sempurna...

Balas

maaf mas OOT, blog saya knapa nggak bisa diakses ya? :(

Balas

wah ini dia yg saya cari2, saya denger kabar googlecode bakal ditutup saya langsung cari web alternatif untuk upload file, saya juga pernah nyoba upload di google drive tapi ternyata gagal, eh ketemu tutornya hehe terimakasih om kompi, saya coba dulu :D
ohiya pake google sites juga bisa om kompi, saya sebelumnya udah coba disitu dan kodenya berjalan normal :)

Balas

Pantesan saat saya mau upload file di google code nggak muncul tulisan 'Download' yg biasa digunakan untuk meng-upload file..
Ternya mau tutup.
Thanks informasinya gan :)

Balas

Dari sini biasa aja mas lancar. Coba clear history dan cache internetnya. kemudian restart browsernya...

Balas

Iya saya juga pernah coba di Google Site...tapi lebih enak di Google Drive. Apalagi pakai Google Drive for PC...lebih gampang upload filenya...

Balas

Iya satu-satunya cara yg masih bisa dilakukan dg upload file di Google Code yaitu pakai TortoiseSVN...

Balas

terimakasih mas sudah bisa (akses blog sama upload di google drive), tadi sempat bingung, akses blog lain bisa tapi blog sendiri gak bisa, mf mas udah OOT

Balas

jadi penampakannya dalam penyimpanan akan seperti ini ya mas kompi?

<script src='Contoh yang sudah di upload' type='text/javascript'/>

Balas

Ya untuk file javascript seperti itu, yang penting url filenya harus seperti langkah ke-7

Balas

wah.. makasih mas, langsung aja diplaktekin (Kayak dokter aja) wkwkwkwkwk.... mas, mengapa tidak share cara simpan CSS dihosting dan cara pemasangannya?? terutama saya, masih kurang mengerti lagi, pasti sangat bermanfaat sekali.

Balas

Cara uploadnya sama saja, yang bedanya untuk link yg disimpan di edit HTML untuk css seperti ini

<link href='URL FILE HOSTING CSS' rel='stylesheet' type='text/css'/>

Balas

oh gitu, jadi misalnya kode CSS yang kita mau simpan di notepad, dengan kata akhir seperti apa mas, kalau javascript kan dengan .JS, jd kalau kode CSS harus dengan kata akhir seperti CSS ya? dan setelah di upload dan disimpan kembali pada ]]><b/skin> ya? maaf nih gerepotin lagi hehehehehe...

Balas

Ya...filenya dikasih extensi .css

Balas

Disimpannya di bawah skin aja.

Balas

oh gitu, terima kasih mas kompi akan saya coba, oh ya mas kompi, setelah saya simpan javascript google drive, tapi rasanya jalan blog seperti lelet, kok gitu ya? mohon mas kompi kalau ada waktu terjun ke TKP sebentar ya, dan berikan solusinya TQ...

Balas

mantap tutorialnya lengkap bnget.

mas cara merubah bidang posting gmn y?? cb cek blog saya ini. Saya pengen merubah bidang postingnya menjadi blog punya agan lanonadio dgn url http://lanonadio.blogspot.com/

tolong mas bantuannya..

Balas

intinya supaya 1 kolom gtw baris gitu...

Balas

Coba rubah tinggi dan lebarnya pada kode .post di kode ini

<style type='text/css'>
#kotak-posting{margin:10px 0 10px 10px}.breadcrumbs,#blog-pager{margin-right:10px}.post{margin:0 10px 10px 0 !important;float:left !important;width:292px;height:145px;overflow:hidden;display:inline}
</style>


lebarnya samakan dengan lebar pada kode #posting

Balas

Coba perhatikan ketika blog loading pada pojok kiri bawah, peramban harus membaca banyak gambar dulu. Memang begitu jika blog magazine yang menampilkan banyak gambar dan widget. Namun menurut saya yg memakai smartfreett, loding segitu cukup cepat untuk homepagenya. karena di postpage tidak sebanyak di homepage (gambar dan widgetnya) maka dipostpage saya rasa lebih cepat loadingnya.

Gini aja coba perhatikan waktu loading di pojok kiri bawah, ada ga url google drive yang dibacanya lama. Saya tidak melihatnya.

Balas

setelah saya lihat peramban yang mentranfer data dari (api.htmlobfuscator.com) sebenarnya itu alamat apa sih? yang membuat loading lama mungkin disini ya?

Balas

Kalau dilihat dari sini url itu tidak terlalu berpengaruh terhadap loading blognya, yang jelas banyaknya gambar yang ditampilkan itu yang cukup banyak pengaruhnya. Ditambah oleh widget "bagikan artikel ini" yang harus nyambung dulu ke fb, twitter, g+ dan addthis. Makanya saya sendiri menggantinya dengan widget sharing tanpa js, namun kelemahannya kita tidak bisa melihat berapa banyak yang like atau membagikan postinan kita.

Balas

pusing mas,bisa tolong gantiin gk?biar nanti saya tinggal timpah yang dahulunya mas,mohon..

Balas

BARUSAN DIRUBAH GAK BERHASIL GAN,MUNGKIN AKU SALAH NERAPIN NY KALI YH??

Balas

bang bisa dijelaskan cara penggunaannya :http://www.o-om.com/2013/06/bongkar-rahasia-optimasi-meta-tag-di.html.klo bisa dishare cara penempatannya yang benar...terima kasih :)

Balas

ohiya om maaf OOT, ane nyari tutor cara munculin tombol hapus di kotak komen blog belum nemu yg bener nih om, bisa bantu saya ga om caranya gimana? :|
blog saya abangcireng.blogspot.com

Balas

benar juga ya, akan saya koleksi kembali, terima kasih atas sarannya..

Balas

mas zakky@ jika ada pertanyaan OOT, di forum kompi saja, klik Out Of Topic, disana anda bisa bertanya tentang tutorial apapun

Balas

ga jadi om sudah bisa hehehe :3

Balas

makin topcer yah ?? :D

Balas

Keren tutornya sob... bisa di buat folder ga?

Balas

Akhirnya bisa mendarat juga kang hehehe....
Iya bisa kang... ada juga Google Drive untuk PC-nya biar lebih gampang upload filenya...

Balas

Wah , saya malah masih belum mengerti beginian mas .. hehe

Balas

googlecode masih bisa kok

Balas

Mas Saya punya Problem Google drive tidak bisa di akses berikut scrinshotnya:

http://4.bp.blogspot.com/-D090FyX1wcY/UcGc9kfeWdI/AAAAAAAAB9I/R7__OHJhlVw/s1600/google+drive.jpg

Balas

Dari sini normal mas, mungkin harus bersihin cache internetnya mas...

Balas

info yang menarik mas, saya belum pernah mencobanya, saya bungkus tuorialnya mas, bisa tak coba nanti...happy blogging

Balas

udah lama saya cari gan trimakasih untuk artikelnya gan...

Balas

Sudah bisa mas tapi triknya bukan kaya gini harus download google drive dulu ..

Balas

yA LEBIH SIMPLE LAGI PAKAI ITU, KITA TINGGAL COPY PASTE FILE YANG AKAN KITA UPLOAD KE FOLDER gOOGLE DRIVE

Balas

kalau untuk ngedit file yang udah diupload dimana ya?

Balas

Kalau ngedit file yang udah diupload seperti kode CSS misalnya, diedit dengan notepad kemudian save langsung di folder Google Drive di komputer kita. Syaratnya kita harus mendownload dan menginstall Google Drive untuk PC-nya kemudian sinkron-kan. Dengan itu jg proses upload file jg lebih gampang. kita tidak harus masuk ke Google Drive di internet cukup copy pasti di komputer kita ke folder Google Drive. Mau edit atau sharing dan lin-lain tinggal klik kanan di filenya.

Balas

IC.... mantep sob, barusan coba ngedit langsung doubleclick.. langsung masuk dreamweaver :)

Balas

Ya kang bisa juga dengan dreamweaver jika sudah menginstallnya...hehehe...lebih simple ya kang...

Balas

Harus dipraktekkan pasti lebih cepat ngerti...

Balas

Makasih infonya mas sangat membantu, sebagian code sudah saya simpan di google drive dan alhamdllh berhasil, yang sy mau tanyakan gini mas klo memakai software google drive untuk PC apa aman nggk klo misalnya PC kena virus atau rusak pastinyakan software yg ada didlm ikut rusak, misalkan laptop atau PC di Instal apa code yg didlm tidak berpengaruh pada blog kita?

Balas

Hmmm...kalau masalah seperti itu saya belum tahu ya...soalnya saya sendiri belum ngalamin dan mudah2an jangan hehehe...saya cari dulu informasinya...semoga ada yang bisa jawab...

Balas

aku baru coba trik ini mas ... cuma satu kata........ keren loading lebih cepat

Balas

Iya mas...sudah saya coba lumayan enteng...hehehe...

Balas

waah terima kasih mass, setelah berpikir keras akhirnya berhasil juga haha

Balas

Iya mas, dengan usaha tentunya akan berbuah hasil...

Balas

Mantab bang bros, untung saya ga punya banyak file js ataupun yang lainya

Balas

mas saya ke google drive terus mau upload ko ngga bisa ya... ngga muncul tulisan file... apa eror ya mas..

Balas

ciee... yang atu mromosiin google drive yang atu lagi google code. makasih om tutorialnya :D

Balas

Mungkin dari browsernya mas Febri...

Balas

Thank's mas bro, sangat bermanfaat,,

Balas

Langsung menuju OOT aja ni kayaknya,

Balas

mas kompi, saya mau tanya kalau yang disimpan keseluruhan isi template itu bisa nggak ?

Balas

Bisa juga mas, misalnya untuk demo dan lain-lain, namun tidak dianjurkan untuk blog yang kita pakai.

Balas

Silahkan mas :D

Balas

mas ko engga bisa ganti link/tautannya sih???

Balas

mas broo bisa bantu aku engak..?
klo bisa aku mintak tolong ajari cara meyambung wesite yang dibuat dari html suspaya terkonek ke internet. itu bagai manaya, mohon bantuanya ya.

Balas

Keren gan infonya. saya langsung pake trik ini di blog saya untuk membuat HTML Editor Online tapi menggunakan blogspot. Thank berat gan....

Balas
Add Comment

Komentar dengan link promo akan masuk spam.

Gunakan konversi tool jika ingin menyertakan kode atau gambar.


image
How to style text in Disqus comments Top Disqus Commentators
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Box

How to get ID DISQUS - http://disq.us/p/[ID DISQUS] - lihat di sini

strong em u strike
pre code pre code spoiler
embed

Like Kompi Ajaib? Keep us running by whitelisting Kompi Ajaib in your ad blocker.

This is how to whitelisting Kompi Ajaib in your ad blocker.

Thank you!

×
×
×