# 108: Pagina met individuele fragmenten maken - CSS-trucs

Anonim

We beginnen ongeveer door te kijken naar een deel van het gruntwerk dat ik achter de schermen heb gedaan om een ​​aantal dingen uit te werken die gedaan moesten worden. Zoals het toevoegen van de rest van de wp_list_pages () - aanroepen om de rest van de lijst met fragmenten voor elke categorie uit te voeren. En ook het toevoegen van de CSS om de kleur van de balk tussen de categorieën en de lijsten met fragmenten te wijzigen. We hebben ook de zweeftoestellen van de categorieën gewijzigd om de kleuren lichter te maken in plaats van de domme witte rand die we daar tijdelijk hadden. Letterlijk hebben we de lighten()functie in Sass gebruikt om het werk voor ons te doen.

Het doel van deze screencast is echter om de weergave op te maken voor een enkel fragment. Als ik dit gedeelte van de site recenter had gemaakt, zouden fragmenten een aangepast berichttype kunnen zijn (zoals schermafbeeldingen van een enkele galerij), maar die bestonden niet toen ik hiermee begon. Als zodanig zijn het gewoon "pagina's" en gebruiken ze allemaal een aangepaste paginasjabloon. Niet echt een probleem, vooral nu het hebben van veel pagina's geen prestatieprobleem is.

Individuele fragmentenpagina's zullen veel op blogposts lijken. De standaard 2/3 1/3 rasterstructuur en een normale zijbalk. Er zijn echter enkele verschillen. Er is een duidelijke hiërarchie voor fragmenten, bijv

Home »Codefragmenten» Snippetcategorie »Snippetnaam

Dit is perfect voor de "zwarte balk" -subnavigatie die op deze site evolueert. Onze Yoast SEO-plug-in biedt breadcrumb-functionaliteit, dus dit is eenvoudig - gewoon een kwestie van een functie aanroepen.

Een ander verschil is dat we uitvoeren in the_modified_time()plaats van de publicatiedatum. Op die manier weten mensen de laatste datum waarop een fragment is bijgewerkt, wat relevanter is dan toen het werd gepubliceerd. Het geeft me ook enige motivatie om fragmenten regelmatig opnieuw te bezoeken.

We gaan een beetje opzij om voor de lol een oud fragment bij te werken.

We eindigen met het schrijven van een klein beetje JavaScript dat onze subcategorieweergaven zal laten werken. Die weergaven zien er in wezen hetzelfde uit als onze homepage voor Snippets, alleen als u zich in / snippets / javascript / bevindt, worden de JavaScript-fragmenten standaard weergegeven en is de JavaScript-categorie gemarkeerd. Geloof het of niet, slechts een paar regels stiekeme JavaScript-code met een piek in URL's die waarschijnlijk een fragment op zichzelf zou moeten zijn.