tRikSonic
Tema

HTML section Tag

Terakhir diperbarui : 22 Mei 2018 - 11.43
Penjelasan html <section> : Element <section> mempunyai defenisi sebagai bagian dari sebuah dokumen, misal bab pada sebuah artikel, part sebuah content yang topik pembahasannya keluar dari bahasan sebelumnya. Dalam Penulisan pada html, element <section> dianjurkan didalamnya terdapat element html heading <h1> - <h6> , karena tag heading pada element <section> menunjukan judul atau title dari element <section> tersebut. Ilustrasi pertama adalah : Sebuah buku mempunyai bagian yang terdiri dari kata pengantar, pembukaan, bab 1 dan dst, dan penutup. Nah bagian itu disebut <section> , dan untuk judul pada bagian atas itu adalah heading <h1> - <h6> . Ilustrasi kedua adalah : Misal anda penulis pada sebuah blog, dan menulis konten berjudul Cara membuat robot, dan pada kontent tersebut terdapat tahap-tahap pembuatan, tahap pertama mengumpulkan bahan beserta penjelasannya, tahap kedua cara merakit dan penjelasannya,...
Baca selengkapnya

HTML script Tag

Terakhir diperbarui : 22 Mei 2018 - 11.45
Tutorial HTML <script> HTML script Tag - belajar html script, element <script> digunakan sebagai wadah penulisan sebuah skrip code atau javascript. Contoh HTML <script> : < p id = "demo" > Klik button dibawah </ p > < button onclick = "demoScript();" > Generate </ button > < script > function demoScript ( ) { document .getElementById( "demo" ).innerHTML = "<strong>Inner HTML<\/strong>" ; alert ( "Javascript Test" ); } </ script > <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <p id="demo">Klik button dibawah</p> <button onclick="demoScript();">Generate</button> <script> function demoScript () { document.getElementById("demo").innerHTML = "<strong>Teks Tebal<\/...
Baca selengkapnya

HTML progress Tag

Terakhir diperbarui : 22 Mei 2018 - 11.48
Tutorial HTML <progress> HTML progress Tag - belajar html progress, element <progress> dipergunakan untuk menampilkan progres yang sedang berlangsung. Element <progress> ini biasanya digunakan untuk bar loading page, menampilkan status upload file berupa bar dan lain sebagainya. Element ini dikususkan untuk sistem kerja yang sedang berlangsung, bukan untuk mengukur sebuah hasil yang sudah diketahui hasilnya, untuk penggunaan hasil ukuran gunakan element <meter> . Selengkapnya mengenai html <meter> Dalam penggunaannya pada html, element <progress> sangat erat terkait penggunaannya dengan javascript sebagai kontrol element <progres> . Attribute HTML <progress> : value Attribute value pada HTML <progress> ini menentukan jumlah atau nilai progress yang ditampilkan. Nilai atau value attribute ini adalah Nomor / angka max Attribute max pada HTML <progress> ini menentukan jumlah Maksimal dari nilai prog...
Baca selengkapnya

HTML pre Tag

Terakhir diperbarui : 22 Mei 2018 - 11.53
Tutorial HTML <pre> HTML pre Tag - belajar html pre. Element <pre> mempunyai definisi sebagai preformatted text atau teks yang terformat. Element <pre> memiliki sifat apa adanya, maksudnya seperti apapun teks yang ditulis didalamnya akan menampilkan sama dengan apa yang ditulis, baik jumlah space dan penggunaan enter , diluar penggunaan element html. Dalam penulisan pada html, elemen <pre> bisa ditulis didalamnya element html lainnya seperti : <code> , <span> , <kbd> , <b> , <i> , <u> , <var> , <button> , dan lain lain yang terkait dengan teks. Beberapa penggunaan html <pre> yang banyak dipakai oleh blogger adalah tempat atau wadah untuk menuliskan menuliskan code html , css , javascript , PHP code dan bahasa computer code lainnya, serta blog yang membahas chord guitar atau pun lirik lagu , blog yang membahas puisi , syair dan beberapa blog yang membahas ilmu pengetahuan khususnya matematik...
Baca selengkapnya

HTML option Tag

Terakhir diperbarui : 23 Mei 2018 - 08.09
Tutorial HTML <option> HTML option Tag - belajar html option. Element <option> mempunyai definisi sebagai daftar list pilihan yang digunakan oleh element html <select> . Dalam penulisannya pada html option ditulis sebagai anak element dari <select> , <datalist> , dan <optgroup> Attribute HTML <option> value Attribute value pada html option digunakan untuk menentukan nilai atau data asli sebagai kontrol dari suatu fungsi, misal dalam penggunaan javascript , kontrol data pengiriman ke server data dan lain sebagainya. Jika attribute value tidak disebutkan maka secara default akan mengambil data teks yang ada didalam element <option> Contoh dengan mengikutsertakan attribute value < b > Pilih Provinsi : </ b > < select > < option value = "jabar" > Jawa Barat </ option > < option value = "kalteng" > Kalimantan Tengah </ option > < option value = "s...
Baca selengkapnya

HTML optgroup Tag

Terakhir diperbarui : 23 Mei 2018 - 09.15
Tutorial HTML <optgroup> HTML optgroup Tag - belajar html optgroup. Element optgroup mempunyai definisi sebagai option grup, jadi element html <optgroup> ini mempunyai fungsi sebagai pembungkus dari element <option> . Contoh HTML <optgroup> < select > < optgroup label = "Font-size pixel" > < option value = "13px" > 13px </ option > < option value = "14px" > 14px </ option > < option value = "15px" > 15px </ option > </ optgroup > < optgroup label = "Font-size Percent" > < option value = "100%" > 100% </ option > < option value = "150%" > 150% </ option > < option value = "200%" > 200% </ option > </ optgroup > </ select > <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <tit...
Baca selengkapnya

HTML ol Tag

Terakhir diperbarui : 23 Mei 2018 - 09.31
Tutorial HTML <ol> HTML ol Tag - belajar html ol, element ol mempunyai definisi sebagai ordered list, biasa juga disebut numbered list. Dalam penulisan di html, element <ol> selalu diikuti element html <li> , sebagai element pembuat daftar list. Element html <ol> didalam penulisannya bisa ditulis secara berulang, tanpa adanya batasan, maksudnya di dalam element <ol> bisa ditulis lagi element <ol> lainnya, asal dalam penulisannya dilakukan dengan benar. Secara standar element <ol> akan menghasilkan output berupa list dengan angka atau nomor, tapi dengan menggunakan tambahan attribute semua dapat dirubah sesuai dengan keinginan. Contoh HTML <ol> < h3 > Daftar isi Buku </ h3 > < ol > < li > Kata Pengantar </ li > < li > Pendahuluan </ li > < li > Pembahasan </ li > < li > Kesimpulan </ li > < li > Daftar pustaka </ li > </ ol ...
Baca selengkapnya

HTML noscript Tag

Terakhir diperbarui : 23 Mei 2018 - 09.49
Tutorial HTML <noscript> HTML noscript Tag - belajar html noscript. Element noscript mempunyai definisi sebagai konten alternatif, dimana jika user / pengunjung blog / website mematikan fungsi javascript pada browser atau browser yang digunakan tidak mendukung penggunaan javascript, maka element <noscript> akan menjalankan fungsinya, yang disesesuaikan lagi dengan apa yang ditulis didalam element noscript itu sendiri. Element <noscript> , akan sangat berguna untuk pemilik blog/website yang dalam pengoperasian / penyajian sebuah konten terkait dengan penggunaan javascript. Contoh HTML <noscript> Contoh berikut untuk peletakannya didalam html <head>...</head> , Perlu diketahui jika element <noscript> diletakan didalam element head ada beberapa element yang diperbolehkan dan berjalan baik untuk browser yaitu : <meta> <link> , dan <style> Contoh dengan element <meta> <!DOCTYPE html> < html > ...
Baca selengkapnya

Artikel terbaru berdasarkan Label

Terakhir diperbarui : 23 Mei 2018 - 10.01
Cara memasang widget artikel terbaru berdasarkan label di blogger - kali ini TrikSonic akan share tutorial cara membuat atau memasang widget artikel terbaru berdasarkan label. Tutorial yang saya bagikan kali ini hanya menampilkan judul artikel saja tanpa gambar atau image, jadi akan mengurangi beban pada saat loading page. Javascript dan html : Copy dan pastekan kode berikut pada template atau widget html/javascript, disesuikan dengan keperluan < div id = "artikel-terbaru" > < ol > < script > var jumlahnewpost = 5 ; //jumlah post yang ingin ditampilkan var create = true ; </ script > < script > //<![CDATA[ function showrecentposts ( e ) { for ( var t = 0 ; t < jumlahnewpost; t++) { var r, n = e.feed.entry[t], i = n.title.$t; if (t == e.feed.entry.length) break ; for ( var l = 0 ; l < n.link.length; l++) if ( "alternate" == n.link[l].rel) { ...
Baca selengkapnya