Deskripsi

Kalian mencari tutorial cara merubah teks agar teks tersebut bisa dirubah ukurannya agar bisa dibesarkan atau dikecilkan sesuai keinginan kita dan sama seperti milik blog ini? yap kali ini admin membagikan kodenya secara cuma - cuma.

Apa itu Text Resizer?

Sebuah alat atau fitur pada sebuah website yang memungkinkan pengguna untuk mengubah ukuran font teks pada halaman tersebut. Ini membantu pengguna untuk membuat teks lebih mudah dibaca dengan mengubah ukurannya sesuai dengan kebutuhan mereka. Fitur ini sangat berguna bagi pengguna dengan masalah penglihatan, karena memungkinkan mereka untuk membuat teks lebih besar atau lebih kecil untuk memudahkan bacaan.

Cadangkan tema terlebih dahulu untuk menghindari terjadinya kesalahan atau kegagalan pemasangan

Cara Membuat Tombol Text Resizer di Blogger

1. Pertama buka Dashboard Blogger
2. Selanjutnya pergi ke menu Theme atau Tema lalu pilih menu Edit HTML
3. Kemudian cari kode </head> atau </head> menggunakan tombol CTRL + F
4. Jika sudah ketemu salin kode CSS di bawah ini dan tempel di atas </head> atau </head>

<style>
/* Text Resizer */
.Tresizerts{position:fixed;right:25px;bottom:150px;background:#ffffff;box-shadow:0 0 5px #000000;border-radius:5px;box-sizing:border-box;z-index:1;transition:all .3s linear}
.darkMode .Tresizerts{background:#121212;color:#ffffff;box-shadow:0 0 5px #ffffff}
#Ifont,#Dfont{font-size:18px;padding:10px;box-sizing:border-box;background:#ffffff;color:#000000}
.darkMode #Ifont,.darkMode #Dfont{background:#121212;color:#ffffff;border-color:#ffffff} 
#Ifont{border-radius:5px 5px 0 0;border-bottom:.5px solid #000000} 
#Dfont{border-top:.5px solid #000000} #Dfont{border-radius:0 0 5px 5px} 
#Ifont:hover,#Dfont:hover{background:linear-gradient(to right,#f81894,#0000ff);color:#ffffff}
</style>
<script src='https://code.jquery.com/jquery-3.6.0.min.js'></script>

5. Selanjutnya cari kode </body> atau </body> menggunakan tombol CTRL + F
6. Jika sudah ketemu salin kode HTML dan JavaScript ini di bawah dan tempel sebelum </body> atau </body>

Jangan lupa support blog ini dengan cara berdonasi di Sociabuzz atau Trakteer.id

<b:if cond='data:view.isPost'>
<div class='Tresizerts'>
<div id='Ifont'>A+</div>
<div id='Dfont'>A-</div>
</div>
</b:if>
<script>/*<![CDATA[*/ 
$("").ready(function(){$("#Ifont").click(function(){curSize=parseInt($(".postBody").css("font-size"))+1,curSize<=20&&$(".postBody").css("font-size",curSize)}),$("#Dfont").click(function(){curSize=parseInt($(".postBody").css("font-size"))-1,curSize>=10&&$(".postBody").css("font-size",curSize)})});
/*]]>*/</script>

7. Kemudian simpan Theme atau Tema.

Penutup

Jangan lupa meninggalkan jejak dengan cara berkomentar, supaya admin yang menuliskan tau kalau kalian membacanya dan jika ada saran bisa kalian tulis di komentar yaa...