Cara Membuat Tools Encrypt atau Encode HTML JavaScript di Blogger

Cara Membuat Tools Encrypt atau Encode HTML JavaScript di Blogger

Blogger Tools

SobatMasbro

September 05, 2020

SobatMasbro - Encrypt atau Encode adalah istilah yang berarti rahasia, rahasia memiliki definisi yaitu segala sesuatu yang sengaja disembunyikan tanpa ada satupun orang lain yang mengetahuinya. Encrypt dalam bahasa program artinya mengubah data menjadi rahasia, ada beberapa faktor yang menyebabkan data harus dirahasiakan contoh sederhananya agar data milik kita tidak ada orang lain yang menambah atau mengurangi bahkan mengubah data tersebut tanpa sepengetahuan kita sebagai pemiliknya.

HTML, JavaScript dan CSS merupakan bahasa programan yang wajib digunakan menampilkan atau membuat sebuah konten, namun jika kita akan membagikannya kepada orang lain alangkah bagusnya kita encrypt scriptnya terlebih dahulu. Mengapa? agar mereka tidak menambah, mengurangi atau mengubah script yang kita buat tanpa seizin dari pembuatnya atau hak cipta. Jika ada yang berusaha untuk mengubahnya merekapun akan kesulitan karena encrypt script ini mengubahnya menjadi abstrak.

Kali ini saya akan membagikan kepada sobat Cara Membuat Tools Encrypt atau Encode HTML CSS JavaScript dengan bantuan fungsi unescape() yang tedapat pada fungsi JavaScript. Dengan fungsi tersebut, sobat cukup membuat kode escape dan JavaScript sebagai pemanggil  fungsi unscape.

Jika sobat hanya ingin Meng-Encrypt script saja, silahkan encrypt disini. Namun jika sobat ingin membuatnya tools encrypt ini, silahkan ikuti langkah-langkah berikut.

Tools Encrypt ini support untuk

• HTML
• JavaScript
• CSS, dan lainnya. (yang lain belum saya coba)

Membuat Tools Encrypt/Encode Diblogger

• Buka blogger.com > Halaman > Halaman Baru
• Beri judul Encrypt Tool atau terserah sobat
• Klik bagian HTML bukan Compose
• Copy dan Paste script dibawah ini

<div class="container">
  <div class="browser">
    <div class="mantap">
      <div class="controls">
        <button class="btn close"></button>
        <button class="btn minimize"></button>
        <button class="btn fullscreen"></button>
      </div>
    </div>
    <div class="viewport">
     <p style="text-align: center;padding:12px;">
<form name="pageform" class="pageform" onsubmit="return doencrypt(this);">
<textarea class="husni-textarea" id="husni-textarea" cols="38" name="code" rows="11" placeholder="/* Paste atau Tempel scriptnya disini... */" spellcheck="false" wrap="virtual"></textarea></p>
<span id="encrypted1"></span>
<input  class="tombol-konversi" onclick="doencrypt(pageform);" type="submit" value="Encrypt">
<input  class="tombol-konversi" onclick="javascript:eraseText();" type="button" value="Delete">
<input class="tombol-konversi" name="sac" onclick="sandc(pageform);" type="button" value="Select All">
 - - <u>Created by : </u><a href="#" target="_blank">Blog Sobat Masbro</a>
     <p style="text-align: center;padding-top:12px;">
<textarea class="husni-textarea" id="husni-hasil" cols="38" readonly="readonly" name="ecode" rows="11" placeholder="/* --- Hasil Encrypt--- */" spellcheck="false" wrap="virtual"></textarea></p>
<script src="https://raw.githack.com/sobatmasbro/blogger/master/js/encryptcode.js"></script>
<style type='text/css'>
  .container {
}
.browser {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
}
.browser .mantap{
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px   6px rgba(0,0,0,0.23);
  background-color: #d9d9d9;
  border-radius: 5px 5px 0 0;
  height: 2.5em;
}
button, button[disabled]:active {
    background-color: #464646;
    font: bold 11px Tahoma,Verdana,Arial,sans-serif;
    color: #FFF;
    border: medium none;
    border-radius: 3px;
    cursor: pointer;
    padding: 5px 10px;
}
.browser .mantap .controls {
  line-height: 1.25em;
  padding: 0.625em 0;
}
.browser .mantap .controls .btn {
    border: medium none;
    border-radius: 100%;
    display: block;
    float: left;
    height: auto;
    margin-left: 0.5em;
    outline: medium none;
    width: 0px;
    padding: 7px;
}
.browser .mantap .controls .btn.close {
  background-color: #e74c3c;
}
.browser .mantap .controls .btn.minimize {
  background-color: #f1c40f;
}
.browser .mantap .controls .btn.fullscreen {
  background-color: #2ecc71;
}
.browser .viewport {
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px   6px rgba(0,0,0,0.23);
  background-color: #f5f5f5;
  border-radius: 0 0 5px 5px;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.tombol-konversi {
cursor: pointer;
    text-align: center;
    display: inline-block;
    color: #fff;
    font-size: 12px;
    margin: 0;
    padding: 12px;
    background-color: #0091ea;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.26);
    border-radius: 3px;
    border: 0;
    width: auto;
}
.pageform {
    padding-right: 12px;
    padding-bottom: 12px;
    padding-left: 12px;
}
  </style>
</p><div style="clear: both;"><p></p>
       </div></div>
  </div>
</div>

• Selesai Publikasikan
• Lihat hasilnya dan tes juga ya

• DEMO

Gimana sob? Mudahkan? Cukup sekian tutorial Cara Membuat Tools Encrypt atau Encode HTML JavaScript di Blogger. Jika ada yang ditanyakan silahkan komentar dibawah ini. Terimakasih

SobatMasbro September 05, 2020