Jauhari Top

Related post atau artikel terkait merupakan kumpulan link yang menuju ke postingan lain yang memiliki topik yang sama. Related post sering ditempatkan pada bagian bawah dan ditengah-tengah postingan. Di blogger sendiri belum memiliki widget ini, sehingga anda perlu membuatnya sendiri secara manual. Untuk stylenya berbeda-beda namun yang akan saya bagikan ini merupakan related post yang sederhana yang hanya menampilkan link judulnya saja tanpa cuplikan dan thumbnail. Cara membuat related post sederhana di blog 1. Masuk ke dashboard blogger anda. 2. Berikutnya anda klik Tema , Edit HTML . 3. Letakkan kode berikut ini di atas kode </head> <b:if cond='data:blog.pageType == &quot;item&quot;'> <style> #related-posts{float:left;width:100%;margin:10px;padding:1px 0 10px} #related-posts .widget h2,#related-posts h3{font:18px Oswald;color:#000;text-transform:none;margin:0 0 10px;padding:0;font-weight:500} #related-posts a{color:#0973CF;font:14px Arial,Sans-serif...

Salah satu cara untuk memodifikasi bagian header blog yaitu memindahkan judul blog yang tadinya disebelah kiri dipindah ke bagian tengah, caranya adalah dengan menambahkan sedikit kode CSS didalam tema blog dan cara ini berlaku untuk tema-tema bawaan blogger versi lama yang belum responsive. Berikut cara memindahkan judul blog ke tengah 1. Masuk ke dashboard blogger. 2. Klik Tema , Edit HTML . 3. Berikutnya anda masukkan kode berikut di atas kode  ]]></b:skin> #header-inner { background-position: center !important;width: 100% !important;text-align: center; } #header-inner img { margin: auto; } 4. Berikutnya anda klik Simpan . Demikianlah cara memindahkan judul blog ke tengah pada bagian header, semoga bermanfaat.

Beberapa saat yang lalu saya sudah share  cara mengganti judul blog dengan logo gambar pada tema-tema bawaan blogger versi lama, untuk desain dan cara upload gambarnya pun sama dengan tema notable, hanya saja kode css yang digunakan pada tema notable sedikit berbeda. Perbedaannya yaitu jika pada tema versi lama,  ukuran tinggi gambar logo mengikuti ukuran lebar gambar logo. Sedangkan pada tema notable justru sebaliknya, yaitu ukuran  lebar gambar logo mengikuti ukuran tinggi gambar logo. Cara mengatur ukuran logo header tema notable 1. Pertama, kunjungi dashboard blogger, klik Tema , Edit HTML . 2. Berikutnya anda cari kode seperti ini .widget.Header img{ max-width:100% } Tambahkan ukuran tinggi atau Height, misal height:40px; , hasilnya akan seperti ini .widget.Header img{ max-width:100%; height:40px } 3. Terakhir anda klik Simpan .   Semoga bermanfaat.

Selain dibawah postingan, anda juga dapat menempatkan daftar komentar di bagian sidebar blog, caranya adalah menambahkan gadget freed, setelah itu anda dapat mengkonfigurasinya menjadi feed komentar, sederhana bukan? dan berikut panduannya. Cara memasang daftar komentar di bagian sidebar blogger I. Mengaktifkan komentar 1. Pertama anda klik Setelan . 2. Berikutnya anda klik komentar , pilih tersemat atau halaman penuh . II. Konfigurasi feed komentar di bagian sidebar 1. Pertama, anda klik Tata Letak . 2. Berikutnya anda klik Tambahkan gadget pada bagian sidebar, lalu anda klik Feed . 3. Masukkan konfigurasi feed pada kolom yang telah disediakan, formatnya seperti ini ***.blogspot.com/feeds/comments/default Ganti *** dengan nama blog anda. 4. Berikutnya anda klik Lanjutkan . 5. Pada bagian judul silahkan anda ganti dengan judul komentar atau sesuai dengan yang anda inginkan. 6. Simpan . Untuk style CSS nya dapat anda buat sendiri sesuai dengan kreatifitas anda. Demikianlah cara memas...

