Timber – czyli Twig w WordPressie

Timber to nie kolejny serwis do randkowania, chocia偶 jego nazwa brzmi podobnie do jednego z nich (Tinder 馃榾 ). Umo偶liwia on natomiast korzystanie z systemu szablon贸w Twig w WordPressie. Aby zacz膮膰 z niego korzysta膰 wystarczy zainstalowa膰 wtyczk臋 Timber.

Co daje Timber?

G艂贸wn膮 zalet膮 jest tutaj oddzielenie danych oraz logiki od szablonu, widoku co zosta艂o umo偶liwione poprzez zastosowanie Twiga. Domy艣lne tworzenie szablon贸w w WP odbywa si臋 za pomoc膮 php:

$thumb_id = get_post_thumbnail_id($post->ID);
$url = wp_get_attachment_url($thumb_id);
<img src="<?php echo $url; ?>" alt="Thumbnail for Timber" />

Powy偶szy kod jak pokazuje dokumentacja Timbera, mo偶emy teraz zapisa膰 w taki spos贸b:

<img src="{{post.thumbnail.src}}" alt="Thumbnail for Timber" />

Co wygl膮da du偶o bardziej przejrzy艣cie.

Jak to dzia艂a?

Korzystaj膮c z Timbera tworzymy dwa pliki, przyk艂adowo: single.php聽oraz single.twig. Pierwszy z nich zawiera logik臋 np. pobieranie danych, ustawianie zmiennych etc. Natomiast w drugim pliku znajduje si臋 prezentacja danych. Poni偶ej przedstawione s膮 te dwa pliki, skopiowane z przyk艂ad贸w znajduj膮cych si臋 w dokumentacji.

single.php

$context = Timber::get_context();
$context['foo'] = 'Bar!';
$context['post'] = new Timber/Post();
Timber::render('single.twig', $context);

single.twig

{% extends "base.twig" %}
{% block content %}
  <h1 class="big-title">{{foo}}</h1>
  <h2>{{post.title}}</h2>
  <img src="{{post.thumbnail.src}}" />
  <div class="body"> {{post.content}} </div>
{% endblock %}

Jak zacz膮膰?

Timbera mo偶na zainstalowa膰 na dwa sposoby:

  • poprzez wtyczk臋 –聽Timber
  • za pomoc膮 composera –聽composer require timber/timber

Mo偶emy tworzy膰 sw贸j w艂asny szablon oparty o Timbera lub skorzysta膰 z gotowych startowych szablon贸w:

 

Wi臋cej informacji mo偶na znale藕膰 w dokumentacji projektu.

Udost臋pnij: