この記事は最終更新日から2年以上経過しています。

WordPressでTwigを使えるようにするプラグイン Timber

公開日:

更新日:

スタッフブログ

こんにちは。ましじめの田村です。

WordPressでTwigを使いたい場合にTimberプラグインが良さそうでしたので紹介したいと思います。
timber公式サイト

twigとは

twigとはPHP製のテンプレートエンジンです。

PHP

<?php echo $var ?>
<?php echo htmlspecialchars($var, ENT_QUOTES, 'UTF-8') ?>

PHPだとこのように書くところを

Twig

{{ var }}
{{ var|escape }}

このようにシンプルに書くことができます。

有名どころではDrupalやCraftCMS、GRAVとさまざまなCMSでも使われています。
記述の習得は必要ですが、多くのシステムで使われていますので覚えておいても損をするということはなさそうです。

詳しくは公式サイトを確認ください。
Twig

プラグインを有効化して使ってみよう

まずはこのあたりから順を追ってはじめるとそさそうです。
サンプルテーマもありますので確認してみてください。
getting-started

実際にはWordPressの記述をこういう感じでテンプレートを書いていくことができます。

title

<h1 class="article-h1"><?php the_title(); ?></h1>
↓
<h1 class="article-h1">{{ post.title }}</h1>

single

{% extends "base.twig" %}

{% block content %}
    <div class="content-wrapper">
        <article class="post-type-{{ post.post_type }}" id="post-{{ post.ID }}">
            <section class="article-content">
                {% block headline %}
                    <h1 class="article-h1">{{ post.title }}</h1>
                    <h2 class="article-h2">{{ post.subtitle }}</h2>
                {% endblock %}

                <p class="blog-author"><span>By</span> {{ post.author.name }} <span>&bull;</span> {{ post.post_date|date }}</p>
                {{ post.content }}
            </section>
        </article>
    </div>
{% endblock %}

テンプレートをextendsしたりfilterを使用することも可能です。
他のCMSなどでTwigを使ったことがある方は比較的スムーズに導入できるかなと思います。

以前WordPressにTimberを入れてTwigでサイト作成した際は、概ねやりたいことはできた印象でした。 個人的にはテンプレートエンジンを通して書いた方が安心するので好みな書き方です。

以上「WordPressでTwigを使えるようにするプラグイン Timber」でした。
WordPressでTwigを使いたい場合に参考にしてみてください。

この記事をシェアする

関連記事

この記事のハッシュタグ #WordPress から関連する記事を表示しています。

WordPress WP_Query 任意のID順に並べて表示する

こんにちは。ましじめの田村です。 WordPressで任意の投稿ID順に並べて表示したい場合あがありました。 関数リファレンス この場合次のコードで実現出来そうです。 $args = [ 'post__in' =&gt; [10,20,30,40,50], //投稿ID 'orderby' =&gt; 'post__in' //並び順を投稿ID順に ]; $query = new WP_Query( $args ); 以上「WordPress WP_Query 任意のID順に並べて表示する」でした。 任意の投稿ID順に並べたい場合参考にしてみてください。

スタッフブログ

MW WP Form の返信メールに送信日時を表示

こんにちは。タムショーです。 MW WP Formで返信メールに送信日時を表示したいというケースがありました。 この場合次の方法で実現できそうです。 マニュアルはこちら https://plugins.2inc.org/mw-wp-form/filter-hook/mwform_custom_mail_tag/ // 自動返信メール設定 受付日時:{send_datetime} // function.php $form_id = xxx; //返信メールに送信日時を表示 //-------------------------------- function send_date_time( $value, $key, $insert_contact_data_id ) { if ( $key === 'send_datetime' ) { return date_i18n( 'Y年m月d日 H時i分' ); } return $value; } add_filter( 'mwform_custom_mail_tag_mw-wp-form-' . $form_id, 'send_date_time', 10, 3 ); MW WP Form の返信メールに送信日時を表示したい場合に参考にしてみてください。

スタッフブログ