web-dev-qa-db-fra.com

feuille de style front-page.php

J'ai googlé et googlé mais je n'arrive pas à trouver quoi que ce soit qui soit compréhensible pour moi ...

Je souhaite une page d'accueil statique pour mon site Web. À cette fin, j'ai créé un fichier front-page.php dans le dossier du thème actif sur mon serveur FTP. Je remarque que les modifications apportées dans style.css ne sont pas reflétées dans front-page.php. Quoi qu'il en soit, je souhaite une feuille de style distincte pour ma page d'accueil. Alors, comment lier front-page.php à un fichier .css personnalisé, disons front-style.css, afin de pouvoir simplement modifier le fichier .css afin de styler le fichier .php? Ou n'est-ce pas la bonne approche?

3
Rookierookie

Comment charger une feuille de style personnalisée pour votre page d'accueil

  1. Configurez front-page.php (ce que vous avez déjà fait).
  2. Créez une feuille de style pour votre page d'accueil (vous pouvez copier style.css, mais plus probablement, vous voudrez simplement remplacer certaines choses). Appelons-le front-page-style.css.
  3. Affichez le code source HTML d’une de vos pages et recherchez la variable id du fichier style.css (probablement quelque chose du type your-theme-css). Le rognage de la partie -css nous indiquera ce que nous devons utiliser comme dépendance dans code.
  4. Ajoutez les éléments suivants au fichier functions.php de votre thème:

    add_action( 'wp_enqueue_scripts', 'wpse102732_front_page_styles', 20 );
    function wpse102732_front_page_styles() {
        if( is_front_page() ) {
            // Any dependencies go here:
            // if the style.css id in step 3 was 'your-theme-css',
            // then use 'your-theme'
            $deps = array( 'your-theme' );
            $handle = 'your-theme-front-page';
            $url = get_stylesheet_directory_uri() . '/front-page-style.css';
            wp_enqueue_style( $handle, $url, $deps );
        }
    }
    

Vous devriez maintenant pouvoir modifier les styles dans front-page-style.css pour la page d'accueil uniquement.

Références

3
Pat J