Untuk membuat blog lebih menarik tentunya kita juga memerlukan icon-icon gambar kecil yang dapat dipasang di blog. Jika dulu kita hanya dapat memasang icon gambar dengan URL file gambar online,maka disaat ini kita dapat memasang icon dengan bantuan font awesome icon,sehingga loading blog tidak terlalu berat dan untuk kualitas icon yang dihasilkan termasuk baik. Font Awesome icon adalah ikon yang berasal dari pustaka Font Awesome, yaitu kumpulan ikon dan fon yang berbasis CSS dan Less. Ikon ini digunakan oleh pengembang, desainer, dan kreator konten untuk membuat situs web. Untuk lokasi pemasangan font awesome icon tidaklah sulit, karena dapat diterapkan di bagian manapun pada halaman blog maupun postingan. Cara memasang font awesome di tema blogger 1. Pertama, silahkan anda klik Tema , Edit HTML . 2. Masukkan kode berikut ini diatas kode </head> <link href='//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' rel='stylesheet'/> 3. Berikutny...

Halaman sitemap yang akan kita buat bukan sitemap.xml yang digunakan untuk sitemap di google search coonsole maupun webmaster lainnya. Sitemap yang akan kita buat merupakan sebuah halaman statis yang berisikan tentang sitemap mirip daftar isi yang memudahkan pengunjung blog menemukan artikel yang di cari. Cara membuat halaman sitemap di blogger I. Membuat halaman statis baru yang berisi sitemap 1. Klik Halaman , Halaman Baru . 2. Pindah mode penulisan ke mode HTML. 3. Pada bagian judul, anda beri judul sitemap . 4. Masukkan kode berikut ini <style> #jauhari-sitemap-wrapper {font-size:13px} #jauhari-sitemap-wrapper li {position:relative;padding:.385em 0 .385em 6.923em;border-top:none;border-bottom:1px solid #f6f6f6} #jauhari-sitemap-wrapper span {position:absolute;left:0;color:#444} #jauhari-sitemap-wrapper a {font-weight:bold} #jauhari-sitemap-loading-msg {height:100px;line-height:100px;text-align:center;font-weight:bold;letter-spacing:1px;font-size:18px;color:#bbbbbb} </style...

Beberapa saat yang lalu saya sudah memposting cara membuat contact form di halaman statis blog , di posting ini saya akan berbagi style contact form yang ke-2 di blog ini. Fungsinya sama yaitu untuk membantu pengunjung blog mengirim pesan ke admin blog dan untuk cara dan penempatannya juga sama, perbedaannya terletak hanya pada style yang digunakan dan tentunya kode yang digunakan akan sedikit berbeda. Cara membuat contact form style ke-2 untuk blogger I. Menambahkan gadget contact form pada bagian sidebar 1. Klik Tata Letak , Pada Layout bagian Sidebar silahkan klik Tambahkan Gadget , lalu pilih Contact Form . 2. Beri judul "contact", lalu klik Simpan . II. Menyembunyikan gadget contact form pada bagian sidebar 1. Klik Tema , Edit HTML . 2. Letakkan kode berikut di atas kode ]]></b:skin> #ContactForm1 {display:none;} 3. Klik Simpan . III. Menambahkan halaman statis yang berisi contact form 1. Klik Halaman , Tambahkan Halaman baru . 2. Pindah mode penulisan ke mode ...

Fungsi file robots.txt adalah memberi tahu mesin pencarian untuk merayapi URL mana saja yang dapat diakses di blog anda dan URL mana saja yang tidak boleh diakses. Berikut settingan robots.txt untuk blogger yang umum digunakan 1. Klik  Setelan ,  robots.txt custom . 2. Masukkan settingan berikut ini. User-agent: * Disallow: /search Allow: / Sitemap: https:// nama blog anda .blogspot.com/sitemap.xml 3.  Simpan . Catatan: User-agent:  adalah jenis bot pencarian. Disallow: adalah perintah untuk melarang User-agent merayapi halaman atau direktori tertentu. Allow:  adalah perintah untuk mengizinkan User-agent merayapi halaman atau direktori tertentu. *  adalah semua nama User-agent semisal google, bing, yandex. /search  adalah URL direktori hasil pencarian internal didalam blog. /sitemap:  URL direktori sitemap pada blog. https:// nama blog anda .com/sitemap.xml  adalah URL sitemap blog, silahkan anda ganti teks yang berwarna merah sesuai dengan n...

