Dalam screencast ini kita akan mengerjakan area "Demo" dari CSS-Tricks. Ini adalah area situs yang cukup populer, terlepas dari kenyataan bahwa saya tidak meluangkan waktu sebanyak yang seharusnya. Intinya adalah tempat di situs dengan muatan demo yang dapat diunduh dan dapat dilihat di satu tempat - jadi sangat mudah untuk menggulir dan menjelajah dan menemukan bit yang mungkin menarik bagi Anda dan proyek Anda.
Secara struktur, ini sangat mirip dengan area video. Setiap demo memiliki judul dan deskripsi singkat serta beberapa tombol, sama seperti setiap video. Jadi kami akan memodelkan tata letak seperti yang kami lakukan di area video. Namun tidak seperti area video, kami tidak dapat menghapus HTML buatan tangan dan menggantinya dengan loop WordPress. Itu karena setiap demo tidak tinggal di dalam WordPress, mereka independen. Tidak apa-apa, kami tidak takut dengan sedikit markup. Kami hanya akan menulis ulang sedikit untuk membuatnya sesempurna mungkin.
Kami sekarang memiliki semua bit di tempat yang kami butuhkan. Kami mengontrol markup. Kami mengontrol CSS hanya untuk area khusus ini. Hanya beberapa mengutak-atik itu dan area konten utama untuk area ini selesai.
Pada akhirnya kita melihat halaman demo individu dan melihat bagaimana branding CSS-Tricks juga diterapkan pada halaman tersebut.