LoginSignup
22
24

More than 5 years have passed since last update.

WordPressをLaravel、SlimFrameworkなど既存フレームワーク、Twigと連携する

Last updated at Posted at 2016-12-04

WordPressをLaravelなどのフレームワークと連携などできると楽だな、でもできないなと勝手に思い込んでいたのですがよくよく考えればWordPressは昔ながらの素のphpの塊なので管理画面など独自依存を高いものをスルーするように作っておけば簡単に連携することが出来ました。
連携することで管理画面はWordPressで表画面はフレームワークの便利な機能を使った処理が簡単にかけるようになります

今回紹介するのはSlimFramework3というシンプルなフレームワークでWordPressとテンプレートシステムのTwigを連携して使う方法です。
Laravelでも同じように出来ます(若干グローバル変数で詰まるので要注意)。

1. SlimFramworkをインストールします。

インストール方法はcomposerを使い、プロジェクト名はslimとします。

php composer.phar create-project slim/slim-skeleton slim

これでslimというフォルダにSlimFrameworkがインストールされました

2. WordPressをインストールする

この出来たフォルダの中でサイトルートディレクトリに当たる箇所がpublicフォルダなのでここにwpをインストールします。
publicの中にwpというディレクトリを作りWordPress一式入れます。
そのままhttp://ドメイン名/wp/にアクセスしインストールを開始します(簡単なんで省略)。
インストールを終えたら管理画面にログインしてサイトURLをhttp://ドメイン名/に設定します。

3. ルーティング処理でWordpressを呼び出す

URLを処理するルーティング処理がsrc/routes.phpにありますので処理を分けたいURLごとに記述していきます。
初期設定では以下のように書かれています。

src/routes.php
$app->get('/[{name}]', function ($request, $response, $args) {
    // Sample log message
    $this->logger->info("Slim-Skeleton '/' route");

    // Render index view
    return $this->renderer->render($response, 'index.phtml', $args);
});

この処理をまずSlimFrameworkのrendererではなくWordPressが出力されるように変更します。

src/routes.php

$app->get('/[{name}]', function ($request, $response, $args) {
    $this->logger->info("WordPress Render");
    define('WP_USE_THEMES', true);
    require( getcwd() . '/wp/wp-blog-header.php' );
});

これでWordPressの表示がされるようになりました。
管理画面(/wp/wp-admin/)はwp/wp-admin内に実ファイルがあり、そちらが優先されるので何か特殊な設定をしていない限りは書く必要はありません。

4. Twigをインストールする

次にwordpressでTwigが使えるようにTwigをインストールします。
作成したslimプロジェクトのディレクトリに移動して

php composer.phar require slim/twig-view

を実行してインストールします。
このslim/twig-viewはSlimFrameworkでTwigを使えるようにするためのものです。
これをインストールするとTwig本体もインストールされます。
src/dependencies.phpに以下を追記します


$container['view'] = function ($c) {
    //デフォルトで用意された設定を流用 src/setting.php参照
    $settings = $c->get('settings')['renderer'];
    //初期設定 Cacheファイルのパスは任意のものに書き換えて
    $view = new \Slim\Views\Twig($settings['template_path'], [
        'cache' => '任意のCacheディレクトリのパス'
    ]);

    // Instantiate and add Slim specific extension
    $basePath = rtrim(str_ireplace('index.php', '', $c['request']->getUri()->getBasePath()), '/');
    $view->addExtension(new Slim\Views\TwigExtension($c['router'], $basePath));

    return $view;
};

5. WordPressのテンプレートを書き換えてtwigで出力されるようにする

WordPress側のテンプレートは昔ながらのechoなど利用した天ぷら方式なのでその箇所を出力せずにtwigテンプレートを通して出力されるように書き換えます。
WordPressのテーマから直接出力するecho,the_xxxxなどの記述をやめて、get_the_xxxなどを使って一度、変数に格納するように改めます。
ここでは$stashという配列またはstd objectにWordPressで出力したいものを格納していきます。
プラグインなどで直接HTMLが出力されるような場合もob_start(), ob_get_clean()などを使って$stashに格納します。
あとは$stashをtwigにバインディングして出力します。

WordPressのテーマのindex.php
//一覧記事
$stash->articles = [];
if ( have_posts() ) :
while (have_posts()) {
    the_post();
    global $post;
    $article = $post;
    $stash->articles[] = $article;
}
topページ用のindex.twig
{#headerの記述を書く#}
{#記事呼び出し出力例#}
{% for article in stash.articles %}
{{article.ID}}<br>
{{article.post_author}}<br>
{{article.post_date}}<br>
{{article.post_date_gmt}}<br>
{{article.post_title}}<br>
{{article.post_content}}<br>
{{article.post_excerpt}}<br>
{{article.post_status}}<br>
{{article.comment_status}}<br>
{{article.post_name}}<br>
{{article.ancestors}}<br>

{% endfor %}
{#footerの記述を書く#}

6. SlimFramework側のルーティングをtwig用に再設定する

src/routes.php
$app->get('/[{name}]', function ($request, $response, $args) {
    $this->logger->info("WordPress Render");
    define('WP_USE_THEMES', true);
    $stash = new stdClass();
    require( getcwd() . '/wp/wp-blog-header.php' );
    //twigで描画
    return $this->view->render($response, 'index.twig', [
        'stash' => $stash,
        'req'   => $req
    ]);
});

注意点

Wordpressはグローバル変数を使います。$requestとか$postとかですね。
フレームワーク側でも使っていることがあるためフレームワーク側とWordpress側のグローバル変数がバッティングすることがあります。
その場合WordPressをインクルードする前にグローバル変数を別途別の変数に保存してやってWordPress読み込み完了後に元に戻してやるなどの必要があります。

22
24
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
22
24