File ZIP merupakan format file yang digunakan untuk mengompresi data dan menggabungkan beberapa file atau folder menjadi satu file, file ZIP ini memiliki ekstensi .zip . Beberapa manfaat file ZIP di antaranya adalah: Memudahkan berbagi data Memudahkan pengiriman data Memudahkan pengelolaan data Menghemat ruang penyimpanan Ketika anda mendownload sebuah file di internet apalagi file mp3 musik yang berisi 1 album komplit, biasanya file-file tersebut sudah dibungkus menjadi 1 pack dan sebagian besar pembungkusnya menggunakan file ZIP. Mengeluarkan isi didalam file ZIP disebut juga dengan ekstrak, dan untuk mengekstraknya diperlukan sebuah aplikasi untuk mengekstrak file ZIP tetsebut. Di android sendiri kini telah hadir beraneka macam aplikasi untuk mengekstrak file ZIP, satu diantaranya adalah aplikasi bernama X-plore, salah aplikasi tertua dari zaman ponsel ber-OS symbian. Aplikasi ini dahulunya merupakan salah satu tools pendamping yang wajib dimiliki untuk memodifikasi tema dan berbaga...

Tag h1 merupakan salah satu tag html yang penting di blog, karena digunakan sebagai judul utama pada sebuah blog yang mewakili seluruh topik di blog dan menginformasikan kepada mesin pencarian tentang konten di blog dan juga apa saja yang ada didalamnya. Di blogger sendiri tag h1 letaknya berada pada bagian header halaman blog, yang lebih kita kenal dengan sebutan judul blog. Seperti yang kita tau bagian header blogger dapat dimodifikasi, salah satu modifikasinya adalah dengan mengganti judul blog dengan logo gambar yang membuat tampilan blog lebih menarik dan tentunya berbeda dengan blog-blog lainnya. Namun sayangnya ketika kita mengganti judul blog dengan logo gambar maka tag h1 juga akan ikut hilang. Akan tetapi anda tidak perlu khawatir karena tag h1 yang hilang ini masih dapat anda perbaiki yaitu dengan sedikit memodifikasi kode HTML didalam tema yang sedang anda pakai. Untuk mengecek hasilnya, silahkan anda datangi situs-situs yang menyediakan pengecekan tag h1, jika hilang sete...

Syntax highlighter merupakan fitur editor teks yang digunakan untuk menyorot berbagai jenis bahasa pemrograman, script, atau markup, seperti HTML, CSS. Fitur ini menampilkan kode script dalam warna dan font yang berbeda sesuai dengan kategori dari bahasa pemrograman itu sendiri, tujuannya pun agar mudah dibaca dan terlihat rapih. Syntax ini biasanya dimanfaatkan oleh blog yang memuat tutorial yang berkaitan dengan koding sebagai pengganti "kolom copy paste" teks area dan blockquote. Perbedaannya adalah syntax hightlighter isi teks melebar kesamping, sedangkan blockquote isi teks memanjang kebawah. Syntax hightlighter di posting ini memiliki tipe yang sederhana, hanya menggunakan kode CSS dan tidak memiliki warna variasi seperti pada umumnya, kelebihannya adalah lebih fleksibel dan mudah digunakan. Cara memasang Syntax hightlighter sederhana di blogger 1. Pertama anda klik Tema , Edit HTML . 2. Berikutnya anda masukkan kode berikut ini di atas kode ]]></b:skin> .post-...

