Accentsconagua

Så här skapar du ett Wordpress-tema från början Del 2

Koda
Share

Det är dags för de bra sakerna nu. Vi lägger till kommentarsystemet, ett sidofält med widgets och ett arkiv för alla gamla inlägg. Detta kommer att täcka allt du behöver för ett enkelt men väl fungerande WordPress-tema, och förhoppningsvis kan du tillämpa detta på alla typer av projekt.

Översikt över tilläggen

Genom att följa med i den föregående artikeln om hur man skapar en WordPress-tema från början, lägger vi nu till att åh, så saknar sidofältet, kommentarsystemet och till sist en arkivsida. Detta borde få dig väl introducerad i WordPress-teman, men du kan alltid förbättra så jag ger dig också lite rekommenderad läsning.

Jag hoppas att visa dig hur du konfigurerar en widget redo sidebar, vilket också skulle ge dig en uppfattning om hur man lägger till widgets till andra områden i en mall. Kommentarer systemet är ganska enkelt, men vi gillar alltid vår webbplats att se bra ut så det kommer att bli lite styling involverad. Slutligen arkivet, det här är en av WordPress standardmallfiler, men anpassade sidor är mycket lika och dödar två fåglar med en sten ...

Steg 1 - Sidofältet

Alltid bäst att ta itu med de hårda delarna först rätt? Nåväl kan vi börja då. Skapa en ny fil i ditt temas katalog kallad functions.php och öppna den för redigering. Klistra in följande:

 "," after_widget '=> "," before_title' => '
',' after_title '=>'
',)); ?>

Vad det här gör är att berätta för WordPress att det finns ett widgetsklar sidofält i vårt tema. Denna kod kan utvidgas till att inkludera teman med flera widgetsklar områden. Vi säger också att vårt temas sidofält behöver olika HTML från vad WordPress normalt producerar. Vad det här gör är att stoppa sidbalk widgets bli insvept i

  • taggar, som inte skulle se så bra ut för oss.

    Nu kan vi utforma sidoregionen, skapa ytterligare en fil, kallad sidebar.php och klistra in i följande.

     
      
    Handla om
     
    Detta är defult sidebar, lägg till några widgets för att ändra den.

    Vad det här gör är att bara berätta för WordPress där sidfältet är tänkt att vara. Det finns en liten standardtext där om du inte har några widgets på sidofältet.

    Slutligen måste vi inkludera sidfältet i index.php, så öppna det och lägg till följande strax före

    taggen, se till att rubriken innehåller tagg finns fortfarande högst upp i filen.

    Grattis, du har just lagt till ett dynamiskt sidofält för temat.

    Steg 2 - Kommentarer

    WordPress-kommentarsystemet kan vara lika enkelt eller så komplicerat som du önskar, men för att det här är en enkel handledning som bygger ett enkelt tema, kommer vi att använda den enkla metoden för att lägga till kommentarer till våra inlägg.

    WordPress gör det enkelt genom att ha en standardkommentarsystemdesign som följer med varje kopia av WordPress, och det kan användas av vilket som helst tema. Så det är vad vi ska göra. Öppna index.php och lägg följande efter rad 13 (jag talar om strax efter linjen med alla postdetaljer som tiden(), etc.)

    Som du kan se innehåller detta en fil som vi inte har i vår temalmag, men faktiskt från någonstans inom WordPress förvirrande djup. Skämt åt sidan, detta gör vårt liv mycket enklare.

    Testa ditt tema nu, så märker du att det är smart nog att inte visa formuläret och alla kommentarer på hemsidan, men när du klickar på ett inlägg gör det allt som du vill. Tja ... förutom att textområdet är väldigt stort. För att åtgärda detta vill vi inte gå och redigera kärnan i WordPress utan bara lägga till en rad CSS och göra det lite lättare att läsa i processen. Lägg sedan till följande i botten av style.css.

     textarea # comment width: 400px; vaddering: 5px;  .commentmetadata font-size: 10px;

    Den första raden kommer att begränsa textområdets med till en förnuftig storlek och också lägga till lite vadderingar för att göra det lite lättare att läsa. Du har nu ett enkelt men alltid funktionellt kommentarsystem i ditt tema.

    Metadata var också lite små, så det är vad andra raden täcker.

    Steg 3 - Arkivet

    De flesta WordPress-sidor har ett "arkiv", platsen att leta efter gamla inlägg. Vanligtvis visas två listor, en med länkar till alla inlägg i sidokategorierna och en med alla inlägg per månad. Detta håller arkivet snabbt att bläddra igenom och gör det till en bättre användarupplevelse.

    archives.php ses av WordPress som en av deras standardfiler, behöver du inte lägga till någon speciell rubrik för att få den sett. Men om du vill skapa en annan sidmall som inte är standard, ta en läs här.

    Så skapa den nya filen och lägg i följande, och allt kommer att förklaras.

       
     
      
       
    •  
      Arkiv efter kategori
       
          
       
      •  
    •  
      Arkiv efter månad
       
          
       
      •

    Detta kan se ganska liknar index.php men du kanske märker att det inte finns någon WordPress-loop. Detta beror på att vi skapar en sida, med bara ett objekt i det. Vi kan fortfarande använda funktioner som titeln() att få och visa information om sidan.

    Det finns också innehållet() funktion, så att om du lade en liten text på den här sidan skulle den fortfarande visas. Nu är nästa saker ganska enkla, det är en standardlista (två väl faktiskt ...) med två funktioner i den, wp_list_categories () och wp_get_archives (). Båda funktionerna utgår från en standardlista, den första listan alla sidokategorier och ger var och en en länk som går att visa alla inlägg i den kategorin. Den andra gör detsamma, förutom att det visar månader inte kategorier.

    Parametrarna i funktionerna gör att de visar kategorin / månaden med en posträkning för tillagd dynamisk platsfaktor, hehe. För att lägga till den här coola arkivsidan på din webbplats måste du skapa en ny sida och ändra alternativet "Sidmall" till den nya "Arkivsidan". Kolla in det, en cool arkivsida för alla att se hur mycket du har skrivit.

    Granskning - Fungerar det?

    Ja det gör sidofältet sitt jobb. Samma sak gäller kommentarsystemet och arkivsidan. Jag hoppas att det här har visat dig grunderna om hur man gör ett WordPress-tema, även om det finns enklaste former. Kolla in länkarna nedan för att komma igång med den mer avancerade teman som finns tillgänglig för WordPress.

    Vidare läsning

    • WordPress Codex

      Temautveckling, codex är tydlig och välskriven dokumentation. Kommer från skaparna av WordPress kan du inte gå fel enligt instruktionerna.

      Besök

    • CSS Tricks Screencast

      Det var mycket omnämnande om CSS Tricks 3-delguide till WordPress-tema, så jag skulle dock lägga upp den här. Det går igenom hur man bygger en bra sida, en rättvis bit mer komplicerad att den här men ska förbättra sig på de tematiska färdigheterna.

      Besök

    Koda
    • ×