Twig + wordpress - 如何获取 style.css 的文件时间

Question

我在我的 wordpress 主题中使用 twig + timber。我有 style.css 文件以这种方式包含

<link rel="stylesheet" href="{{ site.theme.uri }}/dist/css/style.min.css" />

我想添加 ?ver=xxxx 以防止文件缓存。我的问题是如何实现 filemtime 功能？我想做成这样

<link rel="stylesheet" href="{{ site.theme.uri }}/dist/css/style.min.css?ver=1202120210" />

Answer 1

有几种方法可以解决这个问题，都涉及编写一些 PHP.

第一种方法，也是我推荐的方法，是使用 wp_enqueue_style() 而不是将 <link> 标记添加到您的 twig 文件中。

/**
 * Places the following tag into the page <head>, where
 *  `{ theme_url }` = the url of your theme directory
 *  `{ filemtime }` = the timestamp of the last modified date
 *                    for the stylesheet
 * <link rel="stylesheet" href="{ theme_url }/dist/css/style.min.css?ver={ filemtime }" />
 */
function my_custom_css_styles() {
    wp_enqueue_style(
        'main-styles',
        get_template_directory_uri() . '/dist/css/style.min.css',
        array(),
        filemtime(get_template_directory() . '/dist/css/style.min.css'),
        false );
}
add_action( 'wp_enqueue_scripts', 'my_custom_css_styles' );

如果需要，您可以将多个样式表放入函数中，并且可以包含根据 post 类型、post ID 或您可以确定的任何内容有条件地加载它们的逻辑当前页面使用 PHP.

如果由于某种原因这对您不起作用，第二种方法是使用 PHP 生成您的版本号，然后将其作为新变量添加到您的 Timber 上下文中。你在 Twig 中的行看起来像这样：

<link rel="stylesheet" href="{{ site.theme.uri }}/dist/css/style.min.css?ver={{ style_css_version }}" />

然后在您的模板文件中，您将在定义上下文后添加新的 style_css_version 变量：

$context = Timber::get_context();
$context['style_css_version'] = filemtime(get_template_directory() . '/dist/css/style.min.css');

如果您想在您网站的每个页面上使用它，而不仅仅是具有特定模板的页面，您可以将它添加到 functions.php 的全局 Timber 上下文中（更多信息在 ):

function my_custom_timber_context( $context ) {
    $context['style_css_version'] = filemtime(get_template_directory() . '/dist/css/style.min.css');
}

add_filter( 'timber_context', 'my_custom_timber_context'  );

Answer 2

我更喜欢这种灵活的方法。

functions.php

/**
 * versioned_theme_uri() Twig Function
 *
 * Create an auto-versioned URI for a relative theme file.
 *
 * @param \Twig\Environment $twig The Twig environment.
 * @return \Twig\Environment
 */
function kevinlearynet_extend_timber_twig($twig) {
  $twig_function = new Timber\Twig_Function( 'theme_uri_versioned', function ($theme_file) {
    $uri = get_theme_file_uri( $theme_file );
    $filepath = get_theme_file_path( $theme_file );
    $version = file_exists( $filepath ) ? filemtime( $filepath ) : 'FILE_NOT_FOUND';

    return "$uri?v=$version";
  } );

  $twig->addFunction( $twig_function );

  return $twig;
}
add_filter( 'timber/twig', 'kevinlearynet_extend_timber_twig' );

主题 .twig 模板

<link rel="stylesheet" href="{{ theme_uri_versioned('dist/app.min.js') }}" type="text/css" media="all" />

Twig + wordpress - 如何获取 style.css 的文件时间

Twig + wordpress - how to get filemtime for style.css

wordpress

twig

timber