WordPress ger dig ett par inbyggda alternativ för din hemsida: en visning av dina senaste blogginlägg eller en statisk sida efter eget val. Men vad sägs om du vill skapa något lite mer intressant än det?
Om din webbplats har mycket data med hjälp av kategorier, taxonomier eller anpassade posttyper för att organisera det, kanske du vill visa data av mer än ett slag på din hemsida. Den goda nyheten är att du kan göra detta med hjälp av en anpassad mall för hemsidan. I den här mallen skriver du ett antal anpassade frågor för att lista uppgifterna på det sätt du vill. I den här handledningen lär du dig att göra följande:
Frågorna kommer att lista standardinställningar plus en anpassad posttyp registrerad för detta projekt, som kallas "djur". Du kan hitta mallfilen med de fyra frågorna i kodpaketet.
Innan du börjar konfigurera hemsidan mall, ta en tid innan du identifierar vad som finns på hemsidan:
Hemsidan innehåller:
Elementen i den här layouten du kommer att arbeta med är hemsidans innehåll och de tre listorna.
Innan du börjar måste du ha några saker på plats för dina frågor att arbeta med:
register_post_type
i WordPress Codex. Alternativt kan functions.php filen i kodpaketet innehåller koden som gör det härDet första steget är att skapa en mallfil för att hålla din kod. Skapa en tom fil i din temmapp och namnge den front-page.php. Lägg till följande kod i filen:
// innehåll på framsidan går här
Spara din fil. Som du kan se innehåller detta filerna för sidhuvud och sidfot på din hemsida. Inga sidofält ingår som det inte ingår i hemsidan. När du besöker webbplatsens hemsida kommer du nu att ha en tom sida med bara rubriken och sidfoten som visas:
Förutom att visa resultaten av anpassade frågor, kommer din hemsida att visa innehållet från statens startsida. För att lägga till detta i din mallfil, sätt i följande kod för att ersätta "// innehåll på framsidan går här
"linje:
> ?>
Detta är standardslingan. WordPress använder den för att visa innehållet på den statiska sidan du har registrerat som hemsida. Din hemsida kommer nu att innehålla det statiska innehållet:
WP_Query
För de anpassade frågorna kommer du att använda WP_Query
klass. Det här låter dig konfigurera anpassade frågor och köra en loop baserat på var och en för att visa inlägg.
Använder sig av WP_Query
är mycket bättre övning än att använda query_posts
funktionen som den sistnämnda återställer huvudfrågan och kan orsaka prestandafrågor. WP_Query
tar en uppsättning parametrar som definierar den fråga du vill köra. Några exempel på parametrar som du kan ange inkluderar (men är inte begränsade till):
post_type
- inlägg, sidor, bilagor eller en anpassad posttypposts_per_page
- Antalet inlägg som ska visasordning
- ASC
eller DESC
sortera efter
- Du kan beställa efter datum, namn, författare, menyorder eller många fler parametrarFör detaljer om parametrarna som du kan använda med WP_Query
, se WP_Query
i WordPress Codex. Att använda WP_Query
, du anger följande kod:
have_posts ()): $ query-> the_post (); // postinnehåll som visas här än ?>
På din hemsida vill du lista de senaste åtta inläggen i kategorin "Uppdateringar". För att göra detta lägger du till följande kod mellan huvudfrågan och samtalet till sidfoten:
/ Kategori / uppdateringar / "> Uppdateringar
'post', 'category_name' => 'Uppdateringar', 'posts_per_page' => 8)); medan ($ query-> has_posts ()): $ query-> the_post (); ?>
- "> -
Detta skapar en element som innehåller din lista och öppnar listan med en länk till kategorin arkivet i en
märka. Det definierar sedan argumenten för
WP_Query
och kör slingan baserat på den frågan. Tilläggsklasserna kan användas för att ställa in varje enskild lista.
Den andra anpassade frågan är nästan identisk med den första, det frågar bara inlägg från en annan kategori. Lägg till följande efter den första frågan och omedelbart före den andra stängningen märka:
/ kategori / djupgående / "> I djup
'post', 'category_name' => 'In Depth', 'posts_per_page' => 8)); medan ($ query-> has_posts ()): $ query-> the_post (); ?>
- "> -
Detta lägger till en andra postlista för inlägg i kategorin "In Detail".
Den tredje och sista frågan frågar inte standardinställningar, men den "djur" anpassade posttypen du registrerade innan du skapade din mallfil. Efter den andra anpassade frågan lägger du till följande:
"> Våra favoritdjur
"djur", "posts_per_page '=> 8)); medan ($ query-> has_posts ()): $ query-> the_post (); ?>
- ">
Du har nu alla frågor på plats och visas på hemsidan:
Det sista steget är att lägga till lite styling. För tillfället är listorna en under den andra, med väldigt lite i vägen för avstånd eller dekoration.
I det här steget lägger du till några enkla stylingar för att förbättra detta. Lägg till följande i ditt temans stilark:
.rensa float: none; klara: båda; .home section.archive width: 31%; marginal: 10px 1%; border-top: 1px solid # 222; flyta till vänster; .home section.archive ul li linjehöjd: 1.4em;
Detta kommer att se till att listorna rensas under huvudinnehållet och placera dem sida vid sida. Det lägger också till lite avstånd mellan objekten i varje lista:
Du har nu en anpassad hemsida som innehåller innehållet för statisk sida plus tre anpassade frågor som innehåller olika innehållstyper. Du kan anpassa detta tillvägagångssätt till olika krav. Till exempel:
WP_Query
the_thumbnail ()
för att visa miniatyrbilder i posten (eller utvalda bilder)Några användbara resurser:
WP_Query
klass: http://codex.wordpress.org/Class_Reference/WP_Query