it-swarm-eu.dev

Jak mohu provést green hlavního souboru CSS?

Jak mohu instruovat wordpress, aby používal jiný název souboru než 'styles.css' pro můj hlavní styl - například styly-1.css? Chtěl bych to udělat pro účely verzování a ukládání do mezipaměti.

7
Bobby Jack

Style.css je vyžadováno pro vaše téma WordPress. To je místo, kde WordPress dostane název motivu a meta informace pro menu Vzhled >> Témata z. To znamená, že ve skutečnosti nemusíte ve svém motivu vůbec používat style.css. Vím o několika snadno dostupných tématech, která ji nepoužívají, a používám ji pouze v několika mých vlastních návrzích.

V header.php umístěte následující řádek namísto pravidelného odkazu šablony stylů:

<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory'); ?>/style-1.css" />

Tím se načte váš alternativní styl šablony jako styly stránek a zcela ignoruje normální style.css.

3
EAMann

To může být nevhodné, dejte mi prosím vědět, jestli mi něco chybí.

Čtvrtým argumentem wp_enqueue_style() je číslo verze šablony stylů. V souboru 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');

Vyžaduje, aby vaše header.php udělal wp_head(), což samozřejmě jste dělali stejně. ;)

To vám umožní tisknout záhlaví s dlouhým uplynutím platnosti se souborem CSS a přinutit klienty ke stažení nového souboru aktualizací čísla verze. WP připojí k adrese URL vašeho souboru CSS znak „? Ver = N“.

13
Annika Backstrom

Drop to v souboru theme.php:

function my_cool_style_versioner( $style ){
  return str_replace( '/style.css', '/style-1.css', $style );
}

add_filter( 'stylesheet_uri', 'my_cool_style_versioner' );
3
John P Bloch

Všimněte si, že by neměly používat querystrings pro verzování souborů (proxys neukládají do mezipaměti).

Lepším způsobem by bylo, kdyby se jména souborů podobala přidáním čísla

  • style. 123 . css
  • style. 124

Můj přístup je tedy následující:

Apache htaccess přesměruje

Pokud používáte HTML5 kotevní desku s Apache můžete najít následující sekci v souboru.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>

(Obvykle je musíte nejprve povolit, odškrtnutím řádků)

Téma functions.php

Chtěl jsem automaticky použít verzi mého motivu pro šablonu stylů, takže jsem přišel s následujícími:

Můžete přidat následující do svých motivů 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');

Všimněte si, že jsem uvedl null jako verzi namísto false, takže Wordpress nepřidává jeho verzi do dotazu.

Výsledek

Výsledkem je šablona stylů, jako je následující pro verzi 1.0.2 motivu:

<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' />

Po změně motivu na verzi 2.0.0 v mém style.css by to vydalo následující:

<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' />

Další poznámky

Dbejte na to, že pokud jste právě odizolovali tečky verze, jako jsem to udělal, můžete mít problémy s verzí motivu, jako je 1.2.23 a 1.22.3, protože oba mají za následek bezdotykovou verzi 1223.

Lepší způsob by bylo vzít v úvahu v souboru .htaccess. Můžete například povolit podtržítka mezi čísly a nahradit je tečkami.

To je nevyzkoušené, ale mělo by fungovat:

.htaccess

# ------------------------------------------------------------------------------
# | Filename-based cache busting                                               |
# ------------------------------------------------------------------------------
<IfModule mod_rewrite.c>
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^(.+)\.([_\d]+)\.(js|css|png|jpe?g|gif)$ $1.$3 [L]
</IfModule>

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

EAMann je správný, nemusíte používat soubor style.css pro všechny vaše CSS.

Pro verzování šablony stylů a dalších souborů ve vašem motivu můžete toto přidat do souboru functions.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';
    }
}

A pak, když uděláte odkaz na svůj styl, můžete to udělat.

<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>?v=<?php fileVersion('style.css'); ?>" />

Tímto způsobem nemusíte ručně aktualizovat číslo verze, kdykoliv je soubor aktualizován na serveru, verze se automaticky změní na tuto časovou značku systému UNIX

3
Paul Sheldrake

No, můžete jednoduše použít style.css jako místo, kde voláte verzi, kterou chcete. Jednoduše řečeno

@import url("style-1.css");

Když pak upgradujete verzi, upravte ji tak, aby byla:

@import url("style-2.css");

Pokud jde o ukládání verzí, uvažovali jste pomocí Subversion , nebo git ? Pak můžete mít kompletní záznam o vašem stylu. Je možné, že plně nerozumím úplným důvodům vaší verze.

2
artlung

Přišel jsem k této staré otázce a zjistil, že všechny odpovědi jsou dnes zastaralé.

Prostě bych použil verzi motivu definovanou v části hlavičky souboru style.css. Můžete jej získat pomocí wp_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' );

Podobně bude číslo verze automaticky připojeno k url jako ?ver=#.## a adresa URL se změní, jakmile se ve stylu style.css zvýší verze tématu.

2
JHoffmann

Změna functions.php

wp_enqueue_style( 'twentysixteen-style', get_stylesheet_uri();

na

wp_enqueue_style( 'twentysixteen-style', get_stylesheet_uri(), array(), $ver );

změnit $ver na libovolnou hodnotu, nebo time() pro režim vývoje.

1
Rashed Hasan

Nejsem si jistý, jestli se to změnilo pro WP3, takže nejsem zcela jistý, ale jedním způsobem je přímo upravit příslušný php soubor (nevím, jestli to lze udělat z Dashboard/Admin stránek) :

wp-folder/wp-content/themes/your-theme/

A otevřete header.php. V tomto souboru najděte tento řádek:

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />

Chcete-li přidat 'verzi' do propojené šablony stylů (za předpokladu, že chcete, aby to bylo něco jako: stylesheetURL.css?version=2), změňte ji na:

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>?version=2" type="text/css" media="screen" />

To je ale druh nedůsledného, ​​takže pokud je lepší způsob, rád bych to slyšel sám.


Chcete-li použít jinou šablonu stylů styles-1.css, můžete buď pouze (nad) řádek:

<link rel="stylesheet" href="absolute/or/root-relative/path/to/styles-1.css" type="text/css" media="screen" />

(V podstatě odstranění <?php ... ?> a jeho nahrazení běžnou cestou.)

0
David Thomas