WordPress-mallar för nybörjare: Hur det är

Senaste uppdateringen nov 9, 2022

Innehåll

2 Får utvecklarorganisationen prestanda?

När jag först började fundera på mallar i WordPress tänkte jag på två aspekter:

innehåll specifikt för medlemmar ,
innehåll som kan delas upp i ett enda inlägg.

Men ju mer jag tänkte på det, desto mer insåg jag att det kunde (och utan tvekan borde) förklaras under loppet av några inlägg.

Så jag kommer att bryta ner det nuvarande tillståndet för WordPress-mallar och sedan praktiska sätt vi kan ta, organisera, säg, våra plugins så att vi använder standard PHP.

Efter det ska jag i en framtida serie titta på vad det innebär att använda andra mallmotorer (både PHP och JavaScript i det arbete vi gör).

Till att börja med vill jag dock ta en titt på hur vi ofta ser mallar skrivna inom ramen för både WordPress-teman och plugins.

WordPress-mallar för nybörjare

Beroende på din erfarenhet av WordPress och andra PHP-baserade system är din definition av mall annorlunda än någon annans.

Så för att försöka skapa en gemensam definition som jag kommer att använda under den här serien av inlägg kommer att användas från WordPress Codex:

Mallar är filerna som styr hur din WordPress-webbplats kommer att visas på webben.

Sidan fortsätter med att prata om hur det fungerar tillsammans med databasen och andra tillgångar, och jag rekommenderar att du läser om det om du inte är bekant med det.

Definitionen ovan fungerar dock bra för hur jag tänker gå vidare när jag tänker på det.

1 Hur det är (just nu)

När det gäller att tänka på WordPress-mallar, tror jag att det hjälper att överväga en enda mall som med kod som ser ut ungefär så här:

<div id="content-container">

  <p>
    Oh! The garbage chute was a really wonderful idea. What an incredible smell you've discovered! Let's get out of here! 
    Get away from there... No! wait! Will you forget it? I already tried it. It's magnetically sealed! Put that 
    thing away! You're going to get us all killed.
  </p>

  <h2>List of Post Titles For Acme Post Type</h2>
  <?php
  $args = array(
    'post_status'    => 'publish',
    'post_type'      => 'acme',
    'posts_per_page' => '10'
  );
  $custom_query = new WP_Query( $args );

  if ($custom_query->have_posts()) {
    echo '<ul>';
    while ($custom_query->have_posts()) {
      $custom_query->the_post();
      echo '<li>'. get_the_title(). '</li>';
    }
    echo '</ul>';
    wp_reset_postdata();
  }
  ?>

  <p>
    Absolutely, Your Worship. Look, I had everything under control until you led us down here. You know, it's not 
    going to take them long to figure out what happened to us. It could be worst... It's worst. 
    There's something alive in here! That's your imagination. Something just moves past my leg! 
    Look! Did you see that? What? Help!
  </p>

</div><!-- #content-container -->

Poängen med koden ovan är att du ser är att den blandar PHP och HTML.

Dessutom är det viktigt att notera att var och en av dessa filer är utformade med CSS och kan ha ytterligare beteende kontrollerat via JavaScript. För det ändamålet kan du föreställa det så här:

Detta representerar en enda mall som blandar både HTML och PHP till en enda mall. Och den mallen formateras sedan med CSS och styrs med JavaScript.

Alla dessa fungerar tillsammans för att ge vad det är som användaren ser.

2 Får utvecklarorganisationen prestanda?

Men sättet som det här fungerar på är lite rörigt, och även om det kan se bra ut för användaren väcker det några frågor:

Är den så presterande som den kan vara?
Hur lätt är det för en utvecklare att underhålla?
Vad är byggprocessen?
hur underhålls och organiseras tillgångarna?

Visst, det mesta av det du läser ovan är väldigt utvecklarcentrerat, men jag tycker att när en kod är organiserad på ett sådant sätt att det är lätt för utvecklare att arbeta med kan det ofta vara enkelt ännu snabbare för användaren.

Vad betyder det dock?

Presenterar vi Sass?
Minifierar vi JavaScript?
Hur kombinerar vi dessa tillgångar och importerar dem?
Hur är det med de anpassade PHP-frågor som sker inom ramen för varje mall?

Och även om de första sakerna är viktiga och värda det (och jag kanske tar upp i en serie efter detta), kan separering av logik inifrån en mall även utan en mallmotor hjälpa till att göra koden mer utvecklarcentrerad.

Gör det saker snabbare för användaren? Inte nödvändigtvis. Men det hjälper oss att ta det första steget i att göra just det.

Låt oss omorganiseras

I nästa inlägg i den här serien kommer jag att bryta ner innehåll vi är vana vid att se i WordPress-mallar genom ett exempel och börja omorganisera det så att det blir bättre organiserat på ett sådant sätt att teknikerna kan användas i olika projekt.

Detta innebär att flytta saker till deras funktioner (eller till och med inom deras klasser och därmed deras funktioner) och hur vi kan anropa dem inom ramen för våra mallar.

I slutändan kommer detta att leda till kod som är lättare att läsa, bättre separering av bekymmer och föra oss mot sätt att ändra hur data injiceras i en mall.

Inspelningskälla: tommcfarlin.com