Začíname asi tak, že sa pozrieme na niektoré gruntové práce, ktoré som urobil v zákulisí, a objasnili niektoré veci, ktoré bolo treba urobiť. Rovnako ako pridanie zvyšku volaní wp_list_pages () na výstup zvyšku zoznamu úryvkov pre každú kategóriu. A tiež pridanie CSS na zmenu farby pruhu oddeľujúceho kategórie a zoznamy úryvkov. Tiež sme zmenili vznášadlá kategórií, aby sme zosvetlili farby namiesto nemého bieleho okraja, ktorý sme tam dočasne mali. Doslova sme lighten()funkciu v Sass použili na vykonanie práce za nás.
Cieľom tohto screencastu je však upraviť vzhľad jedného úryvku. Keby som túto oblasť webu vytvoril novšie, mohli by byť úryvky vlastný typ príspevku (ako sú napríklad snímky obrazovky jednotlivých galérií), ale keď som to začal robiť, tie neexistovali. Preto sú to iba „Stránky“ a všetky používajú vlastnú šablónu stránky. Nie je to veľká vec, zvlášť teraz, keď veľa stránok nie je problémom výkonu.
Jednotlivé úryvky budú veľmi podobné blogovým príspevkom. Štandardná štruktúra mriežky 2/3 1/3 a normálny bočný panel. Existujú určité rozdiely. Úryvky majú jasnú hierarchiu, napr
Hlavná stránka »Útržky kódu» Kategória úryvkov »Názov úryvku
To je ideálne pre pod navigáciu „čierneho pruhu“, ktorá sa vyvíja na tomto webe. Náš zásuvný modul Yoast SEO poskytuje funkčnosť navigácie, takže je to jednoduché - stačí zavolať funkciu.
Ďalším rozdielom je, že the_modified_time()namiesto dátumu zverejnenia vydávame výstup . Ľudia tak budú vedieť, kedy bol posledný úryvok aktualizovaný, čo je relevantnejšie ako v čase jeho zverejnenia. Poskytuje mi to aj určitú motiváciu pravidelne sa vracať k úryvkom.
Pokračujeme malou aktualizáciou starého úryvku len pre zábavu.
Nakoniec to napíšeme trochou JavaScriptu, vďaka ktorému budú naše zobrazenia podkategórií fungovať. Tieto zobrazenia v podstate vyzerajú rovnako ako naša domovská stránka úryvkov, iba ak sa nachádzate na stránke / snippets / javascript /, útržky kódu JavaScript sa predvolene zobrazia a zvýrazní sa kategória JavaScriptu. Verte tomu alebo nie, iba pár riadkov záludnej adresy URL s vrcholom kódu JavaScript, ktoré by pravdepodobne mali byť úryvkom samého seba.