はなゐろぐ

主に技術関係の覚え書きです。

TimberにMarkdownをパースするカスタムフィルタを追加する

2021年9月29日

まず、Markdownパーサをインストールします。今回はParsedownを使います。

$ composer require erusev/parsedown

次に、カスタムフィルタを追加します。

functions.php
require_once 'vendor/autoload.php';

add_filter(
    'timber/twig',
    function( $twig ) {
        $twig->addFilter(
            new \Twig\TwigFilter(
                'markdown',
                function( $value ) {
                    return Parsedown::instance()
                        ->setMarkupEscaped( true )
                        ->setBreaksEnabled( true )
                        ->text( $value );
                }
            )
        );

        return $twig;
    }
);

setBreaksEnabled()をtrueにすることで、単一の改行をbr要素に変換してくれます。

参考: Tutorial: Get Started · erusev/parsedown Wiki · GitHub

markdownという名前のカスタムフィールドをパースするなら、こんな感じ。

{{ post.meta('markdown')|markdown }}

余談: なぜMarkdownを使うのか

カスタムフィールドのコンテンツにリンクや簡単な装飾を含めたい、というご要望がありました。Wysiwygで対応しようと思っていましたが、機能が多く冗長でした。Wordのように自由度が高い一方、デザインを逸脱してしまわないかという懸念がありました(原色や極端に大きいフォントサイズなど)。Markdownは自由度が低く、今回のようなちょっとした装飾程度なら必要十分だと考えました。