Styling Konten WordPress

Gak terasa lagi-lagi saya gak update sekian lama. Padahal saya rasa baru beberapa hari saya tinggal blog ini tapi cek tanggalnya ternyata update terakhir lebih dari sepekan yang lalu. Ya udah, kita terusin deh sharing ilmu cara membuat themes WordPress-nya.

Kali ini kita akan mengatur tampilan konten yang sudah kita buat di pertemuan sebelumnya. Karena mengatur style, berarti file yang akan kita edit sekarang adalah file style.css. Dan karena ini pengaturan konten, maka kita tempatkan saja di bawah pengaturan untuk konten sambil sekalian menghilangkan warna kuning di bagian konten artikelnya. Yuk, kita cari kode ini:

#content {
  width:590px;
  background:#FFCC00;
  float:left;
  }

Lalu kita hilangkan kode background:#FFCC00; agar warna belakangnya tetap putih. Jika anda simpan file style.css dan lihat blog anda sekarang, maka background kuningnya akan hilang sekarang dan berganti dengan putih bersih.

Tahap awal, kita atur dulu tampilan untuk judulnya. Sebelumnya kita telah mengidentifikasi bagian judul artikel dengan <h2 class="title">. Jadi kita buat saja di style.css-nya seperti ini:

.title , .title a{
  font-size: 20px;
  text-decoration:none;
  color:#000000;
}

Satu tambahan perintah baru kita pelajari disini yaitu text-decoration:none; Perintah ini untuk menghilangkan garis bawah pada judul artikel.

Dan untuk bagian post meta yang berisi informasi tanggal publikasi, kategori, jumlah komentar serta link edit, kita buat dengan font lebih kecil dan background warna abu-abu:

#postmeta {
  font-size:10px;
  background: #EDEDED;
  padding:10px;
}

Sekarang simpan dan lihat bagaimana tampilan blog anda sekarang

Hasil Akhir Styling bagian Konten

Pada bagian konten ini, sebenarnya ada banyak hal yang harus kita atur, misalnya bagaimana menampilkan gambar nanti, list, link, dll. Tapi gpp, nanti kita atur lagi kalau sudah jadi. Santai saja bos

Diakses dg kata kunci:

konten wordpress (12), cara merubah font pada site title pada wordpress (8), cara membuat warna text di wordpress (6), merubah layout wordpress (5), cara membuat konten pada wordpress (3), cara mengganti warna link di wordpress (3), cara merubah konten dari wordpress (3), pengaturan layout pada wordpress (3), cara merubah warna judul tulisan wordpress (3), cara menghapus kata kunci yang telah di akses (3), cara menghilangkan sidebar wordpress (3), ganti warna tema wordpress editor (3), mengganti warna site title wordpress (3), merubah warna huruf wordpress (2), cara menambah css di wp page edit (2), cara merubah warna tulisan di wordpress (2), mengedit konten wordpress (2), cara membuat hurup warna di judul halaman wordpress (2), merubah warna template wordpress di editor (2), merubah warna thema wordpress (2), custom template wordpress (2), cara memberi warna background pada sidebar diwordpress (2), mengubah custom field wordpress (2), merubah warna di template wordpress (2), menghilangkan meta thema wordpres (2), mengubah warna tema wordpress (2), mengubah warna theme pada wp (2), mengubah warna themes wordpress (2), cara mengganti warna title di wordpress (2), cara mengganti warna themes wordpress (2), mengganti warna tulisan header pada wordpress (2), cara merubah warna link di template wordpres (2), cara merubah warna link di wordpress (2), cara mengganti title wordpress dengan warna (2), mengganti warna tema wordpress (2), cara merubah warna page wordpress (2), mengganti tulisan atau nama theme pada wordpress (2), mengganti text judul menjadi image judul di wordpress (2), edit warna background wordpress (2), tutorial membuat konten konten wordpress (2), ubah warna theme wordpress kunci (2), teknik custom themes wordpress (2), kode css judul postingan pada wordpress (2), kode begron diworpress untuk admin (2), rubah layout wordpres (2), ganti tulisan judul wordpress (2), wordpress konten (2), ngedit size komentar wordpress (2), yang dimaksud custom widgets pada wordpress (2), menghilangkan jumlah komentar wordpress (1)

Daftar Isi Membuat Theme WP

1. Cara Membuat Theme WordPress
2. Membangun Theme WP: Style.css
3. Membangun WP Theme: index.php
4. Bikin Theme WP: Designing
5. Bikin Tema WP: Layout
6. Membuat Theme: Heading
7. Buat Theme WordPress: Blog Header
8. Buat Theme WP: Konten
9. Mengatur Konten dalam Themes WordPress
10. Styling Konten WordPress
11. Membuat Sidebar Widget
12. Styling Sidebar
13. Membuat Footer
14. Membuat Custom Background
15. Membuat Drop Down Menu
16. Search Form Gaya dengan Image
17. Memasang Featured Image
18. Memperbaiki tampilan halaman depan
19. Membuat Featured Slide Show
20. Bermain-main dengan Looping WordPress
21. Memecah File Themes
22. Memecah Sidebar
23. Membuat File Single.php, archive.php, dll