Dalam screencast terakhir, kami mengambil foto dari iStockPhoto tentang kabin dan hutan bersalju. Kami menjatuhkannya di latar belakang, di belakang area konten utama dan sidebar dokumen Photoshop kami dan itu cocok dengan baik di sana, dalam jenis gaya tajuk dari area lain dari situs. Di antara screencast, saya juga menulis beberapa salinan untuk halaman tersebut. Saya ingin melakukan screencast itu, tetapi menulis salinan adalah salah satu hal yang hanya membutuhkan waktu lama dan bahkan lebih rumit daripada tweaker desain. Kami memang membicarakannya sedikit.
Di Photoshop, saya "menyembunyikan" teks "The Lodge" di belakang pepohonan dengan masking gambar yang sedikit diperbesar. Saya tidak melakukan pekerjaan yang sangat mendetail tentangnya, tetapi Anda tidak perlu melakukannya saat memperbesar dan gambar akan diperkecil di web juga.
Kami membuat template halaman unik hanya untuk halaman ini (page-lodge.php). Menggunakan konvensi komentar PHP /* Template Name: The Lodge */maka template itu muncul di halaman dropdown Template Halaman kami saat membuat Halaman baru di WordPress. Ini memberi kita semua kendali yang kita butuhkan. Kita bisa mengedit HTML di template ini, dan jika kita membutuhkan CSS unik untuk halaman ini, kita bisa menggunakan logika kondisional dan menautkannya di file header.php. Dalam retrospeksi, lebih masuk akal untuk menggunakan file functions.php untuk menghubungkan CSS unik untuk menjaga "view" (header.php) lebih bersih, tapi itu sesuatu untuk lain kali.
Grafik latar belakang untuk tajuk ini akan disebut "Gambar Pahlawan" - yaitu, grafik besar (secara harfiah dan ukuran) yang penting untuk tampilan / nuansa / konten laman. Karena kami mencoba untuk bertanggung jawab dengan kinerja (kami ingin situs memuat dengan cepat), kami benar-benar tidak boleh menyajikan grafik raksasa ini ke layar kecil. Ini jauh lebih mudah di CSS daripada di HTML. Kami menggunakan kueri media "pembalikan" kami ( min-widthbukan max-width) untuk mengatakan "saat layar selebar atau lebih lebar ini, gunakan grafik ini ... bila bahkan lebih lebar, gunakan grafik ini" dan seterusnya. Dengan cara itu secara default hanya gambar terkecil yang digunakan, tetapi itu diganti ketika browser yang lebih luas meminta halaman tersebut. Sedikit pemikiran yang mengutamakan seluler di sana.
Pada akhirnya kami memiliki kanvas yang bagus (jika Anda mau) untuk dikerjakan untuk semua halaman The Lodge.