Share
Det blir allt vanligare att bloggar har vissa inlägg högst upp på sidan. I denna handledning kommer vi att visa dig hur du implementerar detta i WordPress. Vi använder standardtema, Kubrik, som vårt bastema, men det bör anpassas till de flesta teman med viss modifikation. Det finns mycket lite kod och med inlägg är enkelt.
Vi kommer att ändra Kubrik-temat som kommer förpackade i WordPress för att kunna presentera inlägg högst upp på sidan. Denna handledning har bara testats på WordPress 2.5.x men det borde fungera på 2.3.x-serien också. Vi antar att du använder 2.5.x eller högre. I slutet av handledningen har du något liknande:
Innan vi gör någonting, gå till temanmappen i din WordPress-installation (wp-innehåll / teman /) och gör en säkerhetskopia av mappen "standard". Det här är Kubrik-temat som vi kommer att redigera. Säkerhetskopieringen är om du vill återgå till det ursprungliga, omodifierade temat.
Först ska vi göra en standardbild i händelse av att ingen utvalt postbild anges. Låt oss hålla det sött och enkelt för den här handledningen. Öppna din föredragna bildredigerare och skapa en 233x130px rektangel med 10px radie med rundade hörn. Jag gjorde bakgrunden en vit till grå radial gradient och lägg lite text på toppen. Detta är vad jag har:
Spara bilden som "no-featured-image.jpg" i mappen "bilder" som ligger i mappen "default".
Nu för koden. Öppna filen "header.php" i mappen "default". I slutet av filen ser du ett div-block och en hr-tagg så här:
/ ">
Mellan den slutgiltiga div-taggen och hr, sätt in följande kod:
ID); $ image = $ custom_image [0]? $ custom_image [0]: get_bloginfo ("template_directory"). "/ images / no-featured-image.jpg"; printf ('
- ', get_permalink ($ post-> ID), $ post-> post_title, $ image, $ post-> post_title); ?>
Denna kod kommer att mata ut tre bilder i en oordnad lista. Varje bild är en länk till ett utvalt inlägg. Vi pratar om hur du konfigurerar koden när vi lägger till CSS.
Nästa måste vi lägga till några CSS-stilar. Öppna filen "style.css" och lägg följande kod nedan i slutet av filen. Allt detta gör float listelementen till vänster och rymmer dem jämnt ut.
/ * Utvalda postkarusell * / #featured vaddering: 10px 10px 0 20px; #carousel list-style: none; marginal: 0; vaddering: 0; #carousel li float: left; vaddering: 0; marginal-höger: 10px;
Låt oss ta en titt på vad koden vi lagt till gör. Inne i container div (id = "featured") har vi en orörd lista och en del PHP-kod för att generera listelement.
Accentsconagua
$ featured_posts = get_posts ('numberposts = 3 & category =1'); Den första raden som visas ovan hämtar postinformationen med funktionen get_posts () och tilldelar postdata till $ featured_posts-variabeln. Funktionen get_posts () exkluderar en enda parameter i form av en frågesträng som liknar vad du kan se i slutet av en URL (sans det ursprungliga frågetecknet). Den första parametern är "nummerposter" som vi har satt till 3 för denna handledning. Den här parametern anger hur många inlägg som vi kommer att visa. Den andra parametern är "kategori" som vi har satt till 1. Värdet av parametern "kategori" ska vara ID för den kategori du använder för dina inlägg. Du kan hitta ID för en kategori genom att gå till kategorins ledningssida och sväva musen över en kategorititel. Statusfältet visar en länk. Det sista numret är kategorin ID.
Nästa rad är en förflyttningsslinga som släpper igenom de inlägg som vi hämtat med funktionen get_posts (). Den första raden inuti foreach-loopen hämtar URL-adressen till bilden med funktionen get_post_custom_values () och lagrar URL-adressen i variabeln $ custom_image. Den första parametern anger nyckeln till det anpassade värdet vi använder, "featured_image". Den andra parametern anger vilket inlägg vi får värdet från.
$ custom_image = get_post_custom_values ('featured_image', $ post-> ID); I nästa rad gör vi en snabb check för att se om en bild verkligen angavs. Om ingen bild har angivits tilldelar vi bildbildsvariabeln URL för standardbilden. Om en bild specificerades använder vi det.
$ image = $ custom_image [0]? $ custom_image [0]: get_bloginfo ("template_directory"). "/ images / no-featured-image.jpg"; I den sista raden exporterar vi faktiskt listelementen. Varje element är en bild som länkar till det inriktade inlägget.
printf ('
Det är allt! Nu, när du vill ha ett inlägg, tilldela det till den utvalda kategorin och skapa ett anpassat värde med en nyckel av "featured_image" och ett värde av bildadressen. Bilderna ska vara 233x130px.
Du kan se temat i åtgärd på vår NETTUTS WordPress Demo-server:
