WordPress'e ana stil sayfam için 'styles.css' dışında bir dosya adı kullanmasını nasıl öğretebilirim - örneğin, styles-1.css? Bunu versiyonlama ve önbellekleme amaçları için yapmak istiyorum.
WordPress temanız için Style.css
gereklidir. WordPress'in Görünüm >> Temalar menüsünün tema adını ve meta bilgilerini aldığı yer burasıdır. Bununla birlikte, temanızda hiç style.css
kullanmak zorunda değilsiniz. Kullanılmayan hazır temaları biliyorum ve yalnızca özel tasarımlarımın birkaçında kullanıyorum.
header.php
'da aşağıdaki etiketi normal stil sayfası bağlantısının yerine koymanız yeterlidir:
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory'); ?>/style-1.css" />
Bu, alternatif stil sayfanızı sayfanın stil sayfası olarak yükler ve normal style.css
dosyasını tamamen yok sayar.
Bu uygunsuz olabilir, lütfen bir şeyleri kaçırırsam bana bildirin.
wp_enqueue_style()
işlevinin dördüncü argümanı stil sayfasının sürüm numarasıdır. Temanın functions.php
içinde:
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');
header.php
'nuzun wp_head()
işlevini yapmasını gerektirir, bunun için elbette zaten yapıyorsunuz. ;)
Bu, CSS dosyanızla uzun süre sona eren başlıkları itmenize ve sürüm numarasını güncelleyerek istemcileri yeni bir dosya indirmeye zorlar. WP, CSS dosyanızın URL'sine "? Ver = N" ekleyecektir.
Bunu, kendi işlevler.php dosyasına bırakın:
function my_cool_style_versioner( $style ){
return str_replace( '/style.css', '/style-1.css', $style );
}
add_filter( 'stylesheet_uri', 'my_cool_style_versioner' );
Unutmayın ki dosya sürümlemesi için querystrings kullanmamalısınız (proxy'ler onları önbelleğe almaz).
Daha iyi bir yol, benzer bir sayı ekleyerek dosya adlarının versiyonunun değiştirilmesi olacaktır.
Yani benim yaklaşımım şudur:
Apache ile HTML5 boilerplate kullanıyorsanız aşağıdaki bölümü.HTACCESS DOSYASI'da bulabilirsiniz:
# ------------------------------------------------------------------------------
# | 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>
(Genellikle satırları yorumlayarak ilk önce etkinleştirmeniz gerekir)
Stil sayfam için temamın sürümünü otomatik olarak kullanmak istedim;
Aşağıdakileri temalarınıza ekleyebilirsiniz functions.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');
Unutmayın, null
yerine false
sürümünü sunduğumu, bu nedenle Wordpress'in sürümünü querystring'e eklememesi gerektiğini unutmayın.
Bu, temanızın Sürüm 1.0.2 için aşağıdaki gibi bir stil sayfası çıkarır:
<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' />
Benim temamı style.css'de Sürüm 2.0.0 olarak değiştirdikten sonra şunu yazdı:
<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' />
Dikkat edin, benim yaptığım gibi sadece sürümün noktalarını soyarsanız, her ikisi de 1223'lük noktalı bir sürümle sonuçlanan 1.2.23 ve 1.22.3 gibi tema sürümlerinde sorun yaşayabilirsiniz.
Bunun daha iyi bir yolu .htaccess dosyasında bunu hesaba katmak olacaktır. Örneğin, sayılar arasında alt çizgi bulunmasına izin verebilir ve noktaları onlarla değiştirebilirsiniz.
Bu denenmemiş, ancak çalışması gerekir:
# ------------------------------------------------------------------------------
# | 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');
EAMann doğrudur, tüm CSS'niz için style.css
dosyasını kullanmanız gerekmez.
Stil sayfasını ve temanızdaki diğer dosyaları sürümlendirmek için bunu İşlev.php dosyanıza ekleyebilirsiniz.
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';
}
}
Ve sonra stil sayfanıza bağlantı yaptığınızda bunu yapabilirsiniz.
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>?v=<?php fileVersion('style.css'); ?>" />
Bu şekilde sürüm numarasını el ile güncellemeniz gerekmez; dosya sunucuda her güncellendiğinde, sürüm otomatik olarak bu UNIX zaman damgasına dönecektir.
Eh, sadece istediğiniz kodu istediğiniz yeri olarak style.css
kullanabilirsiniz. Basit ifadeyle
@import url("style-1.css");
Sonra bir sürümü yükselttiğinizde, sadece aşağıdaki gibi düzenleyin:
@import url("style-2.css");
Sürümleri kaydetme gelince, bir Subversion , veya git kullanmayı düşündünüz mü? Sonra, stil sayfanızın tam bir kaydını tutabilirsiniz. Muhtemelen sürümün nedenlerini tam olarak anlamadım.
Bu eski soruya rastladım ve bugünlerde modası geçmiş görünen tüm cevapları buldum.
Sadece style.css dosyasının üstbilgisi bölümünde tanımlandığı şekilde tema sürümünü kullanırdım. wp_get_theme()->get( 'Version' )
ile alabilirsiniz.
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' );
Bu şekilde, sürüm numarası ?ver=#.##
gibi url’ye otomatik olarak eklenecek ve url temanın sürümü style.css’de artırıldığı anda değişir.
functions.php
değişikliğinde
wp_enqueue_style( 'twentysixteen-style', get_stylesheet_uri();
için
wp_enqueue_style( 'twentysixteen-style', get_stylesheet_uri(), array(), $ver );
$ver
öğesini herhangi bir değere değiştirin veya geliştirme modu için time()
.
Bunun WP3 için değişip değişmediğinden emin değilim, bu yüzden tamamen emin değilim, ancak bir yol ilgili php dosyasını doğrudan düzenlemektir (Pano/Yönetici sayfalarından yapılıp yapılamayacağını bilmiyorum) :
wp-folder/wp-content/themes/your-theme/
Ve header.php
dosyasını açın. Bu dosyada bu satırı bulun:
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
Bağlantılı stil sayfasına bir 'sürüm' eklemek için (bunun gibi bir şey olmasını varsayalım: stylesheetURL.css?version=2
) şu şekilde değiştirin:
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>?version=2" type="text/css" media="screen" />
Bu biraz tuhaf, yine de, eğer daha iyi bir yol varsa, onu duymayı çok isterdim =)
Farklı bir stil sayfası styles-1.css
kullanmak için, sadece (yukarıdaki) satırı aşağıdakilere yapabilirsiniz:
<link rel="stylesheet" href="absolute/or/root-relative/path/to/styles-1.css" type="text/css" media="screen" />
(Temel olarak <?php ... ?>
dosyasını kaldırın ve normal bir yolla değiştirin.)