Multiple Function Web Tools (MIFET)

Multiple Function Web Tools atau MIFET adalah kumpulan web tools dari CodeFlare yang dirancang untuk membantu blogger dan pengguna yang sering bekerja dengan HTML, CSS, JavaScript maupun teks. Berbagai pekerjaan yang biasanya membutuhkan beberapa website atau aplikasi berbeda dapat dilakukan melalui satu editor.

MIFET menyediakan fungsi untuk melakukan parse dan unparse HTML, minify dan beautify CSS, obfuscator JavaScript, konversi binary, efek teks, editor kode, pengolahan file lokal hingga pengujian kode secara langsung. Karena seluruh fitur dikumpulkan dalam satu antarmuka, aktivitas editing kode menjadi lebih praktis.

CODEFLARE WEB TOOLS

Multiple Function Web Tools dalam Satu Editor

MIFET menggabungkan berbagai fungsi pengolahan kode dan teks ke dalam satu workspace sehingga cocok digunakan untuk editing HTML, CSS, JavaScript maupun aktivitas blogging sehari-hari.

HTML Tools CSS Tools JavaScript Text Editor Responsive

Informasi Singkat
MIFET merupakan tool berbasis browser. Sebagian fungsi seperti clipboard, pembukaan file, popup dan akses tertentu dapat bergantung pada izin serta kebijakan keamanan browser yang digunakan.

Coba Multiple Function Web Tools MIFET

Tool dapat langsung digunakan melalui area di bawah. Masukkan kode atau teks ke editor, kemudian pilih fungsi yang diperlukan dari menu MIFET.

MIFET Workspace WEB TOOL

Apa Saja yang Bisa Dilakukan MIFET?

MIFET tidak hanya berfungsi sebagai editor teks. Di dalamnya terdapat beberapa utilitas yang membantu ketika membuat atau memodifikasi template, widget dan kode artikel Blogger.

Parse & Unparse HTML Mengubah karakter khusus HTML menjadi entity dan mengembalikannya ke format awal.

Minify CSS Meringkas kode CSS sehingga struktur kode menjadi lebih compact.

Beautify CSS Merapikan kembali kode sehingga lebih nyaman dibaca dan diedit.

JavaScript Obfuscator Mengubah bentuk source JavaScript agar tidak mudah dibaca secara langsung.

DeObfuscator Membantu melakukan proses kebalikan terhadap format obfuscation yang didukung tool.

Text Editor Editor ringan untuk menulis dan melakukan berbagai manipulasi terhadap teks.

Binary Converter Mengubah teks menjadi representasi binary dan mengembalikannya menjadi teks.

Image to ASCII Mengolah gambar menjadi representasi karakter atau ASCII art.

Try Run Code Menguji kode HTML atau JavaScript langsung dari area editor.

Google Search Mengirim teks atau kata yang dipilih untuk dicari melalui Google.

Translate Membantu menerjemahkan teks menggunakan layanan Google Translate.

Copy, Cut & Paste Fungsi editing dasar untuk mempercepat pengolahan teks maupun source code.

Kelebihan MIFET untuk Blogger

Konsep utama MIFET adalah All in One Web Tools. Blogger tidak perlu terus berpindah dari satu website ke website lainnya hanya untuk melakukan pekerjaan sederhana terhadap source code.

• Memproses HTML, CSS, JavaScript dan teks dari satu workspace.
• Membantu mempercepat proses pembuatan dan modifikasi widget Blogger.
• Memiliki fungsi parsing HTML yang berguna ketika membuat tutorial kode.
• Tersedia minify dan beautify CSS.
• Memiliki fungsi obfuscator dan deobfuscator.
• Menyediakan manipulasi teks seperti reverse text dan perubahan huruf.
• Dapat membuka file lokal untuk diedit melalui browser pada fungsi yang tersedia.
• Mempunyai fungsi penyimpanan dan printing.
• Mempunyai fitur pengujian kode melalui Try Run Script, Code dan HTML.
• Dapat digunakan sebagai editor teks ringan ketika sedang mengelola blog.

Tips: Sebelum mengubah kode template Blogger, tetap buat backup template terlebih dahulu. Tool editor dapat membantu mengolah kode, tetapi kesalahan struktur HTML atau JavaScript tetap dapat menyebabkan widget maupun template tidak berjalan normal.

Cara Menggunakan Multiple Function Web Tools

1 Masukkan kode atau teks

Paste source HTML, CSS, JavaScript atau teks ke dalam editor MIFET.

2 Pilih bagian tertentu bila diperlukan

Beberapa fungsi dapat digunakan pada teks yang dipilih atau terhadap seluruh isi editor.

3 Pilih fungsi MIFET

Gunakan Parse, Minify, Beautify, Obfuscator, Reverse Text atau fungsi lainnya sesuai kebutuhan.

4 Periksa hasil

Pastikan hasil konversi sesuai dengan source code yang ingin digunakan.

5 Salin hasil

Copy hasil pengolahan kemudian gunakan kembali pada artikel, widget atau template.

Penjelasan Menu dan Fungsi MIFET

