Kustomisasi Bagian Tajuk Blog Blogger.com Anda

April 30, 2024

Dalam tutorial terakhir, kami mengkustomisasi bagian Tautan untuk Blogger Anda^TM weblog. Sekarang, kami akan menyesuaikan bagian Header di bagian atas blog. Header berisi judul dan deskripsi blog Anda. Kami akan mengubah jenis huruf, atau font, untuk teks dan menambahkan latar belakang berwarna.

Seperti dalam tutorial terakhir, kami akan melakukan peningkatan ini dengan mengubah beberapa baris kode HTML templat. Klik pada tab Template di menu di bagian atas halaman yang akan membawa Anda ke bagian Edit Template saat ini. Anda akan menemukan kode HTML untuk templat di kotak di bawah ini. Kami akan membuat beberapa perubahan pada kode gaya CSS. (Untuk mengetahui lebih lanjut tentang Cascading Style Sheets, ikuti tautan di bawah ini.) Gulir ke bawah kode sampai Anda mencapai bagian Header dalam tag gaya CSS. Seperti yang Anda lihat, tag gaya sangat panjang dan bagian Header dari tag gaya memiliki enam bagian.

@media semua
@ media genggam
#judul blog
# judul blog a
# Judul blog a: arahkan kursor
#deskripsi

Bagian pertama dari kode (@media semua) mengontrol karakteristik Header termasuk lebar, margin dan ukuran batas. Bagian kedua (@media handheld) mewarisi karakteristik ini dari bagian pertama dan juga mengubah lebar Header menjadi 90 persen untuk monitor genggam. Karena kami ingin warna latar belakang baru untuk digunakan dalam kedua kasus, kami akan menambahkan baris kode untuk warna latar belakang di bagian pertama (@media semua). Baris kode baru ini dicetak tebal di bawah ini. Pada contoh di bawah ini, kami telah menggunakan warna abu-abu terang tetapi merasa bebas untuk menggunakan warna apa pun yang Anda inginkan.

@media semua {
#header {
warna latar: # EFE3EF;
...
Selanjutnya, kita akan mengubah jenis huruf untuk judul menjadi font gaya kasual dan populer yang disebut Comic Sans MS. Tentu saja, Anda bebas menggunakan font apa pun yang Anda suka. Tiga bagian berikutnya dari kode CSS templat (# blog-title, # blog-title a, # blog-title a: hover) mengontrol karakteristik untuk judul blog. Bagian pertama mengontrol karakteristik umum dan dua bagian lainnya mengontrol tampilan teks ketika berfungsi sebagai hyperlink. Untuk mengatur jenis huruf judul, atau font, untuk semua instance, kami akan menambahkan kode CSS untuk font-family ke bagian pertama (# blog-title). Karena nama font kita mengandung spasi, maka perlu ditempatkan di dalam tanda kutip ("comic sans ms").

#judul blog {
font-family: "comic sans ms";
...
Terakhir, kami akan mengerjakan kode CSS untuk deskripsi blog Anda (#description). Ini adalah bagian terakhir dari enam yang asli. Seperti yang Anda lihat di bawah, semua kode CSS yang mengontrol karakteristik font untuk teks deskripsi terdaftar bersama dalam satu baris. Yang perlu kita lakukan adalah menambahkan "comic sans ms" di bagian depan daftar font yang akan membuat Comic Sans MS font default untuk teks deskripsi.

#description {
...
font: 78% / 1.4em "komik komik ms", "Trebuchet MS", Trebuchet, Arial, Verdana, Sans-serif;
...
}

Setelah selesai, klik tombol Preview untuk melihat dulu perubahan Anda dan kemudian tutup jendela browser itu untuk kembali ke halaman web sebelumnya. Klik tombol Simpan Perubahan Template. Ketika Anda melihat pesan konfirmasi yang menunjukkan bahwa perubahan telah disimpan, klik tombol Republish. Untuk memverifikasi bahwa blog Anda telah diperbarui, klik pada tab Lihat Blog di menu di bagian atas halaman. Anda mungkin perlu menyegarkan halaman web blog Anda untuk melihat perubahannya.

Cuplikan layar dicetak ulang dengan izin dari Google Inc. Google^TM, Blogger^TM dan BlogSpot^TM adalah merek dagang terdaftar atau merek dagang dari Google Inc. di Amerika Serikat dan / atau negara lain.

Petunjuk Video: Windows Color and Appearance Customization | Windows 7 Tutorial | Part 5/5 (April 2024).

Kustomisasi Bagian Header Blog Blogger.com Anda, HTML, ubah judul dan deskripsi blog Blogger Anda, ubah jenis huruf untuk template Blogger, tambahkan latar belakang berwarna ke template Blogger, ubah kode CSS untuk template Blogger, tambahkan kode CSS ke templage Blogger , Font template Blogger, font-keluarga template Blogger, tag gaya CSS

Artikel Sebelumnya

Artikel Berikutnya

Atelier Iris Eternal Mana

April 2024

Atelier Iris: Eternal Mana adalah game pertama untuk PS2 (dan game ke-6 secara keseluruhan) dalam seri permainan peran oleh Nippon Ichi Software, perusahaan game yang membuat Disgaea dan Makai...

komputer

Mousing Bebas Nyeri

April 2024

Saat melakukan penilaian ergonomis, faktor utama yang saya temukan yang berkontribusi terhadap rasa sakit pada mousing meliputi: Penentuan posisi mouse Gerakan Mouse Ketegangan Otot Saat Menggunakan...