Postingan

Menampilkan postingan dari Oktober, 2018

Cara Memasang Contact Form Di Halaman Statis Blogger

Gambar
Cara Memasang Contact Form Di Halaman Statis Blogger  - Bosan dengan tampilan contact form bawaan (default)? Jika iya, kamu harus coba pasang contact form keren ini di blogger milikmu. Tampilan yang lebih moderen dan tentunya lebih keren. Langsung saja ikuti panduan saya tentang cara pasang contact form keren di blogger. Tampilan Contact Form terbaru Cara Memasang Contact Form Di Halaman Statis Blogger 1. Sangat mudah! Buka Blogger > Halaman > Tambah Halaman Baru > masuk ke HTML mode. Masukkan kode berikut ini. <form name="contact-form"><div class='formcolumn1'><input id="ContactForm1_contact-form-name" name="name" placeholder='Name' size="30" type="text" value="" /><br /> </div><div class='formcolumn2'><input id="ContactForm1_contact-form-email" name="email" placeholder='Email' size="30" type="text&q

Cara Memasang Sitemap Widget Halaman Statis di Blogger

Gambar
Cara Memasang Sitemap Widget Halaman Statis di Blogger  - Sitemap atau daftar isi blog berisi daftar semua postingan yang sudah di terbitkan. Sitemap sangat berguna bagi para pengunjung. Sehingga mereka bisa lebih mudah untuk mencari artikel yang ada di blog kita. Sedangkan untuk blog yang sudah memiliki banyak sekali postingan, saya mewajibkan untuk menambah Sitemap. Jika tidak, bagaimana caranya agar pengunjung lebih mudah mencari postingan yang dibutuhkan? Note :  Sitemap ini memiliki fitur animasi pada bagian bacground. Cara Memasang Sitemap Widget Halaman Statis 1. Pertama, masuk ke Dashboard Blogger > Halaman > Tambah Halaman Baru > Ubah ke HTML Mode. Lalu tambahkan kode berikut ini. <div class="tabbed-toc" id="tabbed-toc"></div><script> var tabbedTOC={blogUrl:" https://www.galihdesign.com/ ",containerId:"tabbed-toc",activeTab:1,showDates:!0,showSummaries:!1,numChars:200,showThumbnails:!0,thumbSize:60

Cara Pasang Widget Social Media di Blogger

Gambar
Cara Pasang Widget Social Media di Blogger  - Perlu agan ingat bahwa social button yang akan saya bagikan hanyalah sebuah tombol tautan. Jadi, bukan termasuk tombol share. Css ini biasa dipasang di widget blogger untuk memberitahukan kepada para pengunjung bahwa kita memiliki akun media sosial. Oke lanjut ke tutorial memasanag widget sosial media di blogger. Tampilan social button responsive Cara Pasang Widget Social Media di Blogger 1. Masuk ke Dashboard blogger > Template > Edit HTML. Cari tag </head> lalu letakan kode berikut ini tepat diatasnya. <style type='text/css'> #social-counts{position:relative} #social-counts > li{display:block;float:left;padding:0;width:22.5%;margin:0 10px 0 0;overflow:hidden;border-radius:3px}#social-counts > li:last-child{margin:0} #social-counts > li > a{display:block;font-size:20px;font-weight:700;height:40px;line-height:40px;padding:0 20px;opacity:.99;background-size:200% auto} #social-counts > li:la

Cara Pasang Animasi Preloader di Blogger

Gambar
Cara Pasang Animasi Preloader di Blogger  - Sudah lama tidak posting artikel karena kesibukan saya yang beberapa hari ini fokus mengurus blog gaming. Oke langsung saja. Saya akan membagikan tutorial memasang preloader di Blogger. Untuk beberapa template yang berat, butuh waktu lama agar tampilan web bisa utuh. Terkadang, dalam prosesnya menampilkan tampilan blog yang berantakan. Untuk itulah gunanya Preloader, yakni menutupi tampilan awal blog yang acak-acakan. Jika tampilan blog sudah termuat seluruhnya, barulah Preloader berhenti. Tampilan Preloader Cara Pasang Animasi Preloader di Blogger 1. Pertama, masuk ke Dashboard blogger > Template > Edit HTML. Cari tag </head> dan letakkan kode berikut ini tepat diatas tag </head> . <style type='text/css'> /* Preloader */ #preloader{overflow:hidden;background:#fff;left:0;right:0;top:0;bottom:0;position:fixed;z-index:9999} .spinner{position:absolute;top:50%;left:49.5%;z-index:1;height:20px;width:20px

Belajar HTML - Cara Kerja Tag B

Gambar
Bagaimana cara kerja tag <b> pada HTML? Tag <b>  digunakan unttuk tujuan agar bisa lebih menarik perhatian suatu teks, tanpa menyiratkan kepentingan atau penekanan tambahan apapun pada teks tersebut. Semua teks yang berada di antara tag <b>  dan </b>  akan ditampilkan dengan jenis huruf tebal. Display  : Inline. Penggunaan  : Textual. Belajar Tag b pada HTML Berikut ini adalah contoh penggunaan tag <b> pada HTML. <p>Kalimat ini tidak menggunakan huruf tebal.</p> <p><b>Kalimat ini menggunakan huruf tebal.</b></p> Tampilan di Browser : Kalimat ini tidak menggunakan huruf tebal. Kalimat ini menggunakan huruf tebal.

Belajar HTML - Cara Kerja Tag Audio

Gambar
Bagaimana cara kerja Tag audio di HTML ? Tag audio digunakan untuk menambah sumber daya media audio kedalam dokumen HTML. Dan bisa diputar di browser secara langsung tanpa menggunakan plugin tambahan. Display : Inline. Contoh Tag Audio <audio controls="" id="contoh-audio"> <source src="https://www.mediafire.com/file/e12flnsu4457qc1/Inspiring_Piano_and_Strings_-_AShamaluevMusic.mp3"></source> </audio> Kamu bisa menggunakan sumber audio dengan format apa saja. Misalnya mp3 atau ogg. Tampilan contoh penggunaan tag audio diatas bisa kamu lihat dibawah ini. Format Audio yang Digunakan Format audio yang paling banyak mendapat dukungan atau support  dari Browser adalah .mp3 . Setelah itu ada format .wav  yang didukung oleh sebagian besar Browser terkenal saat ini (tidak termasuk Internet Explorer). Dan format audio terakhir, yang bisa digunakan adalah .ogg  dan .acc . Sayangnya, formati tersebut tidak mendapat dukungan mera

Jalancurut SEO Clean Responsive Blogger Template

Gambar
Jalancurut SEO Clean Responsive Blogger Template  - Apa kabar sob? Semoga baik-baik saja dan tetap semangat nge-blog . Kali ini saya ingin membagikan lagi sebuah template Blogger yang memiliki banyak sekali keunggulan diantaranya, tampilan sederhana, bersih (clean), SEO dan masih banyak lagi. Awalnya, template ini saya buat untuk eksperimen SEO dan daftar Adsense. Berhubung hasilnya sangat memuaskan, teman saya yang menggunakan template ini hanya butuh waktu 1 minggu untuk diterima Google Adsense. Wow~~~!! Jalancurut SEO Clean Responsive Blogger Template Berikut ini adalah kelebihan dari template Jalancurut : Features Availability Responsive True Cek Mobile Friendly True Cek Google Testing Tool Validator (Index) True Cek Google Testing Tool Validator (Item) True Cek SEO Friendly True Personal Blog True 2 Column True Top Nav

Daftar CDN Selain Rawgit - Alternatif

Gambar
Daftar CDN Selain Rawgit - Alternatif  - Rawgit, untuk kamu yang sudah lama atau baru terjun ke dunia programming pasti sudah tidak asing dengan situs yang satu ini. Ya, biasanya, jika kamu adalah pengguna Github , kemungkinan besar kamu juga adalah pengguna Rawgit . Rawgit biasa digunakan untuk membuat sebuah link ref dari Github, agar bisa kita gunakan. Seperti itu lah kira.kira. Baru-baru ini, kabar mengejutkan datang dari Owner Rawgit  yang memberitahukan bahwa situs tersebut akan segera ditutup. Yah, apapun alasannya, itu adalah berita buruk bagi kita semua. Daftar CDN Selain Rawgit - Alternatif Ternyata, kita semua masih diberi baik oleh Rawgit. Karena, selain mengabarkan kabar akan ditutupnya situs tersebut, Rawgit juga memberikan solusi bagi kita semua para penggunanya. Rawgit memberikan beberapa layanan yang mirip sepertinya. Berikut ini akan saya jabarkan. Githack Dari tampilannya saja sudah menunjukkan bahwa Githack memiliki fitur yang sama denga

Belajar Variabel dan Tipe Data pada Javascript

Gambar
Belajar Variabel dan Tipe Data pada Javascript  - Apa itu variabel Javascript? Apa itu Tipe data Javascript? Keduanya akan saya bahas di artikel ini. Variabel dan Tipe data akan selalu ada di setiap bahasa pemograman, termasuk Javascript. Belajar Variabel dan Tipe Data pada Javascript Pengertian Variabel Javascript Jika diibaratkan, variabel adalah sebuah wadah atau tempat untuk menyimpan sesuatu. Wadah ini bisa digunakan untuk menyimpan apa saja misalnya buah, baju, uang, dan masih banyak lagi -- sesuai keinginan. Paham kan  maksud saya? Jadi, Variabel javascript adalah sebuah nama yang mewakili sebuah nilai (value), -- dan nilai tersebut bisa kita isi sesuai keinginan.  Cara Membuat Variabel di Javascript Cara yang paling umum untuk membuat variabel Javascript adalah menggunakan tag var , lalu diikuti oleh nama  variabel dan nilainya . Contoh I : var buah = "semangka"; Pada contoh tersebut, kita membuat sebuah variabel bernama buah  dengan nil

Metode atau Cara Menampilkan Output Pada Javascript

Gambar
Metode atau Cara Menampilkan Output Pada Javascript  - Output dalam Javascript adalah hasil akhir dari proses kerja Javascript yang ditampilkan pada Browser. Biasanya dalam bentuk teks atau fungsi print() . Agar hasil akhir bisa terlihat, kita harus menggunakan fungsi Output Javascript . Metode atau Cara Menampilkan Output Pada Javascript Ada 4 cara untuk menampilkan Output Javascript, yakni : Menampilkan Output di Console Browser, menggunakan fungsi console.log() . Menampilkan Output di dalam kotak peringatan, menggunakan fungsi window.alert() . Menampilkan Output ke dalam elemen Output HTML, menggunakan fungsi document.write() . Menampilkan Output  ke dalam elemen HTML, menggunakan fungsi innerHTML Pertanyaannya , apa bedanya keempat cara diatas? Nah, ayo baca penjelasan Galih berikut ini! 1.  Menggunakan fungsi console.log() Fungsi conlose.log()  adalah sebuah fungsi javascript untuk menampilkan output pada Console Browser. Biasanya berupa teks atau

Metode Penulisan Javascript pada HTML

Gambar
Metode Penulisan Javascript pada HTML  - Metode atau cara penulisan Javascript di HTML ada beberapa macam. Untuk tujuan Web Development front-end , Javascript wajib digunakan dan ditambahkan pada kode HTML. Berikut ini adalah metode penulisan Javascript di HTML. Metode Penulisan Javascript pada HTML Pada artikel sebelumnya, Galih hanya menerangkan sekilas saja tentang cara penulisan Javascript pada HTML. Dan, di artikel panduan ini, Galih akan coba menjelaskannya secara lebih rinci. 1. Menggunakan tag <Script> Cara yang paling sering digunakan untuk menyematkan Javascript pada HTML adalah dengan menempatkan kode didalam tag html <script> . Tag <script> bisa ditempatkan didalam tag <head> maupun <body> . Contoh: <!DOCTYPE html> <html> <head>     <meta charset="utf-8">     <title>Metode Penulisan Javascript</title>     <script>     console.log("Halo, Aku adalah kode Javascrip

Belajar Javscript Dari Nol Untuk Pemula - Tutorial Lengkap

Gambar
Belajar Javscript Dari Nol Untuk Pemula - Tutorial Lengkap  - Jika kamu tengah atau akan mendalami dunia web development  (pengembangan web), selain harus mempelajari HTML dan CSS, kamu juga harus belajar bahasa pemograman Javascript . Javascript mengalami banyak perkembangan dari tahun ketahun, yang awalnya hanya digunakan untuk browser, sekarang Javascript juga dgunakan pada Aplikasi, Game, Console dan masih banyak lagi. Dan menurut data dari forum pembelajaran bahasa pemograman Stackoverflow , Javascript menjadi bahasa pemograman nomor satu yang paling populer 3 tahun belakangan ini. Oleh karena itu, saya mengajak kamu untuk belajar Javascript bersama-sama. Untuk kamu yang masih belum paham sama sekali, tenang saja, saya akan membuat tutorial pembelajaran Javascript dari awal, untuk pemula --  sejelas mungkin. Jika dirasa ada yang kurang dimengerti, silahkan tuliskan komentar di artikel ini ya. Pengertian Javascript Javascript adalah bahasa pemograman tingkat tinggi

Cara Membuat Sitemap di Halaman Static Seperti Arlina - RAHASIA

Gambar
Cara Membuat Sitemap di Halaman Static Blogger Seperti Arlina  - Mungkin tidak hanya saya yang tertarik dengan desain Sitemap di halaman Static blogger seperti milik blog mbah Arlina, tetapi kamu juga tertarik dengannya. Setelah beberapa kali mengulik  css dan javascript untuk template sitemap, akhirnya saya berhasil membuatnya. Karena saya sedang senggang, akan saya beri tutorial cara memasang Sitemap di Halaman static blogger keren ini. Cara Membuat Sitemap di Halaman Static Blogger Seperti Arlina Langkah-langkah untuk memasang sitemap di halaman static blogger ini sangat mudah. Kamu cukup masuk ke dashboard Blogger > Halaman > Buat Halaman Baru . Masuk ke mode HTML , kemudian masukan kode berikut ini. <div id="recentpostsae"></div><div id="recentpostnavfeed"></div><style scoped type="text/css"> #content,.single-posts article{background:transparent;box-shadow:none;padding:0} .single-posts .entry-title{mar

Cara Membuat Tanda Tangan Email di Gmail Otomatis

Gambar
Cara Membuat Tanda Tangan Email di Gmail Otomatis   - Sebenarnya, untuk menambahkan tanda tangan atau Signature Email  secara otomatis di email Gmail sangat mudah. Tapi mungkin masih ada beberapa orang yang belum tahu caranya, termasuk kamu sob. Tenang saja, setelah mengikuti tutorial dari Galihdesign, kamu pasti bisa memasang tanda tangan email di gmail secara otomatis. Cara Membuat Tanda Tangan Email di Gmail Otomatis Saya anggap kamu sudah mempunyai akun email Google yakni Gmail > Pergilah ke Gmail . Tekan tombol Gerigi  atau Gear  yang ada di pojok kanan atas > Pilih Setting . Pada Tab Menu Umum >  Gulir kebawah sampai kamu menemukan kotak text-area  untuk membuat tanda tangan. Jangan lupa untuk memindahkan tanda centang  seperti gambar dibawah ini. Jika kamu sudah membuat tanda tangan email , silahkan gulir kebawah dan klik tombol Simpan Perubahan . Selesai.

Cara Memasang Komentar Disqus di Blogger Terbaru - Tutorial Lengkap

Gambar
Cara Memasang Komentar Disqus di Blogger - Tutorial Lengkap  - Ada banyak alasan mengapa kamu harus memasang widget komentar Disqus di Blogger. Salah satu kelebihan Disqus daripada komentar bawaan Blogger adalah moderasi yang lebih mudah serta tampilan komentar yang cantik. Jika kamu merasa khawatir blog menjadi  lemot  setelah memasang Disqus, tenang saja. Karena, CSS dan Javascript Disqus sangatlah ringan. Nah, pada artikel kali ini saya akan memberikan tutorial lengkap (daripada blog lain) tentang cara memasang widget komentar Disqus di Blogger . Cara Memasang Komentar Disqus di Blogger - Tutorial Lengkap Ada dua cara untuk pemasangan widget komentar di Blogger yakni : Direct install Yakni pemasangan langsung dari website Disqus. Walaupun lebih mudah, tapi kita tidak bisa mengatur letak komentar Disqus sesuai keinginan kita karena komentar Disqus otomatis berada di Widget Blogger. Masalah ini bisa diatasi jika Template yang kamu gunakan sudah menyediakan  Section w