Skip to main content

Cara Mengubah ScrollBar Blog Di Chrome Menjadi Lebih Menarik

Cara Mengubah ScrollBar Blog Di Chrome Menjadi Lebih menarik
Cara Mengubah Scrollbar Blog Supaya Lebih Keren

Mengubah scrollbar blog di chrome - Para pemilik blog di blogger atau blogspot diharuskan menjadikan tampilan blognya menjadi unik dan juga kreatif supaya berkesan di mata visitor. Blog yang unik akan membuat blog kamu mudah dikenal orang lain dan mempunyai ciri tersendiri. Ciri tersebutlah yang membedakan antara blog kamu dengan blog orang lain.

Singkat cerita blog amtread mungkin terkenal akan desainnya yang simpel dan juga membosankan karena tidak menampilkan gambar pada bagian home page layaknya blog orang lain. Meski begitu saya tetap tidak mau mengganti template blog lantaran saya berharap blog saya berkesan bermanfaat dan memiliki ciri khusus yaitu tampilan yang sederhana. Blog amtread juga dihiasa berbagai fitur seperti address bar browser berwarna ketika mengakses amtread menggunakan hp atau mobile, dan sekarang amtread juga ketika diakses menggunakan chrome maka scrollbarnya akan berbeda tampilannya.

Baca juga: Cara Mengubah Warna Address Bar Blog

Kamu untuk mengubah scrollbar pada blog hanya perlu copy paste kode di bawah ini dan kemudian kamu tinggal tempatkan di tempat yang tepat sehingga membuat scrollbar kamu berubah layaknya super man dan berubah kearah yang lebih baik layaknya hijrah.

Jika kamu ingin mendesain sendiri scrollbar blog kamu, alangkah baiknya jika kamu mengetahui ilmu dasar CSS dan juga HTML karena itu sangat berpengaruh ketika kamu ingin mendesain template blog kamu entah itu mengedit menu navigasi, membuat efek kelap-kelip, dan sebagainya.

Oke langsung saja masuk ke bagian cara mengubah scrollbar blog di chrome supaya tampil menjadi lebih menarik.

Baca juga: Cara Submit Url Ke Webmaster Bing Dan Yahoo

Cara Mengubah Scrollbar Blog Di Chrome

1. Pertama-tama kamu masuk ke mode edit html terlebih dahulu. Kamu bisa menemukannya di bagian Tema sebelah kiri dashboard blogger.



2. Kamu silahkan copy code di bawah ini terlebih dahulu.

body::-webkit-scrollbar {
 width: 5px;
 background-color: #EAEAEA;
}
/* get code scrollbar amtread.com */
body::-webkit-scrollbar-thumb{
 border-radius: 5px;
 background: linear-gradient(#EAEAEA, #ff0000);
 

Note: -  #EAEAEA dan #ff0000 : kode warna yang dapat kamu ubah sesuka hati.
          - border-radius : Membuat melengkung sudut persegi (bisa menggunakan px ataupun persen).

3. Kemudian kamu paste kode tersebut tepat di bawah <style> atau sebelum </style>. Maka akan tampil seperti gambar di bawah ini.



4. Jika sudah lalu tinggal klik save saja.



Maka otomatis tampilan scroll bar blog kamu akan menjadi seperti ini.



Nah itu dia cara membuat atau mengubah scroll bar blog ketika dibuka menggunakan browser chrome melalui komputer ataupun laptop. Lalu perhatikan sedikit informasi di bawah ini dari devarise.

Jenis kode css untuk mengedit scroll bar browser chrome

::-webkit-scrollbar { /* 1 */ }
::-webkit-scrollbar-button { /* 2 */ }
::-webkit-scrollbar-track { /* 3 */ }
::-webkit-scrollbar-track-piece { /* 4 */ }
::-webkit-scrollbar-thumb { /* 5 */ }
::-webkit-scrollbar-corner { /* 6 */ }
::-webkit-resizer { /* 7 */ }

dan begini fungsi setiap jenis css di atas berdasarkan nomor di atas seperti gambar di bawah ini.


Nah kamu bisa pahami sendiri dan kamu bisa terapkan serta setting-setting sesuka hati berdasarkan kemampuan kamu. Namun tutorial di atas sudah cukup membuat scrollbar blog lebih menarik dibandingkan tampilan scrollbar defaultnya.

Baca juga: Cara Mengganti Template Blog Dengan Mudah

Sekian artikel dari amtread.com mengenai Cara Mengubah ScrollBar Blog Di Chrome Menjadi Lebih Menarik, silahkan kamu kreasikan sendiri dan sebarkan ke teman-teman kamu artikel ini jika kamu anggap artikel ini mungkin bermanfaat bagi mereka.
Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar