Question

我在wordpress主题中使用树枝+木材。我以这种方式包含了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>标签添加到树枝文件中。

/**
 * 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' );

您可以根据需要将多个样式表放入该函数中，并且可以包含逻辑以根据帖子类型，帖子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上下文中（更多信息，请访问Timber - extend data to context (WordPress)）：

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的filemtime

2 个答案: