Plugin Blade Codes mirip dengan Template Engine Laravel yang digunakan untuk mempermudah pembuatan kode yang kompleks, dan akan lebih berguna jika digunakan pada Shortcode Dinamis.
Plugin ini mungkin terlihat cukup rumit jika anda baru mengenal atau belum terbiasa dengan bahasa pemrograman.
Blade Codes dapat diterapkan di widget maupun postingan, namun dinonaktifkan fungsinya secara default untuk menghindari masalah kompatibilitas.
Cara mengaktifkan fungsi Blade Codes
Cukup mudah untuk mengaktifkan fungsi Blade Codes, anda cukup menggunakan shortcode statis {blade:true}.
Postingan
Untuk menerapkan di postingan, kode anda harus dibungkus pada tag noscript dan menambahkan {blade:true} yang diterapkan pada mode html, contoh :
<noscript>
{blade:true}
...kode anda disini...
</noscript>
Widget
Untuk menerapkan di widget (HTML/JavaScript), anda cukup menambahkan {blade:true} yang diterapkan pada konten, contoh :
{blade:true}
...kode anda disini...
Shortcode Dinamis
Di shortcode dinamis, anda tidak perlu menambahkan {blade:true}, karena telah diaktifkan secara default.
Fitur-fitur Blade Codes
Blade Codes memiliki banyak fitur atau fungsi, diantaranya: Variable, If Statements, Views, Loops, JavaScript, dan akan lebih banyak lagi.
Beberapa contoh dibawah ini diimplementasikan pada Shortcode Dinamis, saya harap anda membaca dokumentasi Panduan Shortcode Dinamis sebelum membaca lebih lanjut.
Variable
Variable berfungsi sebagai nilai default dari atribut jika atribut tersebut tidak ada, variable menggunakan identifikasi @var
Argumen
Argumen @var sebagai berikut @var attribute = value
attribute |
Nama atribut. Anda tidak boleh menggunakan nama true false null NaN undefined |
|
value | Isi dari atribut. |
Contoh
Shortcode [hello/] akan menghasilkan berikut :
<div style="background: blue">
Hello Blogger
</div>
Shortcode [hello color="green"/] akan menghasilkan berikut :
<div style="background: green">
Hello Blogger
</div>
If Statements
Anda dapat membuat If Statement menggunakan identifikasi @if @elseif @else @endif
Argumen
Argumen @if @elseif sebagai berikut @if statement @elseif statement
statement | Berisi pernyataan apakah benar atau salah. |
Contoh
Shortcode [hello style="italic"/] akan menghasilkan berikut :
<i>Hello Blogger</i>
Shortcode [hello style="underline"/] akan menghasilkan berikut :
<span>Hello Blogger</span>
Views
Anda dapat menampilkan kode anda hanya pada tipe halaman tertentu saja, ini seperti menggunakan <b:if cond="data:view.isHomepage"> di Editor HTML Template.
Untuk menggunakan fitur ini, gunakan identifikasi @view @endview
Argumen
Argumen @view sebagai berikut @view pagetype
pagetype |
Tipe string, tiap item dipisahkan dengan tanda | Contoh: "homepage|post" Maka kode hanya tampil di homepage dan post saja. Item yang tersedia :
|
Contoh
Shortcode [text/] yang diakses di halaman beranda akan menghasilkan berikut :
<p>Bagian awal</p>
<p>Teks tampil di homepage dan post</p>
<p>Bagian akhir</p>
Shortcode [text/] yang diakses di halaman pencarian akan menghasilkan berikut :
<p>Bagian awal</p>
<p>Bagian akhir</p>
Loops
Anda dapat membuat Loops menggunakan identifikasi @loop @endloop
Argumen
Argumen @loop sebagai berikut @loop array => item, index
array |
|
|
item | Berisi item tiap perulangan dari array | |
index |
Berisi angka berurutan dari angka 1 hingga perulangan berakhir. Argumen index tidak wajib, anda dapat menghapusnya jika tidak digunakan. |
Contoh
Shortcode [buah/] akan menghasilkan berikut :
<div>Nomor 1 : Apel</div>
<div>Nomor 2 : Jeruk</div>
Shortcode [kota list="Jakarta|Semarang|Surabaya"/] akan menghasilkan berikut :
<div>Jakarta</div>
<div>Semarang</div>
<div>Surabaya</div>
Shortcode [nomor/] akan menghasilkan berikut :
<div>Angka 1</div>
<div>Angka 2</div>
<div>Angka 3</div>
<div>Angka 4</div>
<div>Angka 5</div>
JavaScript
Anda tidak dapat menulis tag script secara langsung di Shortcode Dinamis, hal ini dapat mengacaukan algoritma sistem blade template Theme62.
Untuk menambah tag script di Shortcode Dinamis, anda dapat menggunakan blade JavaScript dengan identifikasi @js @endjs
Argumen
Argumen @js sebagai berikut @js src
src |
Tipe string atau url, digunakan jika menggunakan url script eksternal. Cara kerjanya mirip dengan <script src="..."></script> Argumen src tidak wajib, anda dapat menghapusnya jika tidak digunakan. |
Contoh
Shortcode [fa/] akan menghasilkan berikut :
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/js/all.min.js"></script>
Shortcode [test/] akan menghasilkan berikut :
<script>
var x = "Theme62";
console.log(x);
</script>