Web

mrfdn.com - Kali ini saya ingin membagikan tutorial tentang cara menampilkan data table dari Google Sheet ke HTML di Localhost. Di sini saya menggunakan GridJS untuk menampilkan data tersebut ke dalam tabel. Kenapa Gridjs? Karena fitur yang saya inginkan ada di sini, seperti: Pencarian Pagination Sort Fetch API dan lain-lain. Pertama, buatlah sebuah table sederhana di Google Sheet. misalnya seperti ini : Kemudian untuk membuatnya bisa diakses, tekan Share pada pojok kanan atas, lalu set menjadi Anyone. ...

There is a potential to earn additional income through web hosting even if you do not own your own servers. This presents a unique opportunity to make a profit with a low initial investment. You can get started in the hosting reseller business by purchasing a reseller account from the provider of your choice and then beginning to sell hosting through that account. It is important to keep in mind that in order to run a successful reseller hosting business, you will need to put in a lot of hard work and effort. ...

mrfdn.com - Halaman 404 adalah halaman yang berisi tentang informasi halaman tidak ditemukan pada sebuah situs yang diakses. Halaman ini bisa ditampilkan atau bisa juga tidak dengan cara melakukan redirect ke halaman lain jika memang url tidak terdapat pada situs. Di hugo kita bisa set halaman 404. Halaman ini nanti akan berfungsi sebagai penanda kepada user jika saja salah memasukan url. Isinya hanya sejumlah informasi bahwa halaman tidak ditemukan dan url link ke home / halaman utama. ...

mrfdn.com - Shortcode di hugo merupakan salah satu cara untuk memanggil elemen tertentu pada situs. Misalnya kita ingin membuat toc (term of service) di dalam artikel hugo, maka kita bisa dengan mudah memanggilnya dengan shortcode. Shortcode juga ditemukan di Wordpress. Tapi untuk membuat shortcode di WP cukup sulit, beda dengan HUGO dimana kita hanya perlu membuat file shortcode lalu memanggilnya di mana pun kita inginkan. Membuat shortcode TOC di Hugo ...

mrfdn.com - Archetypes di hugo merupakan sebuah folder yang berisi sebuah file default.md yang berfungsi sebagai konfigurasi frontmatter pada setiap postingan markdown yang dibuat. Contoh archetypes hugo yang saya gunakan saat ini : --- title: "{{ replace .Name "-" " " | title }}" date: {{ .Date }} url: /{{.File.TranslationBaseName}} tags: description: tulis deskripsi singkat di sini thumbnail: /uploads/url-gambar-thumbnail.jpg draft: true --- Baris kode di atas akan muncul setiap kali membuat sebuah postingan baru di hugo. ...

mrfdn.com - Pada artikel sebelumnya kita sudah berhasil menampilkan list artikel / konten yang terdapat pada blog hugo yang sedang dibuat. Pada artikel ini saya ingin menunjukkan cara untuk menampilkan setiap isi artikel tersebut melalui file single.html. Single.html adalah file yang bertugas untuk merender setiap halaman postingan yang terdapat pada folder content. Silahkan edit file layouts/_default/single.html kemudian paste baris ini di dalamnya. {{ define "main" }} <section> <h1>{{ .Title }}</h1> <div> <article> {{ .Content }} </article> </div> </section> <aside> <div> <section> <h4>{{ .Date.Format "Mon Jan 2, 2006" }}</h4> <h5>{{ .WordCount }} Words</h5> </section> </div> <div> {{ with .PrevInSection }} <a class="previous" href="{{ .Permalink }}">{{.Title}}</a> {{ end }} {{ with .NextInSection }} <a class="next" href="{{ .Permalink }}"> {{.Title}}</a> {{ end }} </div> </aside> {{ end }} Sehingga hasilnya akan seperti ini. ...

mrfdn.com - Beberapa hari terakhir, saya memiliki pertanyaan dalam benak tentang bagaimana cara si pembuat undangan online menampilkan nama tamu undangannya saat url dibuka. Pagi ini setelah melaksanakan shalat subuh saya berhasil membuat script sederhana untuk memecahkan masalah ini. Alhamdulillah. Setelah saya ulik ternyata itu bisa dilakukan melalui javascript. Misalnya url undangan online seperti ini : undangan.ku/rafi-zora/?namatamu Saya ingin menampilkan nama tamu yang tertera setelah tanda tanya. Arti tanda tanya itu sendiri adalah location search query pada URL yang dikenali oleh web secara standar. ...

mrfdn.com - Pada artikel sebelumnya sudah dijelaskan beberapa hal yang penting diketahui tentang partials Pada artikel ini saya akan membahas tentang cara setting file list.html pada theme hugo yang sedang dibuat. List template merupakan daftar semua halaman apa saja yang ada di web hugo. Berbeda dengan home page dimana kita bisa set beberapa halaman saja yang tampil, kalau di sini kita bisa melihat semua isi konten. Tanpa berlama-lama simak penjelasannya di bawah. ...

mrfdn.com - Pada artikel sebelumnya sudah dijelaskan beberapa hal yang penting diketahui tentang file baseof.html. Pada artikel ini saya akan membahas tentang cara membuat dan setting file yang terdapat pada folder partials di theme hugo yang sedang dibuat. Partials merupakan kumpulan part atau bagian dari sebuah tag html yang saling berkaitan sehingga menjadi sebuah struktur html yang utuh. Partials ini sifatnya seperti bootstrap, maksudnya saling berkaitan satu sama lain. Jika sebuah halaman yang ingin diload butuh untuk menampilkan elemen tertentu maka kita bisa membuatkan elemen partials nya. ...

mrfdn.com - Kali ini saya akan membahas tentang cara membuat theme hugo sendiri. Artikel akan dibagi menjadi beberapa sub bahasan supaya lebih terstuktur. Karena jika dijelaskan melalui satu artikel ini saja maka akan sangat panjang dan pusing membacanya. Ada beberapa persiapan yang harus diketahui sebelumnya. Apa saja itu? Setidaknya anda harus mengetahui tentang: HTML CSS Go templating language (opsional). Untuk yang pertama dan kedua saya pikir anda sudah mengetahuinya, karena itu memang hal dasar yang harus diketahui. ...