New

Membuat area kerja baru dengan membersihkan data yang sedang berada di editor.

Open New File

Membuka data file dari media penyimpanan lokal untuk diproses menggunakan editor.

Open URL

Membantu membuka sumber URL untuk kemudian digunakan sebagai sumber data editing.

Save

Digunakan untuk menyimpan data teks atau hasil pekerjaan yang terdapat pada editor.

Print

Membuka fungsi pencetakan terhadap isi editor melalui fasilitas printing browser.

Read Only

Mengunci editor sementara untuk mengurangi risiko isi teks berubah secara tidak sengaja.

Undo

Mengembalikan perubahan editor ke kondisi sebelumnya jika fungsi mendukung histori perubahan.

Redo

Mengembalikan kembali perubahan setelah menjalankan perintah Undo.

Cut

Memotong bagian teks yang dipilih untuk digunakan kembali melalui clipboard.

Copy

Menyalin source code atau teks tanpa menghapus data dari editor.

Paste

Menempatkan data clipboard ke dalam editor sesuai posisi kursor.

Delete

Menghapus bagian kode atau teks yang sedang dipilih.

Select All

Memilih seluruh karakter yang terdapat di dalam editor.

Comment HTML

Membantu menambahkan struktur komentar pada kode HTML.

Comment Code

Membantu menambahkan karakter komentar pada CSS atau JavaScript.

Script Tag

Menyisipkan struktur tag script HTML ke editor secara lebih cepat.

Style Tag

Menyisipkan struktur tag style yang biasa digunakan untuk CSS internal.

SEO Image Tag

Membantu menyiapkan struktur kode gambar HTML untuk kebutuhan artikel atau halaman.

Parse dan Unparse HTML

Fitur Parse merupakan salah satu fungsi yang cukup berguna untuk pengguna Blogger. Ketika ingin menampilkan contoh source HTML di dalam sebuah artikel, beberapa karakter tertentu perlu dikonversi menjadi HTML entity agar browser menampilkannya sebagai teks dan bukan menjalankannya sebagai markup.

Sebaliknya, fitur UnParse digunakan untuk mengembalikan hasil parsing tersebut ke bentuk source yang dapat dibaca kembali sebagai kode HTML.

Aktifkan opsi Allow Double Encoding hanya ketika memang membutuhkan proses encoding tambahan. Untuk penggunaan biasa, periksa kembali hasil parsing sebelum memasukkannya ke template.

Minify dan Beautify CSS

Minify CSS digunakan untuk meringkas struktur CSS dengan mengurangi karakter yang tidak diperlukan dalam tampilan kode. Hasilnya lebih compact sehingga cocok digunakan ketika ingin merapikan distribusi sebuah widget.

Sementara Beautify CSS melakukan hal sebaliknya. Kode yang sebelumnya padat dibuat menjadi lebih terstruktur sehingga setiap selector dan property menjadi lebih mudah dibaca ketika melakukan debugging atau pengembangan.

JavaScript Obfuscator dan DeObfuscator

Fitur Obfuscator mengubah bentuk source JavaScript sehingga struktur aslinya tidak langsung mudah dibaca. Fungsi semacam ini berguna ketika source akan didistribusikan, tetapi perlu dipahami bahwa obfuscation bukan sistem keamanan absolut karena kode tetap harus dapat diproses oleh browser pengguna.

DeObfuscator digunakan sebagai fungsi kebalikannya untuk format yang dapat diproses oleh MIFET.

Text Effect dan Binary Converter

MIFET juga mempunyai beberapa fungsi manipulasi teks yang dapat digunakan di luar kebutuhan coding.

• Reverse Text untuk membalik susunan teks.
• Reverse Word untuk melakukan manipulasi terhadap kata atau karakter.
• Reverse Each Word untuk membalik bagian teks per kata.
• Upside Down untuk menghasilkan bentuk teks terbalik.
• Capslock untuk membantu konversi huruf besar dan kecil.
• Numlock / Binary untuk mengubah teks ke bentuk binary atau melakukan proses sebaliknya pada fungsi yang tersedia.

Try Run Script, Code dan HTML

Bagian ini dapat digunakan ketika ingin melihat hasil source code tanpa harus langsung memasangnya di template Blogger.

• Try Run Script untuk pengujian JavaScript sederhana.
• Try Run Code untuk kombinasi kode HTML dan script.
• Try Run HTML untuk mencoba struktur HTML yang lebih lengkap.

Jangan menjalankan JavaScript yang berasal dari sumber tidak dikenal. Periksa terlebih dahulu isi source code sebelum menggunakan fitur pengujian script.

Panel Informasi Editor

MIFET mempunyai beberapa panel status yang membantu melihat kondisi editor dan posisi kursor.

CurrentLine Menampilkan posisi baris kursor yang sedang aktif.

Position Memberikan informasi posisi karakter atau kursor di editor.

TotalLine Memberikan informasi mengenai jumlah atau posisi baris dalam editor.

Character Panel informasi yang berkaitan dengan jumlah atau pemilihan karakter.

