Back To Top AMP Blog

Back To Top Valid AMP, Back To Top Valid AMP with CSS and HTML, Back To Top Valid AMP blogger, Back To Top Valid AMP fast no Jquery - Sebuah halaman website yang tampil cantik merupakan hal yang didinginkan oleh para kaum user website terutama blogger dalam membangun sebuah website sehingga tampil elegan dan membuat antusias para visitor agar lebih terpikat dengan tampilan yang bagus.

Pembuatan tampilan cantik salah satu nya yakni dengan adanya penambahan suatu widget widget tertentu tentunya yang memberikan antusias pengunjung yang mengunjungi website tersebut.

Salah satu dari widget yang cantik pun tidak lah hanya membuat antusias para pengunjung saja pastinya, fitur memudahkan para pengunjung yang penting terutama.

Dengan cara membantu agar visitor mempermudah nya mengakses website atau blogger kita terutama, cara nya pun salah satu nya dengan adanya fitur kembali ke atas yang bertujuan untuk memudahkan pengunjung jika mereka sudah berada pada halaman bawah website maka mereka dapat kembali keatas halaman lagi hanya dengan menyentuh fitur dari kembali ke atas tersebut atau biasa yang disebut fitur "Back To Top".

Ya Back To Top, back to top merupakan salah satu fitur yang sudah biasa diterapkan pada website website tertentu terutama blogger, yang memudahkan kita baik user maupun pengunjung agar lebih mudah kembali pada halaman atas sebuah tempilan pada suatu website atau blogger tersebut.

Back To Top ini pun yang akan AA Sciences berikan pada kali ini pun memiliki fitur yang simpel yang dimana tidak lah menggunakan fitur Jquery yang dimana pula biasa nya fitur Jquery jika diterapkan sangatlah berat jika diketahui.

Baca Juga : Back To Top tanpa Jquery

Tetapi di kali ini AA Sciences alhamdulillah menerapkan nya tanpa script Jquery, melainkan hanya menerapkan dengan tambahan sedikit CSS dan HTML maka secara otomatis widget back to top kalian sudah berfungsi sepenuhnya dengan otomatis kembali pada halaman atas sebuah website tampilan.

Bagaimana, kalian sudah tertarik bukan dengan adanya widget back to top yang memudahkan pengunjung kembali menuju ke atas, script tidak memakai Jquery, simple fitur, responsive, dan terpenting mebuat tampilan cantik juga (hehe).
Langsung saja, jika kalian sudah penasaran, maka simak tutor pemasang nya di bawah ini.

Cara Membuat Back To Top Valid AMP di Blogger

Pembuatan CSS nya terlebih dahulu :

Pastikan kalian sudahlah Login terlebih dahulu pada akun Blogger kalian.

Template - > Edit HTML - > CTRL+F (untuk memudahkan pencarian) lalu cari kode ]]></b:skin> atau dapat juga kode </style> atau tag tertentu yang ingin kalian terapkan.

Jika sudah ditemukan kode ]]></b:skin> atau </style> nya tadi, langsung saja kalian Salin kan Script CSS/Back To Top Valid AMP nya di bawah ini tepat sebelum tag ]]></b:skin> atau </style> atau tag AMP tertentu seperti halaman yang diinginkan, berikut CSS nya :

/* css back to top */

#fab{background:#fff;border-radius:50%;bottom:25px;box-shadow:0 0 4px rgba(0,0,0,.14),0 4px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26);padding:15px 16px 11px;position:fixed;right:25px;transition:all 450ms cubic-bezier(0.23,1,0.32,1) 0ms;z-index:99999}

#fab:hover{box-shadow:0 0 4px rgba(0,0,0,.14),0 8px 8px rgba(0,0,0,.28),0 2px 5px 0 rgba(0,0,0,.26)}

Kalian dapat mengubah warna tertentu nya, dengan kode warna HTML tertentu.

Penerapan Agar Back To Top Valid AMP Blogger nya tampil dengan HTML

Masih dalam mode Template - > CTRL+F - > Lalu cari tag </body> biasa nya tag tersebut terletak pada bagian paling bawah sebuah Template - > Jika sudah masukkan script HTML pemanggil nya di bawah ini tepat sebelum </body> tadi, berikut script nya :

<a href='#top' title='Back To Top'>

        <div id='fab'>

          <svg height='24' viewBox='0 0 48 48' width='24'><path d='M24 16L12 28l2.83 2.83L24 21.66l9.17 9.17L36 28z' fill='#827717'/></svg>

        </div>

      </a>

Dan ending steps, langsung saja Simpan Template dan lihat hasil nya.

Share this post