Na poslednej obrazovke sme zachytili túto fotografiu z iStockPhoto zasneženej chaty a lesa. Odložili sme ho na pozadie za hlavnú oblasť obsahu a bočný panel nášho dokumentu Photoshopu a pekne to tam hore zapadalo, akýsi štýl hlavičiek ostatných oblastí webu. Medzi obrazovkami som napísal nejaké znenie aj pre stránku. Rád by som to premietal na plátne, ale písanie textu je jednou z vecí, ktorá trvá len dlho a je ešte jemnejšia ako vylepšenie dizajnu. Hovoríme o tom trochu.
Vo Photoshope som text „Chata“ schoval za stromy s malým zväčšením maskovania obrázkov. Nerobil som to nijako extra podrobne, ale keď sa priblížite, nemusíte tak robiť, až budete, a obrázok sa zmenší aj na webe.
Vyrábame jedinečnú šablónu stránky iba pre túto stránku (page-lodge.php). Použitím konvencie komentárov PHP sa /* Template Name: The Lodge */
potom táto šablóna zobrazí na našej rozbaľovacej stránke Šablóna stránky pri vytváraní novej stránky vo WordPress. To nám dáva všetku potrebnú kontrolu. V tejto šablóne môžeme upraviť HTML, a ak potrebujeme pre túto stránku jedinečný CSS, môžeme použiť podmienenú logiku a prepojiť ju v súbore header.php. Pri spätnom pohľade má väčší zmysel použiť súbor functions.php na prepojenie jedinečných CSS, aby bol „view“ (header.php) čistejší, ale to je niečo nabudúce.
Grafika na pozadí tejto hlavičky by sa nazývala „Hero Graphic“ - to znamená veľká (doslova a veľkosť) grafika, ktorá je dôležitá pre vzhľad / dojem / obsah stránky. Pretože sa snažíme byť zodpovední za výkon (chceme, aby sa stránka načítavala rýchlo), nemali by sme túto gigantickú grafiku skutočne zobrazovať na malých obrazovkách. V CSS je to oveľa jednoduchšie ako v HTML. Pomocou našich „reverzných“ mediálnych dotazov ( min-width
namiesto max-width
) hovoríme „keď je obrazovka taká široká alebo širšia, použite túto grafiku ... keď je ešte širšia, použite túto grafiku“ atď. Týmto spôsobom sa predvolene použije iba najmenší obrázok, ktorý je však prepísaný, keď stránku požaduje širší prehliadač. Trochu myslenia najskôr na mobil.
Na konci máme pekné plátno (ak chcete), na ktorom by sme mohli pracovať na všetkých stránkach The Lodge.