Cara menyesuaikan tombol Immersive Reader

Artikel ini menunjukkan cara menyesuaikan tombol yang meluncurkan Immersive Reader agar sesuai dengan kebutuhan aplikasi Anda.

Menambahkan tombol Immersive Reader

SDK Pembaca Imersif menyediakan gaya default untuk tombol yang meluncurkan Immersive Reader. Gunakan atribut kelas immersive-reader-button untuk mengaktifkan gaya ini.

<div class='immersive-reader-button'></div>

Mengkustomisasi gaya tombol

Gunakan atribut data-button-style untuk mengatur gaya tombol. Nilai yang diizinkan adalah icon, text, dan iconAndText. Nilai default-nya adalah icon.

Tombol ikon

<div class='immersive-reader-button' data-button-style='icon'></div>

Ini merender berikut ini:

Ini adalah tombol Teks yang dirender

Tombol teks

<div class='immersive-reader-button' data-button-style='text'></div>

Ini merender berikut ini:

Ini adalah tombol Immersive Reader yang dirender.

Ikon dan tombol teks

<div class='immersive-reader-button' data-button-style='iconAndText'></div>

Ini merender berikut ini:

Tombol ikon

Mengustomisasi tombol teks

Mengonfigurasi bahasa dan teks alternatif untuk tombol menggunakan atribut data-locale. Bahasa defaultnya adalah bahasa Inggris.

<div class='immersive-reader-button' data-locale='fr-FR'></div>

Mengustomisasi ukuran ikon

Ukuran ikon Immersive Reader dapat dikonfigurasi menggunakan atribut data-icon-px-size. Ini mengatur ukuran ikon dalam piksel. Ukuran defaultnya adalah 20px.

<div class='immersive-reader-button' data-icon-px-size='50'></div>

Langkah berikutnya