WordPressi mallid algajatele: puit

Last updated 9. November 2022

Inhalt

WordPressi mall: puidu kasutamine

1 Seadistage puidu jaoks kohalik paigaldus

Alates WordPressi mallidest rääkimisest olen käsitlenud mõningaid erinevaid saadaolevaid mootoreid:

Kui vaatate Moustache’i, siis võite olla huvitatud juhtraudadest ja kui vaatate Blade’i, siis soovitan tungivalt vaadata Sage’i Rootsi meeskonnast .

Kuid selle viimase postituse jaoks jätkan Timberiga, mida ma eile tutvustasin. Ma ei ole niivõrd selles, mida kasutatakse (kuna neil kõigil on oma kompromissid), kui see on järjepidev.

WordPressi mall: puidu kasutamine

Seda arvestades saate Timberit oma projektides kasutada järgmiselt.

Alustamiseks peate olema kursis rakendusega Composer ja teil peab olema kohalik arenduskeskkond. Kui teil pole kumbagi neist või vajate abi, siis aitan teid:

Kui olete kõigis nendes juhendites kirjeldatud sammud läbinud, peaksite olema valmis. Nii et siin on see, mida me tegema hakkame.

1 Seadistage puidu jaoks kohalik paigaldus

Kasutan selleks Valetit, mis tähendab, et selle kataloogi on installitud kataloog, mille kataloogi on WordPressi uusim versioon (4.8.3).

See tähendab, et mul on andmebaas juba kasutamiseks valmis:

Ja ma annan välja järgmised käsud Laraveli seadistamiseks ja turvaliseks installimiseks (et jäljendada lavastuskeskkonda):

$ valet link
$ valet secure

Et saaksin saidile brauseris juurde pääseda.

Neile, kes on uudishimulikud, kasutan:

WordPress 4.8.3
kakskümmend viisteist
Puhastage püsilingid

Ja muid pluginaid pole. See on lihtsalt vaniljeinstallatsioon peale selle, mida ülal näete.

Sel hetkel olen valmis Timberi installima.

2 Puidu paigaldamine

Eeldades, et järgisite ülaltoodud Valeti ja helilooja juhendeid, peaksite olema valmis. Nii et navigeerige terminali kasutades oma WordPressi installikataloogi.

Seejärel andke järgmine käsk:

$ composer require timber/timber

See installib Timberi, kuid peate siiski värskendama oma teema faili functions.php, et see kasutaks õigesti Composeri automaatlaadurit.

Eeldades, et kõik on läinud õigesti, peaksite saama oma saiti värskendada, navigeerida postitustele, lehtedele jne ning miski ei tohiks olla korrast ära.

3 Puidu lähtestamine

Lõpuks on aeg kasutada Timberit, et asendada suur osa sellest, mida oleme harjunud WordPressi malli kontekstis nägema.

Otsustan seda teha saidil content-page.php, et seda oleks lihtne jälgida. Pange tähele, et koodisegment, mida ma muudan, näeb algselt välja järgmine:

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <?php
        // Post thumbnail.
        twentyfifteen_post_thumbnail();
    ?>

    <header class="entry-header">
        <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
    </header><!-- .entry-header -->

    <div class="entry-content">
        <?php the_content(); ?>
        <?php
            wp_link_pages( array(
                'before'      => '<div class="page-links"><span class="page-links-title">'. __( 'Pages:', 'twentyfifteen' ). '</span>',
                'after'       => '</div>',
                'link_before' => '<span>',
                'link_after'  => '</span>',
                'pagelink'    => '<span class="screen-reader-text">'. __( 'Page', 'twentyfifteen' ). ' </span>%',
                'separator'   => '<span class="screen-reader-text">, </span>',) );
        ?>
    </div><!-- .entry-content -->

    <?php edit_post_link( __( 'Edit', 'twentyfifteen' ), '<footer class="entry-footer"><span class="edit-link">', '</span></footer><!-- .entry-footer -->' ); ?>

</article><!-- #post-## -->

Selles postituses ei hakka ma ülalolevat täielikult uuesti looma, vaid alustan sellega, mida on vaja mallimootori kasutamise alustamiseks PHP sihtasutuse kontekstis.

Esiteks peate looma malli, mida saab standardse WordPressi installi näidislehele rakendada. Helistasin oma mallile template-timber-page.php ja see näeb välja selline:

<?php

/**
 * Template Name: Timber Template
 * Description: Replaces the standard page with a Timber template.
 */

$timber  = new TimberTimber();
$context = Timber::get_context();
$post    = new TimberPost();

$context['post'] = $post;
Timber::render(
  array( 'content-'. $post->post_name. '.twig', 'page.twig' ),
  $context
);

Ülaltoodud koodis toimub järgmine:

Instantseerin Puitobjekti.
Siis saan puidu konteksti. Kontekst sisaldab palju teavet, mis on mallis (või saidil) kasulik, olenevalt sellest, kus te oma malli kasutate.
Pärast seda haaran TimberPosti, mis on sisuliselt WordPressi postituse laiendus. Sellel on WP_Posti andmed, kuid see muudab need meie mallidele kättesaadavaks.
Järgmiseks määrasin massiivi $context postitusindeksi viitega Timber Postile (mida olen nimetanud $post ).
Lõpuks käsin Timberil etteantud konteksti kasutades renderdada leht nimega content-sample-page.twig .

Siin on oluline luua tegelik oksafail (mis on Timberi mallifaili laiend). Seega lõin sisu-näidis-leht.twig ja see näeb välja selline:

{% block content %}
  <article id="post-{{post.ID}}" class="{{body_class}}">

    <header class="entry-header">
      <h1 class="article-h1">{{post.title}}</h1>
    </header><!-- .entry-header -->

    <div class="entry-content">
        {{post.content}}
    </div><!-- .entry-content -->

  </article><!-- #post-## -->
{% endblock %}

Pärast Timber-objekti instantseerimist ja seejärel ülaltoodud koodi asendamist märkate, et kood loeb veidi teistmoodi (kuigi seda pole üldse raske jälgida).

4 Malli rakendamine

Malli rakendamiseks liikuge WordPressis lehele Lehed. Otsige üles näidisleht, seejärel valige malli rippmenüüst see, mille me just lõime, kasutades ülaltoodud pealkirja:

Kui see on tehtud, saate postitust vaadata. Märkate, et see näeb pisut alasti välja võrreldes sellega, mida oleme harjunud nägema:

Kuid saate üldise ettekujutuse, kuidas me saame kasutada konteksti, et pääseda juurde paljudele samadele atribuutidele, mida oleme harjunud WordPressis nägema, ilma et peaksime koodi risustama märgistuse ja PHP-ga ja mis iganes muuga, mida me kasutame. kasutamiseks.

Rohkem ressursse

Ma tean, et see on valdavalt mallide kiirkursus ja see ei hõlma nii palju kui võimalik. Kuna see postitus läheneb 1000 sõnale, pean ma kuhugi piiri tõmbama, seega otsustan selle siin teha.

See aga ei tähenda, et ma oleksin selle arutamise lõpetanud. Kavatsen tulevastes pottides naasta keerukamate teemade juurde, mis on seotud mallide loomisega.

Kui olete aga huvitatud, soovitan tungivalt järgida nii Timberi Getting tartedi juhendit kui ka GitHubi projekti .

See annab teile vähemalt lähtepunkti, millest alates saate veelgi rohkem edasi liikuda, et luua puhtam ja loogilisemalt eraldiseisev kood, kui oleme harjunud WordPressis nägema.

: tommcfarlin.com