Minify - Cara Membuat Tool Minify di Blog Sendiri

Minify | Minify CSS | Minify HTML | JS Minify | JS CSS Minify | Cara Minify CSS |How To Minified JavaScript File |Minified Generator | Gow To Compress Javascript Code - Cara Membuat Tool Minify di Blog Sendiri.

Apa Itu Minify...?

Bahasa Sederhananya minify merupakan suatu cara untuk mengumpulkan semua elemen yang ada di blog (JS & CSS) dan kemudian menggabungkannya menjadi satu file. maka Selanjutnya file yang digabungkan tersebut akan dikompres dan menjadikannya lebih ringan. Hal ini akan meningkatkan kecepatan loading dari sebuah website (sr).

Berarti cara meningkatkan performa blog atau website adalah dengan cara minify css, html dan javascript,, yapp.. betul sekali.

Minify - Cara Membuat Tool Minify di Blog Sendiri

BagaiMana Cara Minify HTML...? 

Cara Minify HTML, Cara Minify CSS dan Cara Minify Js, Caranya ya dengan tool khusus untuk minify, dan biasnya di blog blog yang membahas seputar blogging cuman menyediakan Minify CSS saja dan jika mau minify html dan js itu tidak bisa.

Nah pada kesempatan baik ini admin bloggersukses.id akan membagikan tutorial cara membuat tool minify di blog sendiri atau cara memasang tool minify di blog sendiri, tentu minify ini sangat penting untuk anda karena sewaktu waktu anda akan sangat membutuhkan.

Cara membuat tool minify di blog

Berikut adalah cara membuat tool minify html, css dan js di blog denga mudah:

Langkah 1 : Masuk Blogger

Seperti biasa masuk dashboard blogger.com

Langkah 2 : Buat Halaman Baru 

Jika sudah masuk dashboard, kemudian pilih menu halaman terus klik halaman baru dan pilih mode editornya menjadi HTML (Bukan Compose) kemudian kasih Judul dan pastekan semua kode di bawah:


<style type="text/css">
#post-wrapper {width:100%;max-width:100%;margin:0 auto;text-align:left;float:none;background-position:center!important;}
#sidebar-wrapper{display:none!important;float:left;margin:0;}.post{width:95%;}
</style>
<textarea id='ta' spellcheck='false' placeholder="Minify HTML / CSS / JavaScript.."></textarea>
<center><button class="tmbl" id='bt'><span>&lt;/&gt;&nbsp;MINIFY</span></button></center>
<style type="text/css"> ::-webkit-selection { background: rgba(255, 186, 0, 0.48); } ::-moz-selection { background: rgba(255, 186, 0, 0.48); } ::-o-selection { background: rgba(255, 186, 0, 0.48); } ::selection { background: rgba(255, 186, 0, 0.48); } * { margin:0; padding:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; border:0; outline: none; } body { font-family: helvetica, sans-serif; } textarea { font-size: 16px; display: block; width: 100%; height: calc(100vh - 70px); padding: 20px; background: #fff; color: #1a1a1a;border: 5px solid rgba(0, 0, 0, 0.67);border-radius: 17px;box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.67);} .tmbl {margin-top: 20px;box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.67); width: 100%; height: 50px; cursor: pointer; background: linear-gradient(45deg,#2d82ea,#2d92ea,#2db1ea); background-size: 200% 200%; animation: Gradient 15s ease infinite; color: #fff; border: 1px solid transparent; padding: 6px 12px; font-size: 16px; line-height: 1.42857143; border-radius: 4px; user-select: none;}.tmbl.focus, .tmbl:focus, .tmbl:hover {color:#333;text-decoration:none;}</style>
<script type='text/javascript'> (function() { var ta = document.getElementById('ta'), bt = document.getElementById('bt'); function compress() { var v = ta.value; v = v.replace(/(>)?\s+/g, "$1 "); v = v.replace(/([\t\n\s\r]+)</g, "<"); ta.value = v; ta.focus(); ta.select() } bt.onclick = compress })();</script>

Langkah 3 : Simpan dan Lihat Hasil

Jika sudah diletakan klik tombol simpan dan jangan lupa kasih Deskripsi, sekarang silahkan lihat hasilnya atau lihat demo di bawah:

Demo

Nah jadi gimana gan tool minifynya keren kan punya pribadi lagi.

Baca Juga: Cara Membuat Unminify JS, CSS dan HTML di blog.

Penutup...

Jadi itulah tutorial cara membuat atau memasang tool minify di blog sendiri, gunkan tool ini dengan bijak seperti untuk minify kode css di template blogger anda.

Semoga bermanfaat dan terima kasih sudah berkunjung. jangan lupa ikuti blog bloggersukses.id untuk mendapatkan update artikel gartis.

Follow Me

Terima kasih jika sudah ikuti mimin do'ain agar sukses terusss, Aamiin....

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel