WordPress-mallit aloittelijoille: Puu

Viimeisin päivitys marras 9, 2022

Sisältö

WordPress-malli: puun käyttö

1 Määritä paikallinen asennus puutavaralle

Sen jälkeen kun puhuin WordPress-mallista, olen käsitellyt joitain erilaisia saatavilla olevia moottoreita:

Jos katsot Moustachea, saatat olla kiinnostunut Ohjaustangoista, ja jos katsot Bladea, suosittelen tutustumaan Sagen Roots – tiimiin.

Mutta tässä viimeisessä postauksessa aion jatkaa Timberillä, jonka esittelin eilen. En ole niinkään siitä, mitä käytetään (koska niillä kaikilla on kompromissinsa), kunhan se on johdonmukaista.

WordPress-malli: puun käyttö

Näin voit aloittaa Timberin käytön projekteissasi.

Aloitaksesi sinun on tunnettava Composer ja sinulla on oltava paikallinen kehitysympäristö. Jos sinulla ei ole kumpaakaan näistä tai tarvitset apua, autan sinua:

Kun olet käynyt läpi kunkin oppaan vaiheet, sinun pitäisi olla valmis. Joten tässä on mitä aiomme tehdä.

1 Määritä paikallinen asennus puutavaralle

Aion käyttää Valetia tähän, mikä tarkoittaa, että minulla on hakemisto, jossa on uusin WordPress -versio (joka on 4.8.3) asennettuna sen hakemistoon.

Tämä tarkoittaa, että minulla on tietokanta jo valmiina käyttöön:

Ja aion antaa seuraavat komennot Laravelin ja suojatun asennuksen asentamiseksi (jäljittelemään lavastusympäristöä):

$ valet link
$ valet secure

Jotta pääsen sivustolle selaimella.

Niille, jotka ovat kiinnostuneita, käytän:

WordPress 4.8.3
kaksikymmentäviisitoista
Puhdista pysyvät linkit

Eikä muita liitännäisiä. Se on vain vanilja-asennus, muuta kuin mitä yllä näet.

Tässä vaiheessa olen valmis asentamaan Timberin.

2 Puun asennus

Olettaen, että noudatit yllä olevia Valet- ja Composer-ohjeita, sinun pitäisi olla valmis. Siirry päätelaitteen avulla WordPress-asennushakemistoosi.

Anna sitten seuraava komento:

$ composer require timber/timber

Tämä asentaa Timberin, mutta sinun on silti päivitettävä teemasi functions.php-tiedosto, jotta se käyttää oikein Composerin automaattista latausohjelmaa.

Olettaen, että kaikki on mennyt oikein, sinun pitäisi pystyä päivittämään sivustosi, navigoimaan mahdollisille viesteille, sivuille ja niin edelleen, eikä mikään saisi olla epäkunnossa.

3 Puun alustaminen

Lopuksi on aika käyttää Timberiä korvaamaan suuri osa siitä, mitä olemme tottuneet näkemään WordPress-mallin yhteydessä.

Päätän tehdä tämän sisällön-page.php-sivulla, jotta sitä olisi helppo seurata. Huomaa, että muuttamani koodisegmentti näyttää alun perin tältä:

<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-## -->

Tässä viestissä en aio luoda täysin uudelleen sitä, mitä näet yllä, mutta aion aloittaa sen kanssa, mitä tarvitaan mallimoottorin käytön aloittamiseen PHP-säätiön yhteydessä.

Ensin sinun on luotava malli, jota voidaan käyttää mallisivulla tavallisessa WordPress-asennuksessa. Soitin omalleni template-timber-page.php ja se näyttää tältä:

<?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
);

Yllä olevassa koodissa tapahtuu seuraavaa:

Esitän puuobjektin.
Sitten saan puukontekstin. Konteksti sisältää paljon tietoa, joka on hyödyllistä mallissa (tai sivustossa) riippuen siitä, missä käytät mallia.
Sen jälkeen nappaan TimberPostia, joka on pohjimmiltaan WordPress-viestin laajennus. Siinä on WP_Postin tiedot, mutta se on käytettävissä malleissamme.
Seuraavaksi asetin $context -taulukon viestihakemiston viittaamalla Timber- postiin (jota olen kutsunut nimellä $post ).
Lopuksi käsken Timberiä renderöimään sivu nimeltä content-sample-page.twig annettua kontekstia käyttäen.

Tässä on tärkeää luoda varsinainen twig-tiedosto (joka on Timber-mallitiedoston pääte). Joten loin content-sample-page.twig ja se näyttää tältä:

{% 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 %}

Kun olet luonut Timber-objektin ja korvannut yllä olevan koodin, huomaat, että koodi lukee hieman eri tavalla (vaikkakaan ei ollenkaan vaikea seurata).

4 Mallin käyttäminen

Ota malli käyttöön siirtymällä WordPressin sivuille . Etsi mallisivu ja valitse mallipohjan pudotusvalikosta juuri luomamme käyttämällä yllä olevaa otsikkoa:

Kun se on tehty, voit tarkastella julkaisua. Huomaat, että se näyttää hieman alastomalta verrattuna siihen, mitä olemme tottuneet näkemään:

Mutta saat yleisen käsityksen siitä, kuinka voimme käyttää kontekstia päästäksemme moniin samoihin ominaisuuksiin, jotka olemme tottuneet näkemään WordPressissä ilman, että joudumme täyttämään koodia merkinnöillä ja PHP:llä ja kaikilla muilla käyttämillämme käyttöön.

Lisää resursseja

Tiedän, että tämä on pääasiassa mallintamisen pikakurssi, eikä se kata läheskään niin paljon kuin voisi. Kun tämä viesti lähestyy 1000 sanaa, minun on vedettävä raja jonnekin, joten päätän tehdä sen tässä.

Tämä ei kuitenkaan tarkoita, että olisin lopettanut keskustelun. Aion palata tulevissa ruukuissa edistyneempiin aiheisiin, jotka liittyvät mallintamiseen.

Mutta jos olet kiinnostunut, suosittelen seuraamaan sekä Getting tarted -opasta Timberille että projektia GitHubissa.

Tämä antaa sinulle ainakin lähtökohdan, josta voit edistyä entistä enemmän pyrkimyksissäsi luoda puhtaampaa, loogisemmin erillistä koodia kuin mitä olemme tottuneet näkemään WordPressissä.

: tommcfarlin.com