Share
Jag tycker att det är säkert att säga att om du är en bloggare vill du markera det senaste innehållet på din blogg så att folk kommer att upptäcka det och läsa det. Det finns några sätt du kan göra detta, inklusive att använda olika styling för det första inlägget på din bloggsida för att markera det eller visa det tydligt i sidofältet.
I denna handledning visar jag dig hur du går lite längre än du kan använda CSS: istället för att helt enkelt utforma ditt första bloggpost på olika sätt, kommer du att utföra olika innehåll för det. Specifikt kommer det första inlägget att ha en titel, utseende och innehåll, medan andra inlägg bara har titeln, den utvalda bilden och utdraget.
Du kan anpassa denna teknik: Om du inte vill ha så mycket detaljer kan du ändra slingan i var och en av de frågor vi ska arbeta med så att (till exempel) det första inlägget har en titel, bild och utdrag medan andra har bara titeln och bilden. Eller du kan lämna ut den utvalda bilden för efterföljande inlägg. Det är upp till dig.
Tekniken vi ska använda för att göra detta innebär att använda WP_Query klass för att skriva ett extra fråga innan huvudfrågan i home.php mallfil, som driver huvudblogsidan. Vi använder då pre_get_posts () för att ändra huvudfrågan så att det senaste inlägget inte matas ut två gånger. Jag skapar ett barntema i temat för standard tjugo femton och skapar en home.php filen för den, plus ett stilark för att ställa in barntemat.
För att följa denna handledning behöver du:
Om du arbetar med Twenty Fifteen-temat är det första steget att skapa ditt barntema. Skapa en ny mapp i din wp-content / teman katalog och ge det ett namn-jag ringer min tutsplus-blogg-sida-two-slingor. Skapa nu en tom style.css filen i den mappen och lägg till följande till det:
Accentsconagua
/ * Tema Namn: Tuts + Använd två slingor på ditt huvudsakliga blogg-sida Tema URI: http://rachelmccollin.co.uk/wptutsplus-taxonomy-archive-list-by-second-taxonomy/ Beskrivning: Tema för att stödja WPTutsPlus handledning om att skapa ett anpassat taxonomi arkiv. Barn tema för tjugo femton temat. Författare: Rachel McCollin Författare URI: http://rachelmccollin.co.uk/ Mall: twentyfifteen Version: 1.0 * / @import url ("... /twentyfifteen/style.css");Detta berättar WordPress att ditt tema är ett barn i tjugo femton temat och importerar stilarket från det temat. Du kommer noga att redigera några av detaljerna för att reflektera det faktum att detta är ditt tema.
Eftersom det är den största bloggsidan du vill ändra måste du skapa en mallfil för det i ditt barntema. Mallfilen du behöver skapa är home.php, som driver huvudblogsidan om det är framsidan på din webbplats.
Skapa en fil som heter home.php i din temmapp.
Öppna nu index.php filen i tjugo femton och kopiera koden i början och slutet av den filen (dvs inte slingan). Din fil kommer att se ut så här:
__ ('Föregående sida', 'twentyfifteen'), 'next_text' => __ ('Nästa sida', 'twentyfifteen'), 'before_page_number' => ''. __ ('Sida', 'twentyfifteen'). ' ',)); ?>
Om du använder ditt eget tema kopierar du motsvarande kod från ditt tema index.php filen istället så att du har de innehållande elementen för din sida men ingen slinga.
Nästa steg är att skapa den första slingan, som visar det senaste inlägget i sin helhet.
Under stängningen tagga i din home.php fil, lägg till argumenten för frågan:
$ args = array ('posts_per_page' => '1',);Detta kommer bara att fråga om det senaste inlägget. Observera att du inte behöver inkludera posttypen, och den här standardinställningen är 'posta'.
Lägg nu till slingan under dina argument:
$ query = nytt WP_query ($ args); om ($ query-> have_posts ()) ?> have_posts ()): $ query-> the_post (); / * starta slingan * /?>> ', esc_url (get_permalink ()))''); ?> "> 'left', 'alt' => trim (strip_tags ($ wp_postmeta -> _ wp_attachment_image_alt)))); ?>
Den här slingan matar ut titeln, miniatyren om det finns en och innehållet.
Observera att jag har lagt till en extra klass, .första inlägg, i post_class () mall tagg. Om du vill markera ditt första inlägg med hjälp av CSS, ger den här extra klassen dig ett enkelt sätt att göra det.
Det är väldigt viktigt att du lägger till rewind_posts () efter slingan, annars kommer inte nästa slinga att fungera.
Den andra slingan är mycket likadan, men istället för att använda WP_Query, det går bara till huvudfrågan.
Under den slinga som du just lagt till lägger du till den andra slingan:
> ', esc_url (get_permalink ()))''); ?> "> 'left', 'alt' => trim (strip_tags ($ wp_postmeta -> _ wp_attachment_image_alt)))); ?> "> Ytterligare information.
Denna slinga är mycket lik den första, men med två skillnader:
.första inlägg klass.Spara nu din fil.
För närvarande kan du se att din senaste inlägg visas två gånger om du kontrollerar din huvudblogsida. Vi fixar det genom att kompensera huvudfrågan med pre_get_posts krok.
Skapa en ny fil i ditt tema som heter functions.php. Alternativt om du arbetar med ditt eget tema och det redan har en funktionsfil, öppna det.
Lägg till den här koden i din funktionsfil:
is_home () && $ query-> is_main_query ()) $ query-> set ('offset', '1'); add_action ('pre_get_posts', 'tutsplus_offset_main_query');Detta filtrerar huvudfrågan men endast på hemsidan, och lägger till en kompensation av 1.
Spara nu din fil och kolla på din huvudblogsida:
Det är ett problem. Eftersom min blogg har ett klibbigt inlägg visas detta ovanför det senaste inlägget, vilket inte är det jag vill ha. Det visar också hela innehållet i både den senaste posten och det klibbiga inlägget.
Detta korrigeras enkelt. Öppna din home.php filen igen och lägg till ett annat argument till argumenten för ditt första fråga:
'ignore_sticky_posts' => true
Detta kommer att se till att WordPress ignorerar klibbiga inlägg när du kör den första slingan. Din första uppsättning av frågarargument kommer nu att se ut så här:
$ args = array ('posts_per_page' => '1', 'ignore_sticky_posts' => true);Spara nu filen igen och kolla din bloggsida:
Det är bättre! Det senaste inlägget är överst i sin helhet och det klibbiga inlägget ligger under det, med bara dess utdragsutgång. Om du rullar ner längre ser du att de andra inläggen bara visar ett utdrag:
Om du vill ignorera klibbiga inlägg i din andra loop kan du göra det genom att lägga till ignore_sticky_posts argument till din andra fråga. Jag vill ha klibbiga inlägg att fungera som de borde för alla utom min senaste inlägg, men det gör jag inte.
Du märker att om du navigerar till andra och efterföljande sidor av inlägg (det vill säga de paginerade sidorna) i din blogg visas samma inlägg som på första sidan, vilket innebär att endast dina tio senaste inlägg visas! Detta beror på att kompenseringen av huvudfrågan har brutit pagination.
Lyckligtvis fixas detta enkelt genom att ändra den funktion du lade till pre_get_posts krok.
Öppna din functions.php fil igen och redigera funktionen så den läser som nedan:
funktionen $ ($ query- $ ish
Vad vi har gjort här läggs till is_paged () villkorlig etikett. Detta kontrollerar för paginerade sidor annat än den allra första, så returneras sant om besökaren tittar på den andra eller efterföljande sidan av inlägg. Genom att använda !$ Query-> is_paged (), Vi ser till att frågan bara kommer att kompenseras om sidan är inte sidnumrerad.
Spara nu din fil och kontrollera igen. Pagination kommer nu att fungera bra.
Du kommer märka att samma nya inlägg fortfarande visas högst upp på sidan. Detta beror på att sidan använder samma mall och samma två loopar.
På min sida är jag glad att lämna det som det är för att jag vill att det senaste inlägget ska vara mycket framträdande. Men om du ville ändra detta skulle du lägga till ett extra argument för din första fråga, nämligen 'paged' => false.
Ändra hur din bloggs huvudsidautmatningsinlägg görs enkelt med hjälp av WP_Query klass med pre_get_posts krok. I denna handledning har du lärt dig hur man:
WP_Query att skriva ut det första inlägget i sin helhetDu kan anpassa denna teknik för att visa det senaste inlägget från en viss kategori, för att använda annat innehåll i din loop och mycket mer.