Aplikasi miggi merupakan aplikasi chat mirip mig33 yang muncul sekitar tahun 2006 ketika itu ponsel ber OS java-symbian menjadi OS yang populer. Untuk memunculkan auto teks saat di chatroom maupun private chat, maka di butuhkan command atau perintah untuk memunculkan teks tersebut. Kumpulan teks command pada aplikasi miggi agree angry apologize argh awesome bae bark bearhug bed beer beg blink blowk blush boo bored bow brb burp caff challenge champion cheer chicken chuckle cmon comfort confuse congrat cool cos crazy cringe cry doh drool drunk duck eek eh embrace equalised faint fart firebreath flirt french frown fun gasp gee giggle glad glare gme gn go goal gold greet grin groan gtg happy hfive hiccup hmm hold honor howl hug hum joy kiss kujum lag laugh listen lose loser love magnificent martian milestone miss mmm moo mumble nod out penalty phew pinch play poke ponder power purr record red relax rest rose ruffle sad salute scream seduce shiver shmoo shrug shy sick sigh slap sleepy smile...

Agar toshiba satellite c600 lawas anda tetap prima walaupun sudah tidak mendapatkan update, sebaiknya sesekali anda melakukan reset ulang ke pengaturan pabrik, dengan begitu sistem akan terasa menjadi lebih ringan dan berikut langkah-langkah caranya. Cara reset ulang toshiba satellite c600 ke pengaturan pabrik Pertama-tama silahkan anda lepaskan modem dan semua perangkat yang terhubung pada colokan USB laptop. Usahakan baterai dalam keadaan full,karena proses ini memerlukan waktu yang cukup lama dan banyak melakukan restart otomatis. Ada baiknya simpan/backup terlebih dahulu file-file yang kita anggap penting di flashdisk,karena file-file tersebut dapat terhapus saat proses ini. Ketika laptop dalam keadaan hidup ,silahkan tekan dan tahan tombol power dan angka 0  beberapa detik secara bersamaan sampai laptop mati . Saat laptop dalam keadaan mati,lepas tombol power , tetapi angka 0 tetap ditahan,jangan dilepas dulu. Silahkan tekan tombol power sekali lagi,tapi angka 0 tetap dita...

Dengan tag HTML marquee ini memungkinkan teks bergerak kanan ke kiri dengan background berwarna. Contoh: Teks anda Kode marquee dengan background warna <marquee bgcolor="#FB6A46">Teks anda</marquee> Kode #FB6A46 adalah kode warna, silahkan anda ganti dengan kode warna yang anda inginkan. Anda dapat menyisipkan tag marquee di Tema blogger, Gadget Javascript/Html blogger maupun pada posting blogger dalam tulisan mode HTML. Selamat mencoba.

Judul blog terletak pada bagian header blog, anda dapat mengganti judul blog dengan menggunakan font-font yang menarik, merubah ukuran font, memberi warna dan merubah background nya. Selain itu anda juga dapat mengganti judul blog dengan menggunakan logo gambar agar kelihatan lebih menarik dan mewakili indentitas blog anda. Desain Untuk desain logo gambar anda dapat mendesainnya sendiri, caranya mudah kok, apalagi sekarang ini sudah banyak aplikasi-aplikasi khusus untuk desain logo gambar dan editor gambar di android yang disediakan secara gratis ditambah dengan sedikit sentuhan kreatifitas anda sendiri. Gunakan gambar yang memiliki background transparan dengan begitu background gambar akan mengikuti warna background header, oleh karena itu anda dapat memilih gambar dengan format .png . Resolusi Untuk ukuran gambar, gunakanlah gambar dengan bentuk persegi panjang sesuaikan saja dengan dengan ukuran header anda, anda kira-kira saja pas atau tidak nya, karena ukuran header pada setiap te...

