Cara Menampilkan Reading Time Pada Setiap Artikel Di Blog

Cara Menampilkan Reading Time Pada Setiap Artikel di Blog Cara Menampilkan Reading Time Pada Setiap Artikel di Blog

Cara Menampilkan Reading Time Pada Setiap Artikel di Blog - Dengan menambahkan fitur Reading Time ini teman sanggup tau asumsi artikel teman akan dibaca hingga selesai, semakin usang semakin anggun apalagi pengunjung mengunjungi halaman lain pada blog teman ini juga sanggup menurunkan bounce rate pada blog sobat.

Baca Juga : 20 Cara Paling Efektif Menurunkan Bounce Rate Pada Blog

Reading Time ini juga tidak terlalu penting bagi blog tapi setidaknya akan menambah fitur saja pada blog teman untuk disajikan oleh pengunjung, jadi buatlah pengunjungmu betah di blogmu sobat.

Oke eksklusif saja ke caranya..

Cara Menampilkan Reading Time Pada Setiap Artikel di Blog


Pertama, kalau blog teman belum dipasang Font Awesome silahkan pasang terlebih dahulu Blogger > Tema > Edit HTML copy aba-aba dibawah ini pastekan diatas aba-aba </head>

<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>

Catatan: Jika blog teman sudah terdapat Font Awesome silahkan lewati langkah diatas

Kemudian copy aba-aba dibawah ini dan pastekan sempurna diatas aba-aba </style> atau ]]></b:skin> 

span.right {float:right;display:inline-block;padding:10px 5px;}

Copy juga aba-aba di bawah ini dan pastekan diatas aba-aba </body>

<script type='text/javascript'> //<![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>

Kode terakhir yaitu penempatan reading timenya misalkan teman terapkan diantara awal postingan copy aba-aba dibawah ini dan pastekan sesuai selera teman sendiri.

<span class='right'><i class='fa fa-clock-o'/> <span class='eta'/></span>

Jika sudah klik simpan.

Oke sekianyang sanggup aku sampaikan tentang Cara Menampilkan Reading Time Pada Setiap Artikel di Blog Terma Kasih yang sudah berkunjung agar bermanfaat bagi kalian semua.

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel