Memahami Kode-Kode Dasar HTML

Memahami Dasar-Dasar HTML - Bagi sobat-sobatku yang ingin mempelajari HTML mulai dari dasar, silahkan baca atau mendownloadnya di sini (tunggu samapai halaman ini loading dengan sempurna):

Cara Membuat Website Dengan HTML!!!

Cara Memunculkan Tombol Share di Blogger

Cara Memunculkan Tombol Share di Blogger - Sejak template blog ini selesai dikerjakan, Alhamdulillah menurut menurut standar saya sudah cukup (karena waktu yang disita untuk mengerjakannya juga sudah cukup lama). Meskipun sebenarnya masih banyak kekurangan, tapi saya sudah merasa kelelahan dan memutuskan untuk tidak melanjutkannya. Beberapa hari yang lalu, ada satu hal yang membuat saya harus kembali mengutak atik template (meskipun sudah diputuskan untuk berhenti), apa itu? Tombol share blogger tidak muncul alias tidak ada meskipun sudah dimunculkan halaman “elemen laman”. (lihat gambar)

Meskipun saya telah mencentang “tampilkan tombol berbagi” (lihat dalam kotak merah pada gambar di atas), tetap saja tombol share tidak muncul dalam postingan. Akhirnya, saya kembali memperhatikan kode template saya yang membosankan itu, wah rupanya saya lupa memasukkan kode atau script untuk memunculkan “share buttons” blogger.

Mungkin kasus saya ini juga dialami oleh sobat blogger yang menggunakan template "dari luar" atau di download alias bukan template langsung dari blogger. Sepengetahuan saya, template bawaan blogger secara default sudah menggunakan "share buttons" ini.

Bagaimana mengatasi tombol share blogger yang tidak muncul ini?

Kita hanya membutuhkan kode ini:

<b:include data='post' name='shareButtons'/>

1.    Masukklah pada akun blogger sobat
2.    Setelah itu masuk pada halaman EDIT HTML (tips, download terlebih dahulu template sobat untuk membackup atau mengantisipaso kesalahan)
3.    Centang pada kotak  “Expand Template Widget”
4.    Silahkan cari kode berikut (gunakan CTRL + F atau F3 pada keyboard untuk mencari):

<p class='post-footer-line post-footer-line-1'>

5.    Pastekan kode berikut tepat di bawah kode nomor 4 di atas

<b:include data='post' name='shareButtons'/>

6.    Jika kode nomor 4 tidak ketemu, silahkan cari kode:

<p><data:post.body/></p>

Kemudian letakkan kode nomor 5 tepat di bawahnya
7. Langkah terakhir simpan template sobat

Catatan:

Pada kode-kode di atas, kode atau script yang saya tandai dengan warna merah adalah yang penting untuk dicari. Mengapa? Karena tidak semua template memiliki susunan kode yang sama, mungkin karena penggunaan spasi atau enter atau hal lain.
Sebelum melakukan trik di atas, sebaiknya masuk pada edit halaman posting (seperti gambar di atas) kemudian centang pada kotak "tampilkan tombol berbagi".

Jika sobat mengalami masalah selama menggunakan trik dari saya, silahkan berkomentar atau melakukan "pengaduan" (kayaq kantor polisi, hahaha) karena semua trik yang saya posting pernah kupraktekkan pada beberapa template dengan 'karakter' yang berbeda.

Semoga Bermanfaat !!!

Cara Membuat Tombol Spoiler/Hide Show

Cara Membuat Tombol Spoiler/Hide Show - Apa itu tombol spoiler? Saya juga tidak mengerti definisinya, tapi saya mengerti maksudnya apa (maklum, saya juga otodidak, hehehe). Yang saya pahami, tombol spoiler itu berfungsi untuk menyembunyikan sebuah tulisan atau apa saja yang akan disembunyikan, termasuk scipt html. Jika tombol tersebut diklik, maka akan muncul semua tulisan atau fitur lain yang disembunyikan.

Sebagai contoh, coba klik tombol di bawah ini:

Silahkan diisi apa saja di sini, yang memang dirasa perlu tuk disingkat

Nah, kalau sudah tau, sekarang kita melangkah pada tahap pembuatannya. Silahkan Copy kode di bawah ini kemudian pastekan pada postingan atau gadget di mana kita akan menggunakannya/menampilkannya.

<div><div style="margin: 5px;">
<div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="Tampilkan" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }" type="button"/>
</div>
<div style="border: 0px inset ; margin: 0px; padding: 6px;" class="alt2">
<div style="display: none;">

Silahkan diisi apa saja di sini, yang memang dirasa perlu tuk disingkat

</div></div></div></div>

Keterangan:

Warna merah dan biru silahkan diganti dengan kata yang di inginkan. Misalnya "show" untuk mengganti kata "tampilkan" dan "Hidden" untuk mengganti kata "Sembunyikan"

Warna Kuning silhkan diganti dengan kalimat atau script/kode atau foto yang akan kita sembunyikan.

Cara Menampilkan Kode HTML dalam Postingan (Parsing Kode)

Cara Menampilkan Kode HTML dalam Postingan (Parsing Kode) - Untuk menampilkan kode atau script html dalam postingan sobat, kode atau script html tersebut harus diparse terlebih dahulu. Di bawah ini saya sudah menyiapkan alat untuk memparse kode yang disediakan oleh om google. 

Caranya, copy kode atau script html yang akan ditampilkan dalam postingan kemudian paste pada form atau kotak di bawah ini. Jangan lupa klik "Convert". Nah, kode atau script html sobat sudah siap diposting, silahkan copy dan paste di dalam tulisan sobat.