Använda en anpassad posttyp för att skapa en startsida-banner

Ibland kan det vara bra att ha en bra uppenbar banner på webbplatsens hemsida, tänk på till exempel meddelanden och / eller utdrag som inte är tillräckligt långa för att tjäna ett blogginlägg eller länkar till nytt innehåll på webbplatsen. Du vill inte redigera ditt hemsida innehåll varje gång du lägger till en ny bit innehåll eller vill du delva in i koden för att lägga till innehåll.

Det finns några alternativ för att göra detta. En enkel är att använda en widget som du lägger till genom att registrera ett widgetområde på rätt plats i tematets mallfiler. Men ett tillvägagångssätt som jag tycker om att använda, vilket ger dig mer flexibilitet, är att skapa en posttyp som kallas "banner" och använda det för att visa en eller flera banderoller. Du kan även använda den för att visa banderoller av en viss kategori annorlunda än andra, om du har flera banderoller men vill markera en av dem.

I denna handledning ...

  •  Jag visar dig hur du registrerar en anpassad posttyp för dina banderoller.
  •  Jag ska visa dig hur du skapar en funktion i ditt temas funktionsfil för att visa banners.
  • Jag ska visa dig hur du lägger till den nämnda funktionen i ditt temas huvudfiler så att den bara körs på hemsidan.
  • Slutligen ska jag visa dig hur du stämmer med dina banderoller.

Vad du kommer att behöva

För att slutföra denna handledning behöver du:

  • en utvecklingsinstallation av WordPress
  • tillgång till tematets mallfiler

Jag ska skapa ett barntema för tjugo tolv tema för bekvämlighet, men du kan lika lätt lägga till den här koden i ditt eget tema.

Alternativt är ett bättre sätt att skriva ett plugin för att registrera den anpassade posttypen och skapa funktionen för att visa banners, vilket innebär att om din webbplats temat ändras, förlorar du inte ditt arbete. Här använder jag en dem så att hela koden finns på ett ställe för att ladda ner.

Registrering av bannerposttypen

Det första steget är att registrera en ny posttyp. Skapa en functions.php fil för ditt tema eller lägg till följande kod i din befintliga funktionsfil:

// registrera en anpassad posttyp kallad bannerfunktion wptutsplus_create_post_type () $ labels = array ('name' => __ ('Banners'), 'singular_name' => __ ('banner'), 'add_new' => __ ('Ny banner'), 'add_new_item' => __ ('Lägg till ny banner'), 'edit_item' => __ ('Redigera banner'), 'new_item' => __ ('Ny banner'), 'view_item '=> __ (' Visa banner '),' search_items '=> __ (' Sök banners '),' not_found '=> __ (' Inga banners hittades '),' not_found_in_trash '=> __ (' Inga banners hittades Skräp' ), ); $ args = array ('labels' => $ etiketter, 'has_archive' => true, 'public' => true, 'hierarchical' => false, 'supports' => utdrag ',' anpassade fält ',' miniatyrbild ',' sidattribut '),' taxonomies '=> array (' post_tag ',' category ')); register_post_type ("banner", $ args);  add_action ('init', 'wptutsplus_create_post_type');

Detta skapar en ny posttyp som kallas "banner".

Efter att ha skapat posttypen, skapa en ny banner med hjälp av WordPress-administratören. Gruvan visas på skärmdumpen:

Skapa en funktion för att visa banners

Nästa steg är att skapa en funktion med WP_Query som kommer att fråga efter bannerposttypen och visa alla banners. Du lägger sedan till den här funktionen var som helst i ditt tema som du vill visa dina banners.

Återigen i din functions.php fil (eller i din plugin-fil om du använder den här metoden), lägg till följande:

// funktion för att visa hemsida banner med hjälp av fråga om banner posttyp funktion wptutsplus_home_page_banner () // börja med att ställa in frågan $ query = new WP_Query (array ('post_type' => 'banner')); // Kontrollera nu om frågan har inlägg och om så är fallet, skriv ut innehållet i en bannerfält div om ($ query-> have_posts ()) ?> 
have_posts ()): $ query-> the_post (); ?>
>

Detta kör en fråga på bannerposttypen och utmatar sedan innehållet i varje banner om det finns några inlägg. Observera att jag bara utmatar innehållet, inte titeln - om du vill inkludera titlar i dina banderoller, kan du enkelt göra det genom att lägga till titeln() till din funktion.

Lägga till funktionen i din mallfil

För närvarande kommer banners fortfarande inte att visas någonstans på din webbplats - du måste lägga till din nyskapade funktion i en mallfil för att få det att hända.

Jag ska lägga till min funktion till min header.php fil, men du kan lägga till den var du vill, till exempel i din sidfot eller sidofält i page.php fil eller i en speciell front-page.php fil.

Eftersom jag bara vill visa banners på min hemsida, lägger jag in min funktion i om (is_home_page ()) villkorlig etikett. Detta kommer att kolla på hemsidan om du har din huvudblogsida eller en statisk sida som hemsida för din webbplats.

I min header.php fil, lägger jag till följande precis inuti öppningen

märka. När jag jobbar med ett barntema har jag skapat en ny header.php fil i mitt barntema som är en duplikat av huvudtemaets huvudfiler med undantag för den här nya koden.

Den banner jag skapade tidigare visas nu på min hemsida:

Styling the Banner

För tillfället är min banner inte mycket iögonfallande eller framträdande. Jag ändrar det med någon styling.

Lägg till följande i ditt temans stilark:

.hem. banner-box text-align: center; färgen röd; typsnittstorlek: 1.2em; gräns: 1px solid röd; vaddering: 1em; 

Detta kommer att lägga banderollen i en smutsig stor röd ruta, inte för subtil men det drar verkligen uppmärksamhet!

Om du har mer än en banner att visa på en gång och du vill markera en av dem, kan du göra det med någon styling. Jag ska skapa en annan banner och tilldela den kategorin "markera", så lägger jag till några stylingar för banderoller i kategorin till mitt stylesheet:

.hem. banner-box. category-highlight bakgrund: röd; färg: #fff; marginal: 0; vaddering: 0,5em; 

Detta gör den markerade bannern ännu mer framträdande:

Det ser inte ut för subtilt eller attraktivt, men det visar hur du kan uppnå denna teknik.

Som standard visas banners i nedstigande kronologisk ordning. Du kan ändra detta om du vill genom att lägga till argument till den fråga du skapade i det andra steget ovan.

Sammanfattning

Hemsida-banners kan vara ett användbart verktyg för att visa tillfälliga meddelanden eller driva trafik till andra delar av din webbplats. I den här handledningen har jag visat dig hur du skapar en enkel hemsida-banner med en anpassad posttyp, som du kan använda var som helst i din webbplatss tema.

Medel

Funktioner, taggar och klasser som används i denna handledning:

  • register_post_type ()
  • WP_Query
  • om (is_front_page ())