Na posledním vysílání jsme pořídili tu fotku ze iStockPhoto zasněžené chatky a lesa. Upustili jsme to na pozadí, za hlavní oblast obsahu a postranní panel našeho dokumentu Photoshopu, a tam to pěkně zapadalo, podobně jako styl záhlaví ostatních oblastí webu. Mezi screencasty jsem sepsal také kopii stránky. Rád bych to promítl na obrazovku, ale psaní kopie je jedna z těch věcí, která prostě trvá dlouho a je ještě jemnější než vyladění designu. Trochu o tom ale mluvíme.
Ve Photoshopu jsem „schoval“ text „The Lodge“ za stromy s malým zvětšením maskování obrazu. Neudělal jsem to příliš podrobně, ale ve skutečnosti to nemusíte, když jste přiblíženi a obrázek se zmenší také na webu.
Pro tuto stránku vytváříme jedinečnou šablonu stránky (page-lodge.php). Při použití konvence komentáře PHP se /* Template Name: The Lodge */tato šablona zobrazí na naší rozbalovací stránce Šablona stránky při vytváření nové stránky ve WordPressu. To nám dává veškerou kontrolu, kterou potřebujeme. V této šabloně můžeme upravit HTML, a pokud pro tuto stránku potřebujeme jedinečné CSS, můžeme použít podmíněnou logiku a propojit ji v souboru header.php. Při zpětném pohledu má větší smysl použít soubor functions.php k propojení jedinečných CSS, aby byl „view“ (header.php) čistší, ale to je něco pro příště.
Grafika na pozadí této záhlaví by se nazývala „Hero Graphic“ - tedy velká (doslova i podle velikosti) grafika, která je důležitá pro vzhled / dojem / obsah stránky. Jelikož se snažíme být zodpovědní za výkon (chceme, aby se web načítal rychle), neměli bychom tuto gigantickou grafiku zobrazovat na malých obrazovkách. V CSS je to mnohem jednodušší než v HTML. Pomocí našich „reverzních“ mediálních dotazů ( min-widthnamísto max-width) říkáme „když je obrazovka tak široká nebo širší, použijte tuto grafiku ... když je ještě širší, použijte tuto grafiku“ atd. Tímto způsobem se ve výchozím nastavení používá pouze nejmenší obrázek, ale ten je přepsán, když stránku požaduje širší prohlížeč. Trochu přemýšlení nejprve na mobilu.
Na konci máme pěkné plátno (pokud chcete) pro práci na všech stránkách The Lodge.