Tampilkan postingan dengan label Tips dan Trik. Tampilkan semua postingan
Cara Memasang Tombol Show Hide Di Postingan Blog
Salam damai bagi kita semua. Terutama sobat blogger yang membaca artikel ini. Kali ini saya akan mencoba menambah ilmu anda. Yaitu cara membuat tombol show di postingan blog. Inspirasi saya sih dari sini. Namun saya perjelas untuk anda sobat. Cara memasang tombol show pun mudah
.jpg)
1. Buat lah new post di blog anda
2. Buka HTML
3. Masukan Script berikut
<div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</small></b>
<input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"></div>
<div style="border: 1px inset; margin: 0px; padding: 6px;"><div style="display: none;">
MASUKAN TEXT YANG INGIN ANDA BUAT DISINI
</div></div></div>
4. Hasilnya akan seperti ini
Semoga artikel yang saya buat tadi bermanfaat buat agan-agan blogger sekalian, selamat mencoba^-^
1. Buat lah new post di blog anda
2. Buka HTML
3. Masukan Script berikut
<div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</small></b>
<input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"></div>
<div style="border: 1px inset; margin: 0px; padding: 6px;"><div style="display: none;">
MASUKAN TEXT YANG INGIN ANDA BUAT DISINI
</div></div></div>
4. Hasilnya akan seperti ini
Klik show untuk melihat
MASUKAN TEXT YANG INGIN ANDA BUAT DISINI
Semoga artikel yang saya buat tadi bermanfaat buat agan-agan blogger sekalian, selamat mencoba^-^
Cara Mengganti Favicon Pada Blog
Pada post kali ini saya hanya berbagi ilmu blogger. Kali ini adalah tutorial cara mengganti favicon pada blog anda. langsung ke pembahasan
Favicon merupakan singkatan dari Favorites Icon. Favicon adalah gambar multi-resolusi yang disertakan pada hampir semua situs atau blog yang tampil pada address bar suatu situs atau blog dan merupakan logo dari blog tersebut.
Membuat blog di bawah platform blogger.com, maka blog sobat blogger secara default memiliki Favicon seperti ini :
Sumber : Monfoort Blogspot
Favicon merupakan singkatan dari Favorites Icon. Favicon adalah gambar multi-resolusi yang disertakan pada hampir semua situs atau blog yang tampil pada address bar suatu situs atau blog dan merupakan logo dari blog tersebut.
Sebelum mengganti Favicon, tentunya sobat blogger harus memiliki gambar dulu. Gunakan gambar persegi yang ukurannya kurang dari 100KB. Kalau sobat blogger tidak memiliki gambar tersebut, silahkan download saja gambar di http://www.iconarchive.com atau http://www.iconj.com, disana sobat blogger bisa memilih gambar yang bisa sobat blogger jadikan Favicon blog sobat. Ingat, gambar yang akan digunakan, harus ukuran yang sangat kecil. Kalau sobat blogger sudah memiliki icon yang akan digunakan, ikuti langkah di bawah ini :
Membuat blog di bawah platform blogger.com, maka blog sobat blogger secara default memiliki Favicon seperti ini :
Jika sobat blogger membuat blog di bawah platform wordpress.com, tampilan Favicon dafault
terlihat seperti ini :
Cara mengganti Favicon dengan cara pertama
- login dulu ke blog anda
- Pada menu dropdown, klik layout
- Klik edit pada gambar favicon
- klik pilih file
Cara mengganti Favicon dengan cara Kedua
- Login dulu ke blog anda
- pada menu dropdown, pilih template
- Klik edit HTML dan proceed
- Cari code </head>
- Tempatkan code ini sebelum </head>
<link href='URL ICON' rel='shortcut icon' type='image/vnd.microsoft.icon'/>
- Ganti text warna merah dengan url foto favicon anda
- Save template
Kode yang saya berikan pada Cara kedua, membuat favicon sobat blogger tampil di media browser Google Chrome atau media Browser yang lain. Kode tersebut berbeda dengan kode-kode yang sobat blogger dapatkan di blog lain. Kalau sobat blogger menggunakan kode seperti ini :
<link href='URL ICON' rel='shortcut icon'/>
Maka Favicon yang sudah sobat blogger ganti hanya tampil di media Browser Mozilla Firefox.
Sumber : Monfoort Blogspot
Cara Mempercepat Loading Blog
Salam damai bagi kita semua. Pada Tips Blog kali ini, saya membahasa cara mempercepat loading blog. Anda memiliki blog yang loading agak lama. Sebaiknya anda membaca tutotial ini. Karna jika blog yang loadingnya lama bisa saja mengurangi pengunjung. Karena tidak semua orang memiliki koneksi internet yang cepat. ada 2 cara yaitu sebagai berikut
1. Mengkompres Script Blog
Cara pertama yaitu mengkompres script blog. Cara ini kita menggunakan tool online. Cara kerjanya juga mudah. Tool ini membuang script yang tidak terpakai. Cara pakainya
1. Mengkompres Script Blog
Cara pertama yaitu mengkompres script blog. Cara ini kita menggunakan tool online. Cara kerjanya juga mudah. Tool ini membuang script yang tidak terpakai. Cara pakainya
- Buka disini.
- Copy HTML anda lalu pastekan HTML anda ke sana.
- Code typenya Blogger.
- Lalu tekan Compress.
- Setelah selesai select all dan copy dan pastekan di HTML blog anda
2. Menambah Script Pencepat Loading Blog
Cara kedua adalah dengan menambah script untuk menambah kecepatan blog. Langkahnya sebagai berikut :
1. Buka Template
2. Edit Template
3. Cari Code </head>
4. pastekan code ini di atas </head>
<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script src='http://cuerosb.googlecode.com/files/cueros%20-lazyload.js' type='text/javascript'/>
<script charset='utf-8' type='text/javascript'>
$(function() {
$("img").lazyload({placeholder :
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb60RIba_dqj2oyBIqQ7mMWQNdQw2-QuE6IxeIQnEvOZk5Ht5ULQfNSRZaU0BI83MzHGW8Jpkg8VVI4_Poixw18lFPDRSIWxwNXMpv1rKFfaOe5ED9KBPiUMz3k2Gk3caG8CSiSGeUIeU/",threshold
: 200});
});
</script>
5. Save Template
Mudah kan menambah kecepatan loading blogmu, selamat mencoba ^-^
Postingan
