Làm cách nào tôi có thể hướng dẫn wordpress sử dụng tên tệp khác với 'style.css' cho biểu định kiểu chính của mình - ví dụ: style-1.css? Tôi muốn làm điều này cho các mục đích phiên bản và bộ nhớ đệm.
Làm cách nào tôi có thể hướng dẫn wordpress sử dụng tên tệp khác với 'style.css' cho biểu định kiểu chính của mình - ví dụ: style-1.css? Tôi muốn làm điều này cho các mục đích phiên bản và bộ nhớ đệm.
Câu trả lời:
Style.css
là cần thiết cho chủ đề WordPress của bạn. Đó là nơi WordPress lấy tên chủ đề và thông tin meta cho menu Giao diện >> Chủ đề từ đó. Điều đó nói rằng, bạn thực sự không phải sử dụng style.css
trong chủ đề của bạn. Tôi biết một số chủ đề có sẵn không sử dụng nó và tôi chỉ sử dụng nó trong một số ít các thiết kế tùy chỉnh của mình.
Trong header.php
chỉ đặt thẻ sau ở vị trí của liên kết stylesheet thường xuyên:
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory'); ?>/style-1.css" />
Điều này sẽ tải biểu định kiểu thay thế của bạn dưới dạng biểu định kiểu của trang và hoàn toàn bỏ qua thông thường style.css
.
Điều này có thể không phù hợp, xin vui lòng cho tôi biết nếu tôi bỏ lỡ một cái gì đó.
Đối số thứ tư wp_enqueue_style()
là số phiên bản của biểu định kiểu. Trong chủ đề của bạn functions.php
:
function my_theme_styles() {
// replace "10" with your version number; increment as you push changes
wp_enqueue_style('my-theme-style', get_bloginfo('template_directory') . '/style.css', false, 10);
}
add_action('wp_print_styles', 'my_theme_styles');
Yêu cầu bạn header.php
làm một wp_head()
, tất nhiên bạn đang làm gì. ;)
Điều này cho phép bạn đẩy các tiêu đề hết hạn dài bằng tệp CSS của mình và buộc khách hàng tải xuống một tệp mới bằng cách cập nhật số phiên bản. WP sẽ nối "? Ver = N" vào URL của tệp CSS của bạn.
Thả tệp này vào tệp tin.php của chủ đề:
function my_cool_style_versioner( $style ){
return str_replace( '/style.css', '/style-1.css', $style );
}
add_filter( 'stylesheet_uri', 'my_cool_style_versioner' );
'/style-1.css'
) sẽ thay đổi, nhưng đối số thứ nhất ( '/style.css'
) sẽ luôn giữ nguyên.
EAMann là chính xác, bạn không phải sử dụng style.css
tệp cho tất cả CSS của mình.
Để tạo phiên bản biểu định kiểu và các tệp khác trong chủ đề của bạn, bạn có thể thêm tệp này vào tệp tin.php.
function fileVersion($filename)
{
// get the absolute path to the file
$pathToFile = TEMPLATEPATH.'/'.$filename;
//check if the file exists
if (file_exists($pathToFile))
{
// return the time the file was last modified
echo filemtime($pathToFile);
}
else
{
// let them know the file wasn't found
echo 'FileNotFound';
}
}
Và sau đó khi bạn tạo liên kết đến biểu định kiểu của bạn, bạn có thể làm điều này.
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>?v=<?php fileVersion('style.css'); ?>" />
Bằng cách này, bạn không phải cập nhật thủ công số phiên bản, bất cứ khi nào tệp được cập nhật trên máy chủ, phiên bản sẽ tự động thay đổi theo dấu thời gian UNIX đó
Lưu ý rằng bạn không nên sử dụng truy vấn để tạo phiên bản tệp (proxys không lưu trữ chúng).
Cách tốt hơn là phiên bản tên tệp như thế bằng cách thêm một số như
Vì vậy, cách tiếp cận của tôi là như sau:
Nếu bạn đang sử dụng bản tóm tắt HTML5 với apache, bạn có thể tìm phần sau trong tệp .htaccess :
# ------------------------------------------------------------------------------
# | Filename-based cache busting |
# ------------------------------------------------------------------------------
# If you're not using a build process to manage your filename version revving,
# you might want to consider enabling the following directives to route all
# requests such as `/css/style.12345.css` to `/css/style.css`.
# To understand why this is important and a better idea than `*.css?v231`, read:
# http://stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring
<IfModule mod_rewrite.c>
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.+)\.(\d+)\.(js|css|png|jpe?g|gif)$ $1.$3 [L]
</IfModule>
(Bạn thường phải kích hoạt nó trước, bằng cách bỏ qua các dòng)
Tôi muốn tự động sử dụng phiên bản chủ đề của mình cho biểu định kiểu, vì vậy tôi đã đưa ra các cách sau:
Bạn có thể thêm các mục sau vào chức năng chủ đề của mình.php :
function my_theme_styles() {
$my_theme = wp_get_theme();
$version = str_replace('.','',$my_theme->get( 'Version' ));
$stylesheet = get_bloginfo('stylesheet_directory').'/style.'.$version.'.css';
wp_enqueue_style('my-main', $stylesheet, false, null);
}
add_action('wp_print_styles', 'my_theme_styles');
Lưu ý rằng tôi đã cung cấp null
dưới dạng phiên bản thay vì false
vậy, Wordpress không nối thêm phiên bản của nó trong chuỗi truy vấn.
Điều này xuất ra một bản định kiểu như sau cho Phiên bản 1.0.2 của chủ đề của bạn:
<link rel='stylesheet' id='maw-main-css' href='http://www.example.com/wp-content/themes/my-theme/style.102.css' type='text/css' media='all' />
Sau khi tôi thay đổi chủ đề của mình thành Phiên bản 2.0.0 trong style.css, nó sẽ xuất ra như sau:
<link rel='stylesheet' id='maw-main-css' href='http://www.example.com/wp-content/themes/my-theme/style.200.css' type='text/css' media='all' />
Hãy cẩn thận, nếu bạn chỉ xóa các dấu chấm của phiên bản như tôi đã làm, bạn có thể gặp sự cố với phiên bản chủ đề như 1.2.23 và 1.22.3, vì cả hai đều dẫn đến phiên bản 1223 không có dấu chấm.
Một cách tốt hơn sẽ là đưa nó vào tài khoản trong tệp .htaccess. Ví dụ, bạn có thể cho phép gạch dưới giữa các số và có thể thay thế các dấu chấm bằng chúng.
Điều này chưa được kiểm tra, nhưng nên hoạt động:
# ------------------------------------------------------------------------------
# | Filename-based cache busting |
# ------------------------------------------------------------------------------
<IfModule mod_rewrite.c>
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(.+)\.([_\d]+)\.(js|css|png|jpe?g|gif)$ $1.$3 [L]
</IfModule>
function my_theme_styles() {
$my_theme = wp_get_theme();
$version = str_replace('.','_',$my_theme->get( 'Version' ));
$stylesheet = get_bloginfo('stylesheet_directory').'/style.'.$version.'.css';
wp_enqueue_style('my-main', $stylesheet, false, null);
}
add_action('wp_print_styles', 'my_theme_styles');
Chà, đơn giản là bạn có thể sử dụng style.css
làm nơi bạn gọi phiên bản bạn muốn. Chỉ cần đặt
@import url("style-1.css");
Sau đó, khi bạn nâng cấp một phiên bản, chỉ cần chỉnh sửa nó thành:
@import url("style-2.css");
Đối với các phiên bản lưu, bạn đã cân nhắc sử dụng Subversion hay git chưa? Sau đó, bạn có thể có một bản ghi theo dõi đầy đủ của biểu định kiểu của bạn. Có thể tôi không hoàn toàn hiểu lý do đầy đủ cho phiên bản của bạn.
Tôi bắt gặp câu hỏi cũ này và thấy tất cả các câu trả lời dường như đã lỗi thời ngày nay.
Tôi chỉ đơn giản là sử dụng phiên bản chủ đề như được định nghĩa trong phần tiêu đề tệp style.css. Bạn có thể lấy nó vớiwp_get_theme()->get( 'Version' )
function my_enqueue_styles() {
wp_enqueue_style( 'my-theme-style', get_template_directory_uri() . '/style.css', false, wp_get_theme()->get( 'Version' ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_styles' );
Giống như thế này, số phiên bản sẽ tự động được thêm vào url thích ?ver=#.##
và url thay đổi ngay khi phiên bản của chủ đề được tăng lên trong style.css.
trong functions.php
sự thay đổi
wp_enqueue_style( 'twentysixteen-style', get_stylesheet_uri();
đến
wp_enqueue_style( 'twentysixteen-style', get_stylesheet_uri(), array(), $ver );
thay đổi $ver
thành bất kỳ giá trị nào, hoặc time()
cho chế độ phát triển.
Tôi không chắc liệu điều này có thay đổi cho WP3 hay không, vì vậy tôi không hoàn toàn chắc chắn, nhưng có một cách là trực tiếp chỉnh sửa tệp php có liên quan (Tôi không biết liệu nó có thể được thực hiện từ trong trang Bảng điều khiển / Quản trị viên không) :
wp-folder/wp-content/themes/your-theme/
Và mở ra header.php
. Trong tập tin này tìm dòng này:
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
Để thêm 'phiên bản' vào biểu định kiểu được liên kết (giả sử bạn muốn nó giống như stylesheetURL.css?version=2
:) thay đổi nó thành:
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>?version=2" type="text/css" media="screen" />
Tuy nhiên, đây là loại không phù hợp, vì vậy nếu có cách nào tốt hơn tôi muốn tự mình nghe nó =)
Để sử dụng biểu định kiểu khác, styles-1.css
bạn có thể chỉ dòng (ở trên) để:
<link rel="stylesheet" href="absolute/or/root-relative/path/to/styles-1.css" type="text/css" media="screen" />
(Về cơ bản loại bỏ <?php ... ?>
và thay thế nó bằng một đường dẫn thông thường.)