Bookmark Blogger super premium yang kece dan keren dengan fitur responsive, tampilan harmonis dan dapat menambah pesona yang unik pada blog anda. Bookmark blogger bisa digunakan sebagai penanda (bookmark) untuk halaman artikel blog. Bookmark blogger memiliki fungsi seperti layaknya sebuah fitur bookmark yang ada pada browser, bedanya bookmark blogger ini menggunakan javascript local storage internal sebagai data base untuk menyimpan data URL halaman artikel blog. Buat yang tertarik untuk memasang bookmark blogger ini, silakan disimak tutorialnya.

Apa Sih Bookmark ?

Bookmark diartikan sebagai penanda yang merupakan fasilitas browser yang biasanya digunakan oleh pembaca untuk menandai situs yang disukai atau di favoritkan agar mudah diakses kembali dilain waktu dengan mudah dan cepat tanpa harus menghapal alamat (URL) situs web tersebut.

Jadi pada prinsipnya bookmark itu adalah merupakan fasilitas yang ada pada sebuah browser seperti google chrome, mozilla, internet explorer, opera dan aplikasi browser lainnya untuk menyimpan alamat atau nama sebuah website dan mengelompokkan alamat url sesuai dengan topik atau tema yang ditentukan sehingga pembaca dapat dengan mudah mengakses halaman web tersebut dengan cepat.

Akses cepat untuk menandai situs web kedalam bookmark yaitu dengan menekan kombinasi tombol keyboard Ctrl + D pada browser PC sedangkan pada browser mobile biasanya terletak pada akses menu umum yang terdapat pada browser mobile.

Apa Sih Bookmark Blogger ?

Fungsi dan tujuannya hampir sama dengan bookmark browser, yaitu untuk mempermudah pengunjung blog dengan menandai halaman artikel blog yang disukai atau difavoritkan.

Tujuan Bookmark Blogger

Bookmark blogger merupakan salah satu widget atau fitur pelengkap untuk sebuah blog, gunanya adalah agar pengunjung blog dapat dengan mudah dan cepat mengakses halaman artikel dilain waktu, tanpa harus menghapal alamat (URL) lengkap dari halaman artikel yang disukai atau difavoritkan tersebut.

Cara Kerja Bookmark Blogger

Sedikit penjelasan, pada fitur bookmark blogger ini saya menggunakan system localStorage sebagai penyimpan aktifitas pengguna yang dimana sistem ini dapat menyimpan data pembaca seperti pada fitur cookie (data yang disimpan didalam browser) sehingga daftar artikel favorit yang ditambah oleh pengguna tidak akan hilang meskipun browser di refresh atau berpindah halaman artikel lainnya yang ada pada suatu blog.

Contoh penggunaan bookmark blogger ala CodeFlare seperti yang digunakan pada blog CodeFlare atau seperti yang terlihat pada gambar di bawah ini.

Cara pemasangan bookmark blogger hampir sama dengan cara untuk memasang widget blog tinggal copy-paste kode di bawah ini kemudian masukan kedalam kotak gadget blog atau tekan tombol "Add to Blogger" di bawah untuk menghindari kesalahan pemasangan sekaligus mempercepat proses pemasangan widget bookmark blogger.

KETERANGAN

Pada Kode :
var elmImgSource = '.separator:eq(0)';

Merupakan kode untuk menentukan variabel ID atau class dari tag gambar yang digunakan pada artikel blog, Silakan anda tentukan nama ID atau class yang mengapit tag gambar pertama yang ada di dalam artikel.

Biasanya pada penggunaan standar blogspot untuk tag gambar diapit oleh tag div menggunakan nama class separator. Jika berbeda silakan anda sesuaikan dengan kode tag yang anda gunakan.

Adapun cara mengetahui ID atau class dari tag gambar yang digunakan pada artikel blog adalah sebagai berikut.

Menggunakan browser chrome pada PC, silakan anda buka salah satu halaman artikel yang ada diblog anda, tekan tombol keyboard F12 untuk membuka panel Developer Tool, kemudian tekan tombol panah kecil yang terletak dibagian kiri bawah panel, setelah itu arahkan pada gambar pertama yang ada dilayar monitor.


Lihat elemen div yang mengapit kode untuk tag gambar artikel. Copy elemen class yang digunakan dalam hal ini sebagai contoh admin menggunakan class dengan nama separator.


Setelah mendapatkan nama elemen class maka selanjutnya silakan anda gunakan sebagai input pada kode di atas. Sebagai contoh seperti yang terlihat di bawah ini.

var elmImgSource = '.separator:eq(0)';

Tanda titik (.) merupakan identitas untuk nama class sedangkan apabila menggunakan nama ID menggunakan tanda pagar (#). Penggunaan kode :eq(0) merupakan kode yang berarti elemen class yang digunakan adalah elemen dengan nama separator pada urutan yang pertama karena dalam kode program angka default pertama dimulai dari angka nol.

Pada Kode :
var elmTitlePage = '.entry-title:eq(0)';

Merupakan kode untuk menentukan variabel ID atau class dari tag judul yang digunakan pada artikel blog. Silakan anda tentukan nama ID atau class yang mengapit tag judul artikel.

Cara mengetahui ID atau class dari tag judul yang digunakan pada artikel blog caranya hampir sama dengan cara untuk mengetahui tag pada elemen gambar.




Pada Kode :
var noImgSource = 'https://1.bp.blogspot.com/-0lazV8sAMd4/Xec3HSEXXuI/AAAAAAAACEs/6NJU_5YVvBAO59fb3T271t2ZnJ1UVyGEQCPcBGAYYCw/s0/office%2Bgirl.jpg';

Merupakan kode untuk variabel URL gambar default, silakan anda ganti dengan URL gambar default yang ingin anda gunakan.

Bagi anda yang ingin mengetahui source code dari bookmark blogger yang admin buat, anda dapat mendownloadnya pada link di bawah ini. Source code bookmark blogger dibuat menggunakan file html yang bisa anda buka menggunakan program text editor seperti notepad dan sejenisnya. Link download source code menggunakan jasa iklan adfly, harap dimaklumi.

Demikian artikel blog tentang Cara Memasang Bookmark Blogger Pada Halaman Blog terima kasih sudah berkunjung, jangan lupa Like, Share dan Subscribe, untuk pertanyaan, kritik ataupun saran silakan ditulis pada kotak komentar di bawah. Apabila ada kata-kata yang kurang berkenan atau informasi yang kurang akurat, harap dimaklumi. Akhir kata Semoga Bermanfaat.