Cara Gampang Menghosting File Js Di Google Drive

Sebenarnya sudah banyak tutorial di Google ihwal cara hosting file di Google Drive, namun tampaknya masih ada blogger yang belum mengerti betul cara upload file di Google Drive. Untuk itu sekarang saya mencoba memperjelas dan mempermudah cara hosting file khususnya file js untuk kepentingan blog ibarat untuk defer javascript dan lainnya.

Untuk menghosting file js di Google Drive silahkan ikuti langkah-langkahnya di bawah ini.

1. Langkah Pertama
Untuk menghosting file js di Google Drive, tentunya langkah pertama yang harus dilakukan yaitu menyiapkan file js yang akan kita hosting. Sebagai contoh, kita akan menghosting sebuah javascript ibarat di bawah ini yang saya ambil dari tutorial memasang komentar Blogger, Disqus, dan Facebook.

 <script type='text/javascript'>
//<![CDATA[
var disqus_shortname="USERNAME DISQUS";
var disqus_url = disqus_blogger_current_url;

(function () {
    "use strict";
    var get_comment_block = function () {
        var block = document.getElementById('comments');
        if (!block) {
            block = document.getElementById('disqus-blogger-comment-block');
        }
        return block;
    };
    var comment_block = get_comment_block();
    if (!!comment_block) {
        var disqus_div = document.createElement('div');
        disqus_div.id = 'disqus_thread';
        comment_block.innerHTML = '';
        comment_block.appendChild(disqus_div);
        comment_block.style.display = 'block';
        var dsq = document.createElement('script');
        dsq.async = true;
        dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.body).appendChild(dsq);
    }
})();

!function(e,n,t){var o,c=e.getElementsByTagName(n)[0];e.getElementById(t)||(o=e.createElement(n),o.id=t,o.src="//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3",c.parentNode.insertBefore(o,c))}(document,"script","facebook-jssdk");

    var divs = ["disqus-box", "blogger-box", "facebook-box"];
    var visibleDivId = null;
    function toggleVisibility(divId) {
      if(visibleDivId === divId) {
        visibleDivId = null;
      } else {
        visibleDivId = divId;
      }
      hideNonVisibleDivs();
    }
    function hideNonVisibleDivs() {
      var i, divId, div;
      for(i = 0; i < divs.length; i++) {
        divId = divs[i];
        div = document.getElementById(divId);
        if(visibleDivId === divId) {
          div.style.display = "block";
        } else {
          div.style.display = "none";
        }
      }
    }

$(".commentbtn").click(function (e) {
$(this).addClass("btncurrent").siblings().removeClass("btncurrent");
});
//]]>
</script>

Perhatian: Ada juga isyarat javascript yang ditulis tanpa isyarat //<![CDATA[ di awal dan isyarat //]]> di final isyarat javascript-nya.

Untuk menciptakan file js dari javascript di atas, silahkan copy isyarat di di antara kode

 <script type='text/javascript'>
//<![CDATA[

dan kode

 //]]>
</script>

atau bila isyarat javascript-nya tanpa isyarat //<![CDATA[ di awal dan isyarat //]]> di final isyarat javascript, silahkan copy isyarat javascriptnya di antara isyarat <script type='text/javascript'> dan </script>. Sehingga dari isyarat javascript di atas, silahkan copy isyarat javascript ibarat yang saya marking di bawah ini.

 <script type='text/javascript'>
//<![CDATA[
var disqus_shortname="USERNAME DISQUS";
var disqus_url = disqus_blogger_current_url;

(function () {
    "use strict";
    var get_comment_block = function () {
        var block = document.getElementById('comments');
        if (!block) {
            block = document.getElementById('disqus-blogger-comment-block');
        }
        return block;
    };
    var comment_block = get_comment_block();
    if (!!comment_block) {
        var disqus_div = document.createElement('div');
        disqus_div.id = 'disqus_thread';
        comment_block.innerHTML = '';
        comment_block.appendChild(disqus_div);
        comment_block.style.display = 'block';
        var dsq = document.createElement('script');
        dsq.async = true;
        dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.body).appendChild(dsq);
    }
})();

!function(e,n,t){var o,c=e.getElementsByTagName(n)[0];e.getElementById(t)||(o=e.createElement(n),o.id=t,o.src="//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.3",c.parentNode.insertBefore(o,c))}(document,"script","facebook-jssdk");

    var divs = ["disqus-box", "blogger-box", "facebook-box"];
    var visibleDivId = null;
    function toggleVisibility(divId) {
      if(visibleDivId === divId) {
        visibleDivId = null;
      } else {
        visibleDivId = divId;
      }
      hideNonVisibleDivs();
    }
    function hideNonVisibleDivs() {
      var i, divId, div;
      for(i = 0; i < divs.length; i++) {
        divId = divs[i];
        div = document.getElementById(divId);
        if(visibleDivId === divId) {
          div.style.display = "block";
        } else {
          div.style.display = "none";
        }
      }
    }

$(".commentbtn").click(function (e) {
$(this).addClass("btncurrent").siblings().removeClass("btncurrent");
});
//]]>
</script>

Kemudian paste di NOTEPAD. Lalu klik sajian File di Notepad dan pilih option Save As, berikan nama file dengan ekstensi *.js contohnya kita beri nama contoh.js kemudian klik tombol Save. Saya contohkan pada video di bawah ini, silahkan lihat dengan full screen supaya lebih jelas.


Nah pada langkah pertama ini kita sudah mempunyai sebuah file js untuk kemudian kita upload di Google Drive.

2. Langkah Kedua
Setelah kita mempunyai file js, maka pada langkah kedua ini kita akan menghosting file js tersebut di Google Drive.

Silahkan saluran Google Drive dan login dengan akun Google Anda.

Kemudian silahkan buat folder gres khusus untuk hosting file-file js dengan klik tombol NEW di kiri atas kemudian pilih option Folder dan silahkan namai folder-nya dengan Hosting JS.

Setelah folder berhasil dibuat, silahkan klik kanan pada folder tadi dan pilih option Share, kemudian pada obrolan box yang muncul silahkan klik Advance di pojok kanan bawah obrolan box. Kemudian pada obrolan box berikutnya silahkan klik Change pada option Private - Only you can access dan pilih On - Public on the web kemudian klik tombol Save.

Kemudian pada obrolan box berikutnya silahkan copy URL di bab atas box yang biasanya otomatis sudah di-block jadi kita tinggal CTRL + C aja di keyboard kemudian klik tombol Done pada obrolan box tersebut dan paste URL tadi di notepad. Sebagai contoh, URL-nya akan ibarat di bawah ini.

https://drive.google.com/folderview?id=0Bz4YdwRI3rnCNk85QzV3N01RbFU&usp=sharing


Kode yang saya warnai merah pada URL di atas yaitu isyarat yang kita perlukan untuk langkah selanjutnya. Lalu buat URL ibarat di bawah ini.

https://googledrive.com/host/KODE ID FOLDER


Silahkan ganti KODE ID FOLDER dengan isyarat yang saya kasih warna merah dari langkah sebelumnya di atas sehingga menjadi ibarat di bawah ini.

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


Simpan URL yang barusan dibentuk alasannya yaitu akan kita perlukan pada langkah selanjutnya. Kita namai URL tadi dengan nama URL Folder Hosting JS.

Kemudian silahkan klik 2 kali pada folder Hosting JS yang kita buat di Google Drive tadi. Setelah terbuka silahkan upload file js yang kita buat tadi pada langkah pertama dengan klik tombol merah NEW di pojok kiri atas dan pilih option File Upload.

Nah untuk memanggil file yang kita hosting tadi, kita tinggal menambahkan nama file js yang kita upload tadi pada URL Folder Hosting JS yang kita buat pada langkah sebelumnya di atas sehingga akan ibarat di bawah ini.

https://googledrive.com/host/0Bz4YdwRI3rnCNk85QzV3N01RbFU/contoh.js

Nah URL tersebut yang kita sebut sebagai URL hosting js di Google Drive. Selanjutnya tinggal mengganti nama file js saja untuk memanggil file js lainnya yang diupload pada folder tersebut.

Selesan, gampang bukan? Semoga dapat dimengerti.

UPDATE

Sekarang Google sudah menutup hosting file pada Google Drive ibarat di atas. Silahkan gunakan alternatif lain ibarat Github atau Firebase.

Sumber https://www.kompiajaib.com/

0 Response to "Cara Gampang Menghosting File Js Di Google Drive"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel