Pada kesempatan kali ini aku akan membahas mengenai Reading Time di blogger.
Reading time atau waktu membaca merupakan sebuah widget atau dapat kita sebut sebagai fitur yang dapat kita gunakan untuk mengetahui rata-rata waktu yang di habiskan untuk membaca sebuah artikel atau postingan di blog tersebut.
Perkiraan usang waktu untuk membaca artikel atau postingan blog ini di peroleh dari hasil kalkulasi rata-rata seluruh pengunjung blog Anda yang telah membaca artikel tersebut.
Semakin usang waktu yang di habiskan pengunjung blog Anda, maka semakin anggun alasannya ini dapat mengurangi nilai bounce rate blog Anda. Apa itu bounce rate ? bounce rate atau rasio pantulan adalah sesi satu halaman dibagi dengan semua sesi, atau persentase semua sesi di situs saat pengguna hanya melihat satu halaman dan hanya memicu satu seruan ke server.
Baca juga: Cara Mendaftarkan Blog Ke Google Analytics
Sebenarnya memasang reading time di blog ini tidak terlalu penting, berafiliasi aku sedang menciptakan template gres dan memakai fitur reading time ini jadi aku buat postingan ini, siapa tau ada yang ingin menambahkannya pada blog Anda.
Jika Anda paham dengan kode-kode html, css, dan j4vascript mungkin Anda dapat melaksanakan modifikasi untuk widget reading time ini supaya sesuai dengan situs atau blog Anda. Tapi kalau gak paham sama sekali lebih baik ikuti arahan yang ada saja.
Cara Membuat Reading Time di Blog
Baik pribadi saja, kalau Anda tertarik untuk menciptakan reading time atau waktu baca di postingan blogger silahkan ikuti langkah-langkanya bawah ini.Langkah pertama, masukkan arahan font awesome. Caranya buka blogger.com > Tema > Edit HTML > cari arahan
<b:skin> > kemudian Copy arahan di bawah ini kemudian Paste di atas arahan <b:skin>.<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>Catatan:
Jika template blog Anda sudah mempunyai arahan font awesome sebelumnya atau Anda tidak ingin menggunakannya maka langkah ini dapat di lewat saja.
Langkah kedua, cari arahan
]]></b:skin> atau </style> kemudian Copy arahan css di bawah ini dan Paste sebelum arahan ]]></b:skin> atau </style>.span.right {float:right;display:inline-block;padding:10px 5px;}Catatan:
Untuk mengubah goresan pena menjadi abjad kapital silahkan tambahkan arahan css ini
text-transform:uppercase; sebelum arahan float.Langkah ketiga, cari arahan
</body> kemudian Copy arahan j4vascript di bawah ini kemudian Paste di sebelum arahan </body>.<script type='text/j4vascript'> //<![CDATA[ // Reading Time Author: Michael Lynch http://michaelynch.com Licensed under the MIT license !function(e){e.fn.readingTime=function(n){var t={readingTimeTarget:".eta",wordCountTarget:null,wordsPerMinute:270,round:!0,lang:"en",lessThanAMinuteString:"",prependTimeString:"",prependWordString:"",remotePath:null,remoteTarget:null,success:function(){},error:function(){}},i=this,r=e(this);i.settings=e.extend({},t,n);var a=i.settings;if(!this.length)return a.error.call(this),this;if("it"==a.lang)var s=a.lessThanAMinuteString||"Meno di un minuto",l="min";else if("fr"==a.lang)var s=a.lessThanAMinuteString||"Moins d'une minute",l="min";else if("de"==a.lang)var s=a.lessThanAMinuteString||"Weniger als eine Minute",l="min";else if("es"==a.lang)var s=a.lessThanAMinuteString||"Menos de un minuto",l="min";else if("nl"==a.lang)var s=a.lessThanAMinuteString||"Minder dan een minuut",l="min";else if("sk"==a.lang)var s=a.lessThanAMinuteString||"Menej než minútu",l="min";else if("cz"==a.lang)var s=a.lessThanAMinuteString||"Méně než minutu",l="min";else if("hu"==a.lang)var s=a.lessThanAMinuteString||"Kevesebb mint egy perc",l="perc";else var s=a.lessThanAMinuteString||"Less than a minute",l="min";var u=function(n){if(""!==n){var t=n.trim().split(/\s+/g).length,i=a.wordsPerMinute/60,r=t/i;if(a.round===!0)var u=Math.round(r/60);else var u=Math.floor(r/60);var g=Math.round(r-60*u);if(a.round===!0)u>0?e(a.readingTimeTarget).text(a.prependTimeString+u+" "+l):e(a.readingTimeTarget).text(a.prependTimeString+s);else{var o=u+":"+g;e(a.readingTimeTarget).text(a.prependTimeString+o)}""!==a.wordCountTarget&&void 0!==a.wordCountTarget&&e(a.wordCountTarget).text(a.prependWordString+t),a.success.call(this)}else a.error.call(this,"The element is empty.")};r.each(function(){null!=a.remotePath&&null!=a.remoteTarget?e.get(a.remotePath,function(n){u(e("<div>").html(n).find(a.remoteTarget).text())}):u(r.text())})}}(jQuery); $(function(){$('.post-body').readingTime();}); //]]> </script>Langkah keempat, kini kita tentukan dimana letak untuk menempatkan goresan pena "... MIN READ", kalau saran aku mending di letakan paling atas di bawah judul artikel atau dapat dibagian post-info ibarat nama penulis, waktu post, komentar, dan disampingnya waktu membaca atau dapat juga Anda atur sendiri penempatannya. Untuk mencobanya silahkan Copy arahan di bawah ini kemudian Paste sebelum kode <div class='post-info'> atau dapat diletakan dibagian mana saja yang Anda inginkan.
<span class='right'><i class='fa fa-clock-o'/> <span class='eta'/> Read</span>Hasilnya akan ibarat pada gambar di bawah ini.
Itulah artikel mengenai cara menciptakan reading time di blogger, semoga dapat bermanfaat untuk Anda. Jika mempunyai saran maupun pertanyaan silahkan menambahkan komentar di bawah ini atau dengan menghubungi kami melalui halaman kontak.
Sumber http://www.caramanual.com