Capslock Digunakan sebagai panel dan shortcut pengolahan uppercase atau lowercase.

Numlock Dapat digunakan pada fungsi konversi teks dan binary yang disediakan MIFET.

Riwayat Pengembangan MIFET

Berikut sebagian riwayat perubahan versi MIFET yang menjadi bagian dari pengembangan tool CodeFlare.

Versi 1.02 Beta Release – Revisi 8

• Penambahan Obfuscator dan DeObfuscator.
• Penambahan fungsi UpperCase dan LowerCase.
• Penambahan konversi Binary.
• Perbaikan minor pada core code.

Versi 1.02 Beta Release – Revisi 7

• Penambahan fungsi tombol pada panel informasi.
• Perbaikan sistem select.
• Perbaikan fungsi cut, copy dan paste.
• Perbaikan minor pada core code.

Versi 1.02 Beta Release – Revisi 6

• Penambahan tombol pada panel action.
• Perbaikan text editor.
• Perbaikan fungsi Undo dan Redo.
• Perbaikan minor pada core code.

Cara Memasang MIFET di Blogger

Selain digunakan langsung di CodeFlare, struktur MIFET juga menyediakan menu instalasi untuk membantu pengguna yang ingin memasang tool pada halaman Blogger.

1 Login ke Blogger

Masuk ke dashboard blog yang akan digunakan.

2 Buka menu Halaman

Pilih menu Pages/Halaman kemudian buat halaman baru.

3 Beralih ke mode HTML

Gunakan HTML View jika ingin memasukkan struktur HTML maupun JavaScript.

4 Buka menu Install pada MIFET

Pilih menu Help kemudian Install untuk melihat kode pemasangan yang disediakan tool.

5 Copy kode instalasi

Salin kode MIFET kemudian paste ke halaman Blogger yang telah dibuat.

6 Publish dan lakukan pengujian

Terbitkan halaman kemudian cek fungsi tool melalui desktop maupun perangkat mobile.

Beberapa template Blogger mempunyai CSS atau JavaScript sendiri yang dapat memengaruhi tampilan sebuah web tool. Bila terjadi perbedaan tampilan, periksa konflik selector CSS, library JavaScript dan struktur template.

FAQ Multiple Function Web Tools

Apakah MIFET hanya untuk Blogger?

Tidak. Walaupun dikembangkan dengan kebutuhan blogger sebagai salah satu fokus utamanya, berbagai fungsi pengolahan HTML, CSS, JavaScript dan teks dapat digunakan untuk kebutuhan web secara umum.

Apakah MIFET bisa digunakan untuk parse HTML?

Ya. Salah satu fungsi MIFET adalah Parse dan UnParse yang dapat membantu ketika menyiapkan contoh kode HTML untuk sebuah tutorial.

Apakah terdapat CSS Minifier?

Ya. MIFET menyediakan fungsi Minify CSS serta Beautify CSS untuk membantu meringkas atau merapikan struktur CSS.

Apakah MIFET memiliki JavaScript Obfuscator?

Ya. Fitur Obfuscator tersedia bersama DeObfuscator. Namun obfuscation sebaiknya dipahami sebagai penyamaran struktur source code, bukan sistem keamanan absolut terhadap JavaScript.

Kenapa fungsi clipboard atau file kadang berbeda di browser?

Browser modern menerapkan kebijakan izin dan keamanan terhadap clipboard, file lokal, popup dan fitur tertentu. Karena itu perilaku beberapa menu dapat berbeda tergantung browser, perangkat dan izin yang diberikan pengguna.

Apakah aman menjalankan JavaScript melalui MIFET?

Gunakan hanya source code yang Anda pahami atau berasal dari sumber tepercaya. Hindari menjalankan script asing sebelum memeriksa isi dan fungsinya.

Simpan MIFET untuk digunakan kembali

Jika sering mengolah kode Blogger, bookmark halaman ini supaya MIFET lebih mudah dibuka ketika dibutuhkan.

Ctrl + D

Kesimpulan

Multiple Function Web Tools (MIFET) merupakan salah satu utility CodeFlare yang menggabungkan berbagai kebutuhan pengolahan source code dan teks dalam satu editor. Kehadiran Parse HTML, CSS Minifier, Beautifier, JavaScript Obfuscator, Binary Converter, Text Effect dan pengujian kode menjadikannya praktis untuk aktivitas blogging maupun pengembangan widget sederhana.

Untuk pekerjaan yang berkaitan dengan template Blogger, sebaiknya selalu simpan backup template terlebih dahulu dan periksa kembali hasil source code sebelum diterapkan pada blog produksi.

Butuh Widget atau Web Tools Custom?

CodeFlare melayani pembuatan website Blogger, custom widget, modifikasi template, perbaikan script dan pembuatan web tools sesuai kebutuhan. Pembuatan widget sederhana dapat dimulai dari sekitar Rp50 ribu, sedangkan biaya akhir menyesuaikan tingkat kerumitan desain serta kompleksitas script.

Lihat Jasa CodeFlare Jelajahi CodeFlare