Bagaimana Mengubah Warna Tombol 'Selanjutnya' di Tumblr

Pengenalan

Tema Tumblr bisa sangat kompleks karena ditulis oleh berbagai pengembang. Untuk menyesuaikan tampilan tombol "Selanjutnya", Anda harus menyesuaikan kode CSS dalam tema Anda.

Cara Memulai

Buka halaman Customisasi blog Tumblr Anda, lalu klik tautan Edit HTML di bagian atas panel. Ini akan membuka kode sumber tema.

Mencari Variabel {NextPage}

Tekan Ctrl+F (atau Cmd+F pada Mac) dan ketik {NextPage}. Pastikan variabel ini berada di dalam blok {block:Pagination}—bagian yang mengatur tombol "Previous" dan "Next".

Menentukan Kelas CSS Tombol "Selanjutnya"

Di dalam kode HTML, cari elemen yang berhubungan dengan tombol "Selanjutnya". Kelas biasanya ditandai dengan atribut class="nama-kelas". Ada dua kemungkinan:

• Tombol memiliki kelas khusus.
• Tombol menggunakan kelas yang sama dengan elemen lain.

Jika kelasnya berbagi gaya dengan elemen lain, Anda dapat:

• Ubah warna di kelas tersebut (mungkin memengaruhi elemen lain).
• Atau buat kelas baru dan gantikan kelas lama.

Membuat dan Menambahkan Kelas Custom

Gunakan fitur Find lagi untuk mencari kelas CSS di bagian <style> atau file CSS tema. Kelas baru ditulis seperti ini:

.my-next-page {
    /* gaya akan ditambahkan di sini */
}

Selanjutnya, terapkan kelas tersebut pada elemen tombol di bagian HTML:

<a href="{NextPage}" class="my-next-page">Selanjutnya</a>

Ubah Warna Teks dan Latar Belakang

Di dalam kelas custom, tambahkan properti CSS berikut:

color: #ff69b4;          /* warna teks */
background: #000000;      /* warna latar belakang */
/* Tambahkan border atau bayangan jika diperlukan */
border: 1px solid #ff69b4;
box-shadow: 0 2px 4px rgba(0,0,0,0.3);

Setelah selesai, simpan perubahan dan periksa hasilnya di blog Anda. Jika tema Anda menggunakan endless scrolling, pertimbangkan beralih ke tema yang menggunakan paginasi.

URL:https://komputer.whycomputer.com/Internet/101319020.html