Cara Membuat Back To Top Di Bawah Halaman Posting

Kali ini kita akan membuat link Back to Top di posting. Link Back to Top ini akan muncul pada bagian bawah posting. Linknya dapat berupa tulisan atau dapat diganti dengan gambar seperti yang terlihat pada tabel di bawah ini.

Back to Top tulisan	Back to Top gambar

Untuk membuat 'Back to Top' di posting, Anda dapat menyimak langkah-langkahnya di bawah ini.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk mem-backup template.

4. Beri tanda centang pada Expand Template Widget.

5. Cari kode yang seperti di bawah ini atau kode untuk icon email. Untuk mempercepat pencarian, tekan Ctrl + F, kemudian ketikkan kode yang akan dicari.


<b:if cond='data:post.emailPostUrl'>
          <span class='item-action'>
          <a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
              <img alt='' class='icon-action' height='13' src='http://www.blogger.com/img/icon18_email.gif' width='18'/>
          </a>
          </span>
        </b:if>


6. Untuk membuat link Back to Top, silakan tambahkan kode <a href='#'>Back to Top</a> setelah kode sumber gambar icon email sehingga kodenya menjadi seperti di bawah ini :

<b:if cond='data:post.emailPostUrl'>
          <span class='item-action'>
          <a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
              <img alt='' class='icon-action' height='13' src='http://www.blogger.com/img/icon18_email.gif' width='18'/>
          </a><a href='#'>Back to Top</a>
          </span>
        </b:if>

•  Tulisan Back to Top dapat Anda ganti sesuai keinginan Anda, misalnya Kembali ke Atas.

7. Jika ingin mengganti tulisan Back to Top dengan gambar, silakan tambahkan kode di atas dengan kode URL gambar Anda.

Contoh :

<b:if cond='data:post.emailPostUrl'>
          <span class='item-action'>
          <a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
              <img alt='' class='icon-action' height='13' src='http://www.blogger.com/img/icon18_email.gif' width='18'/>
          </a><a href='#' title='Kembali ke Atas'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidvTHuDXbVxVy8PawYN31V3YtjklMF9dqwd1xVpGI11-fSs_A8sfORKdmxQXFbBw1JRm-yvc47kuMszZHiLukFCgnlT7v5LwSsYNZKFwWc4lKCen2fOr-CQXzpElttmy_JrtezVET4MSU0/s1600/Up.jpg'/></a>
          </span>
        </b:if>

• Anda dapat mengganti judul Kembali ke Atas sesuai keinginan Anda dan ganti URL gambar-nya dengan URL gambar Anda sendiri.

8. Klik tombol SIMPAN TEMPLATE.



Sumber : Klik Munadi

Anda telah membaca artikel tentang Cara Membuat Back To Top Di Bawah Halaman Posting dan anda bisa menemukan artikel ini dengan url http://binhakim.blogspot.com/2011/08/cara-mebuat-back-to-top-di-bawah.html, anda boleh menyebarluaskannya atau mengcopy paste-nya jika artikel Cara Membuat Back To Top Di Bawah Halaman Posting ini dirasa bermanfaat bagi teman-teman anda,namun jangan lupa untuk meletakkan link Cara Membuat Back To Top Di Bawah Halaman Posting sebagai sumbernya.
Terima Kasih

Artikel Yang Berhubungan :