В последния скринкаст хванахме тази снимка от iStockPhoto на снежната кабина и гората. Пуснахме го на заден план, зад основната област на съдържанието и страничната лента на нашия документ в Photoshop и той пасна добре там, в стила на заглавките на другите области на сайта. Между екранните предавания написах и копие за страницата. Бих искал да изложа това, но писането на копие е едно от онези неща, които просто отнемат много време и са дори по-фини, отколкото настройките на дизайна. Все пак говорим за това малко.
Във Photoshop „скрих“ текста „The Lodge“ зад дърветата с малко увеличено маскиране на изображението. Не съм свършил супер подробна работа, но всъщност не е нужно, когато бъдете увеличени и изображението ще бъде намалено и в мрежата.
Ние правим уникален шаблон за страница само за тази страница (page-lodge.php). Използвайки конвенцията за коментари на PHP, /* Template Name: The Lodge */този шаблон се показва в падащата страница на Шаблон за страница, когато създавате нова страница в WordPress. Това ни дава целия контрол, от който се нуждаем. Можем да редактираме HTML в този шаблон и ако се нуждаем от уникален CSS за тази страница, можем да използваме условна логика и да го свържем във файла header.php. В ретроспекция има по-смисъл да се използва файлът functions.php, за да се свърже уникален CSS, за да се поддържа по-чист „view“ (header.php), но това е нещо за следващия път.
Графиката на фона за тази заглавка би се нарекла „Hero Graphic“ - тоест, голяма (буквално и по размер) графика, която е важна за външния вид / усещането / съдържанието на страницата. Тъй като се опитваме да носим отговорност за ефективността (искаме сайтът да се зарежда бързо), наистина не бива да обслужваме тази гигантска графика на малки екрани. Това е много по-лесно в CSS, отколкото в HTML. Ние използваме нашите „обратни“ медийни заявки ( min-widthвместо max-width), за да кажем „когато екранът е толкова широк или по-широк, използвайте тази графика ... когато е още по-широк, използвайте тази графика“ и т.н. По този начин по подразбиране се използва само най-малкото изображение, но това се отменя, когато по-широк браузър поиска страницата. Малко мобилно първо мислене там.
Накрая имаме хубаво платно (ако искате), върху което да работите за всички страници на The Lodge.