Minggu, 21 April 2013

Cara Membuat Tombol Back To Top Blog WordPress Tanpa Plugin

Cara Membuat Tombol Back To Top Blog WordPress Tanpa Plugin

Bismillah, Pada artikel saya sebelumnya saya sudah membahas cara membuat back to top khusus pengguna blogspot dan pada kesempatan ini saya akan menunjukkan cara membuat tombol back to top blog wordpress tanpa plugin. Dalam artikel ini khusus pengguna wordpress self hosting.
Ok sobat langsung saja
  1. Login ke admin wordpress, kemudian pilih Appearance > Editor
  2. Pada jendela Edit Themes pilih file footer.php pada themes sobat
  3. Tempatkan kode dibawah ini tepat diatas kode </body> :
    <!-- Back To Top -->
    <!-- jquery -->
    <script type="text/javascript" src="http://belajar-komputer.googlecode.com/svn/trunk/www.andisyam.web.id/js/jquery-1.9.1.min.js"></script>
    <!-- easing plugin ( optional ) -->
    <script type="text/javascript" src="http://belajar-komputer.googlecode.com/svn/trunk/www.andisyam.web.id/js/easing.js"></script>
    <!-- BacktoTop plugin -->
    <script type="text/javascript" src="http://belajar-komputer.googlecode.com/svn/trunk/www.andisyam.web.id/js/totop.js"></script>
    <!-- Starting the plugin -->
    <script type="text/javascript">// <![CDATA[
      $(document).ready(function() {
       /*
       var defaults = {
          containerID: 'toTop', // fading element id
        containerHoverID: 'toTopHover', // fading element hover id
        scrollSpeed: 1200,
        easingType: 'linear' 
        };
       */
       $().UItoTop({ easingType: 'easeOutQuart' });
      });
    
    // ]]></script>
    Bagi sobat yang ingin menyimpan file javascript pada hosting sobat sendiri, tepatnya di directory themes sobat, seperti contohnya file jquery-1.9.1.js saya simpan dalam folder /library/js/, berikut ini adalah kode php untuk memanggil file javascript tersebut :
    <script src="<?php bloginfo('template_directory'); ?>/library/js/jquery-1.9.1.min.js" type="text/javascript"></script>
  4. Update file
Mudah bukan dan Insya Allah akan jalan pada cms wordpress versi 3.5.1, dan untuk demo bisa dilihat pada blog saya ini. Selamat mencoba dan Wassalam. NP2T77TJQ9TU

Tidak ada komentar:

Total Tayangan

Banner1