Link pada posting blog bertujuan untuk mengarahkan pembaca ke URL halaman tujuan, sehingga mempermudah pembaca mencari informasi yang dibutuhkan. Contoh: Klik Saya Ketika anda klik teks tersebut maka anda akan di alihkan ke halaman URL halaman tujuan, pada contoh tersebut saya menggunakan halaman utama blog saya, anda dapat menggantinya sesuai yang anda inginkan dan berikut cara menambahkan link di postingan blogger. Menambahkan link di postingan blogger 1. Pada saat anda sedang menulis posting dengan mode tampilan menulis dan ingin menambahkan link, silahkan anda klik icon link . 2. Nanti anda akan menemukan halaman input Edit Link, seperti ini. Catatan: Pada kolom bagian atas adalah teks yang akan ditampilkan di postingan, disini anda bebas mengisinya, anda dapat mengisinya dengan teks URL halaman asli maupun dengan kata-kata berupa teks yang menarik, misalnya: klik saya , klik disini dan lain sebagainya sesuai dengan yang anda inginkan.l Pada kolom bagian bawah adalah URL halaman t...

Salah satu fitur yang disediakan oleh blogger.com adalah fitur error dan pengalihan, dimana ini dapat membantu pengguna untuk mengalihkan suatu URL halaman ke URL halaman yang lainnya sehingga pengguna leluasa dalam mengatasi kesalahan pengalihan baik di google search console maupun di webmaster situs lainnya. Salah satu indikator kesalahan pengalihan adalah URL halaman tersedia di halaman pencarian, namun saat di klik anda akan menemui peringatan "page not found", ini umum terjadi dan sebagian besar faktor penyebabnya adalah kesalahan memasukkan link URL halaman, halaman memang sudah anda hapus, atau tidak hati-hati saat mengedit postingan lama. Di blogger sendiri terdapat 2 fitur error dan pengalihan, diantaranya adalah fitur error 404 yaitu fitur otomatis yang digunakan untuk mengalihkan banyak URL halaman yang bermasalah ke satu halaman tertentu, sehingga anda tidak perlu repot-repot mengalihkan URL satu-persatu, ini efektif bagi anda yang memiliki terlalu banyak URL hala...

WhatsApp merupakan aplikasi chat yang saat ini banyak digunakan, WhatsApp memungkinkan anda mengirimkan pesan dengan format teks yang sudah disediakan. Berikut beberapa format teks di aplikasi WhatsApp Miring Untuk memiringkan pesan, tambahkan garis bawah di awal dan akhir teks, contoh: _teks_ Tebal Untuk menebalkan pesan, tambahkan tanda bintang di awal dan akhir teks, contoh: *teks*   Coret Untuk mencoret pesan, tambahkan tanda tilde di awal dan akhir teks, contoh: ~teks~ Monospace Untuk membuat monospace di pesan, gunakan tiga tanda kutip terbalik di awal dan akhir teks, contoh: ```teks``` Daftar atau list Untuk menambahkan daftar berpoin ke pesan, tambahkan tanda bintang atau tanda hubung dan spasi sebelum setiap kata atau kalimat, contoh: * teks * teks Atau - teks - teks Daftar bernomor atau number list Untuk menambahkan daftar bernomor ke pesan, tambahkan angka, titik, dan spasi sebelum setiap baris teks, contoh: 1. teks 2. teks Tanda kutip Untuk menambahkan tanda kutip ke pe...

Kesalahan pengalihan kode error 404 pada dasarnya umum terjadi, penyebabnya adalah halaman yang dituju tidak ditemukan entah karena salah mengetik alamat URL halaman yang dituju atau karena memang halaman tersebut sudah tidak ada lagi atau juga karena URL halaman sudah berpindah ke alamat lain, namun masih tersedia di halaman situs-situs pencarian. Salah satu solusinya adalah dengan mengalihkan URL halaman yang bermasalah tadi ke halaman khusus semisal halaman homepage blog atau halaman lain yang dikhususkan sebagai URL halaman tujuan. Lantas bagaimana jika URL yang bermasalah terlalu banyak sedangkan kita tidak mengetahui detailnya satu per satu? solusinya adalah dengan menerapkan pengalihan khusus 404 yang fiturnya sudah disediakan oleh blogger.com. Dengan begitu URL halaman yang bermasalah akan secara otomatis teralihkan ke URL halaman yang kita inginkan, dengan "catatan" URL halaman tujuan masih aktif dan dapat diakses dengan baik. Cara Setting pengalihan 404 di blogger 1...

Link atau tautan pada intinya adalah sebuah teks atau gambar yang apabila di klik maka anda akan di arahkan ke alamat URL halaman tertentu. Contoh: Klik Saya Saat anda meng-klik tulisan Klik Saya diatas maka anda akan diarahkan ke halaman utama blog ini. Untuk membuat link dengan tag HTML Kode tag HTML nya adalah sebagai berikut: <a href=" Alamat URL "> Teks yang akan ditampilkan </a> Catatan: Silahkan anda ganti Alamat URL dengan alamat URL yang anda inginkan, misalnya https://www blogger.com, https://www google.com dan lain sebagainya. Untuk Teks yang akan ditampilkan , silahkan anda ganti dengan teks yang anda inginkan (bebas). Untuk blogger sendiri, pembuatan link dapat dilakukan melalui editor HTML postingan, editor HTML Tema, Gadget tambahkan Link, Gadget tambahkan HTML/Javascript. Sedangkan untuk penempatan, link dapat ditempatkan dimanapun misalnya di bagian header, footer, sidebar dan lain sebagainya. Semoga bermanfaat.

Gadget label biasanya ditempatkan dibagian sidebar maupun dibagian footer, agar tampak menarik beberapa blogger membuat efek scroll vertikal untuk gadget label ini, dimana cara ini memungkin gadget label dapat di scroll ke atas dan kebawah. Cara membuat efek scroll vertikal pada gadget label 1. Login di blogger.com 2. Berikutnya anda klik Tema , Edit HTML . 3. Berikutnya anda etakkan kode berikut ini diatas kode ]]></b:skin> #Label1 .widget-content{ height:150px; width:auto; overflow:auto; border:1px solid #cccccc; background-color:#eeeeee; } 4. Terakhir anda klik Simpan . Cara ini berhasil saya terapkan di tema default blogger generasi kedua yang bernama simple bold, mungkin dapat diterapkan di tema default blogger lainnya. Semoga bermanfaat.

Dengan tag HTML Marquee ini memungkinkan teks bergerak dari bawah ke arah atas. Contoh Marquee atau teks bergerak dari bawah ke arah atas teks anda Kodenya adalah sebagai berikut <marquee direction="up"> teks anda </marquee> Catatan: teks anda adalah teks biasa yang akan ditampilkan, silahkan anda ganti dengan teks yang anda inginkan Anda dapat menyisipkan tag marquee di Tema blogger, Gadget Javascript/Html blogger maupun pada posting blogger dalam tulisan mode HTML. Selamat mencoba.

Dengan tag HTML Marquee ini memungkinkan teks bergerak dari atas ke arah bawah. Contoh Marquee atau teks bergerak dari atas ke arah bawah teks anda Kodenya adalah sebagai berikut <marquee direction="down"> teks anda </marquee> Catatan: teks anda adalah teks biasa yang akan ditampilkan, silahkan anda ganti dengan teks yang anda inginkan. Anda dapat menyisipkan tag marquee di Tema blogger, Gadget Javascript/Html blogger maupun pada posting blogger dalam tulisan mode HTML. Selamat mencoba.

Dengan tag HTML marquee ini memungkinkan teks bergerak memantul kiri-kanan. Contoh Marquee atau teks bergerak memantul kiri kanan teks anda Kodenya adalah sebagai berikut <marquee behavior="alternate"> teks anda </marquee> Catatan: teks anda adalah teks biasa, silahkan anda ganti dengan teks yang anda inginkan. Anda dapat menyisipkan tag marquee di Tema blogger, Gadget Javascript/Html blogger maupun pada posting blogger dalam tulisan mode HTML. Selamat mencoba.

Dengan tag HTML Marquee ini memungkinkan teks bergerak dari kiri ke arah kanan. Contoh Marquee atau teks bergerak dari kiri ke kanan teks anda Kodenya adalah sebagai berikut <marquee direction="right"> teks anda </marquee> Catatan: ganti teks anda dengan teks yang anda inginkan. Anda dapat menyisipkan tag marquee di Tema blogger, Gadget Javascript/Html blogger maupun pada posting blogger dalam tulisan mode HTML. Selamat mencoba.