IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

WordPress PHP Discussion :

Thème enfant - chargement des différents CSS


Sujet :

WordPress PHP

  1. #1
    Nouveau Candidat au Club
    Homme Profil pro
    Webmaster
    Inscrit en
    Février 2016
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Webmaster

    Informations forums :
    Inscription : Février 2016
    Messages : 3
    Points : 1
    Points
    1
    Par défaut Thème enfant - chargement des différents CSS
    Bonjour,

    Je suis débutant en wordpress et j'aurai besoin de vos conseils avisés. J'ai créé un thème enfant «montheme-child*» et je n'arrive pas à appeler les différents CSS du thème principal. Il y a plusieurs CSS au sein du thème*:

    - 5 fichiers CSS : style.css, rtl.css, editor-style.css et editor-style-rtl.css à la racine du thème que j'ai copié dans le thème enfant (avec pour contenu /* Template*: nomdemonthème */
    - un sous-dossier «*css*» dans un dossier «*assets*» avec les fichiers bootstrap.css, bootstrap.min.css, demo.css, demo.min.css, font-awesome.css. Il est à noter que le support indique que je dois mettre ce dossier directement dans le thème enfant, chose que j'ai faite.

    J'ai testé plusieurs choses dans le fichier functions.php pour tenter de charger les différents css mais sans parvenir à mes fins. Ma dernière tentative de fichier functions.php est la suivante*:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    <?php
    function theme_enqueue_styles() {
     
        $parent_style = 'parent-style';
     
        wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
        wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/rtl.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/editor-style.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/editor-style-rtl.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/assets/css/bootstrap.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/assets/css/bootstrap.min.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/assets/css/demo.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/assets/css/demo.min.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/assets/css/font-awesome.min.css', array( $parent_style ));
    	wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/assets/css/owl-carousel.css', array( $parent_style ));
     
    }
    add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
    ?>

    Une âme charitable pourrait elle me sortir de ce pétrin*?

  2. #2
    Membre expérimenté

    Homme Profil pro
    Webmaster
    Inscrit en
    Mai 2011
    Messages
    1 049
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Webmaster
    Secteur : Enseignement

    Informations forums :
    Inscription : Mai 2011
    Messages : 1 049
    Points : 1 689
    Points
    1 689
    Billets dans le blog
    2
    Par défaut
    J'utilise la façon la plus simple qui est @import url() où l'url contient la ou les feuille(s) de style du thème.
    Actuellement, il est recommandé de faire la modification dans le fichier functions, il faut aller voir les explications dans le Codex de wordpress

  3. #3
    Expert éminent sénior
    Avatar de mathieu
    Profil pro
    Inscrit en
    Juin 2003
    Messages
    10 235
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2003
    Messages : 10 235
    Points : 15 532
    Points
    15 532
    Par défaut
    comme le disait miss_socrate il y a des explications sur les thèmes enfants dans le codex :
    http://codex.wordpress.org/fr:Thèmes_Enfant

    Si ces explications ne vous aident pas, montrez-nous comment sont déclarés les feuilles de style du thème parent.

  4. #4
    Membre émérite

    Profil pro
    Inscrit en
    Mai 2008
    Messages
    1 576
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2008
    Messages : 1 576
    Points : 2 440
    Points
    2 440
    Par défaut
    Depuis functions.php d'un thème enfant:
    - pour indiquer le répertoire du thème enfant: get_stylesheet_directory_uri()
    - pour indiquer le répertoire du thème parent: get_template_directory_uri()

  5. #5
    Nouveau Candidat au Club
    Homme Profil pro
    Webmaster
    Inscrit en
    Février 2016
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Webmaster

    Informations forums :
    Inscription : Février 2016
    Messages : 3
    Points : 1
    Points
    1
    Par défaut
    Bonjour,

    J'ai déjà lu la page Codex sur les thèmes enfant mais pas mal de choses restent obscures pour moi... Dans le fichier functions.php du thème parent, les CSS sont appelés de cette manière :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    	// Load CSS
    	wp_enqueue_style( 'font-awesome', rf_get_template_directory_uri() . '/assets/css/font-awesome.min.css', '', '4.3.0' ); // Source: http://cdnjs.com/libraries/font-awesome
    	wp_enqueue_style( 'owl-carousel', rf_get_template_directory_uri() . '/assets/css/owl-carousel.css', '2.0.0-beta.2.4' ); // carousel base CSS
    	wp_enqueue_style( 'theme-bootstrap', rf_get_template_directory_uri() . '/assets/css/bootstrap.min.css' ); // can be changed to 'bootstrap.css' for testing.
    	wp_enqueue_style( 'theme-style', get_stylesheet_uri() );
    Je ne parviens pas à faire correctement les appels de ces CSS depuis le fichier functions.php du thème enfant. Par ailleurs, je ne sais pas comment les autres CSS à la racine du thème (rtl.css, editor-style.css et editor-style-rtl.css) sont appelés.

    Quelqu'un peut il m'aider ?

  6. #6
    Expert éminent sénior
    Avatar de mathieu
    Profil pro
    Inscrit en
    Juin 2003
    Messages
    10 235
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2003
    Messages : 10 235
    Points : 15 532
    Points
    15 532
    Par défaut
    et quand sont appelées ces lignes ? dans l'action "wp_enqueue_scripts" ?

  7. #7
    Nouveau Candidat au Club
    Homme Profil pro
    Webmaster
    Inscrit en
    Février 2016
    Messages
    3
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Webmaster

    Informations forums :
    Inscription : Février 2016
    Messages : 3
    Points : 1
    Points
    1
    Par défaut
    Elles sont appelées juste avant. Le plus simple est que je mette le contenu du fichier functions.php :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    <?php if ( __FILE__ == $_SERVER['SCRIPT_FILENAME'] ) { die(); }
     
     
    // Execute hooks before framework loads
    do_action( 'functions_before' );
     
     
    #-----------------------------------------------------------------
    # Load framework
    #-----------------------------------------------------------------
    include_once get_template_directory() . '/framework/load.php';
     
     
     
    // Execute hooks after framework loads
    do_action( 'functions_after' ); ?><?php
    /**
     * Theme registration and WP connections
     *
     */
     
    /**
     * Toggle template directory and URI for Runway child/standalone themes
     *
     * These functions can be used to replace the defaults in WordPress so the correct path is
     * generated for both child themes and standalone. It will ensure the paths being referenced 
     * to your themes folder are always correct. 
     */
    if (!function_exists('rf_get_template_directory_uri')) :
    	function rf_get_template_directory_uri() {
    		return (IS_CHILD) ? get_stylesheet_directory_uri() : get_template_directory_uri();
    	}
    endif;
    if (!function_exists('rf_get_template_directory')) :
    	function rf_get_template_directory() {
    		return (IS_CHILD) ? get_stylesheet_directory() : get_template_directory();
    	}
    endif;
     
     
    /**
     * Set the content width based on the theme's design and stylesheet.
     */
    if ( ! isset( $content_width ) )
    	$content_width = 1240; /* pixels */
     
     
    if ( ! function_exists( 'rf_theme_setup' ) ) :
    /**
     * Set up theme defaults and register support for various WordPress features.
     *
     * Note that this function is hooked into the after_setup_theme hook, which runs
     * before the init hook. The init hook is too late for some features, such as indicating
     * support post thumbnails.
     */
    function rf_theme_setup() {
     
    	if ( function_exists( 'add_theme_support' ) ) {
     
    		// WP Stuff
    		add_editor_style(); // Admin editor styles
    		add_theme_support( 'automatic-feed-links' ); // RSS feeds	
    		// add_theme_support( 'post-formats', array( 'image', 'video' ) ); // Post formats. Unused: quote, link
    		register_nav_menu( 'primary', __( 'Primary Menu', 'framework' ) ); // Main menu
     
    		// Post thumbnails
    		add_theme_support( 'post-thumbnails' );
    		set_post_thumbnail_size( 1200, 9999 );
     
    		// Additional image sizes
    		add_image_size( 'blog', 600, 800, true ); // Blog: vertical 3:4 ratio, hard crop 
    		add_image_size( 'blog-landscape', 800, 600, true ); // Blog: horizontal 4:3 ratio, hard crop 
    		add_image_size( 'header', 1920, 1080 ); // Header background: 16:9 ratio
    		add_image_size( 'place', 960, 540, true ); // Places in destinations: 16:9 ratio, hard crop
     
    		// WooCommerce
    		add_theme_support( 'woocommerce' );
    		if(function_exists('is_woocommerce')) {
    			remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10);
    			remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10);
    			add_action('woocommerce_before_main_content', 'theme_woocommerce_wrapper_start', 10);
    			add_action('woocommerce_after_main_content', 'theme_woocommerce_wrapper_end', 10);
    			add_action('woocommerce_add_to_cart_message', 'theme_woocommerce_add_to_cart_message', 10);
    		}
    	}
     
    	// Translation
    	load_theme_textdomain( 'framework', rf_get_template_directory() . '/languages' );
     
    	// Navigation menus
    	register_nav_menus( array(
    		'primary'  => __( 'Main Menu', 'framework' ),
    		'top-left'  => __( 'Top - Left', 'framework' ),
    	) );
     
    }
    endif; // rf_theme_setup
    add_action( 'after_setup_theme', 'rf_theme_setup' );
     
    if(function_exists('is_woocommerce')):
    	function theme_woocommerce_wrapper_start() {
    	}		
    	function theme_woocommerce_wrapper_end() {
    	}
    endif;
     
    /**
     * Enqueue scripts and styles
     */
    function rf_enqueue_scripts() {
    	global $wp_scripts;
     
    	// Load CSS
    	wp_enqueue_style( 'font-awesome', rf_get_template_directory_uri() . '/assets/css/font-awesome.min.css', '', '4.3.0' ); // Source: http://cdnjs.com/libraries/font-awesome
    	wp_enqueue_style( 'owl-carousel', rf_get_template_directory_uri() . '/assets/css/owl-carousel.css', '2.0.0-beta.2.4' ); // carousel base CSS
    	wp_enqueue_style( 'theme-bootstrap', rf_get_template_directory_uri() . '/assets/css/bootstrap.min.css' ); // can be changed to 'bootstrap.css' for testing.
    	wp_enqueue_style( 'theme-style', get_stylesheet_uri() );
     
    	// Load scripts
    	wp_enqueue_script( 'theme-js', rf_get_template_directory_uri().'/assets/js/theme-scripts.js', array('jquery'), '1.0', true );
    	wp_enqueue_script( 'theme-bootstrapjs', rf_get_template_directory_uri().'/assets/js/bootstrap.min.js', array('jquery'), '1.0', true );
    	wp_enqueue_script( 'owl-carousel', rf_get_template_directory_uri().'/assets/js/owl.carousel.min.js', array('jquery'), '2.0.0-beta.2.4', true );
    	wp_enqueue_script( 'fitvids', '//cdnjs.cloudflare.com/ajax/libs/fitvids/1.1.0/jquery.fitvids.min.js', array('jquery'), '1.1.0', true );
     
    	// IE only JS
    	wp_enqueue_script( 'theme-html5shiv', '//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv-printshiv.min.js', '3.7.2' ); // Source: https://cdnjs.com/libraries/html5shiv
    	$wp_scripts->add_data( 'theme-html5shiv', 'conditional', 'lt IE 9' );
    	wp_enqueue_script( 'theme-respondjs', '//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js', '1.4.2' ); // Source: https://cdnjs.com/libraries/respond.js
    	$wp_scripts->add_data( 'theme-respondjs', 'conditional', 'lt IE 9' );
     
        // IE10 viewport hack for Surface/desktop Windows 8 bug -->
    	wp_enqueue_script( 'theme-ie10-viewport-bug', rf_get_template_directory_uri().'/assets/js/ie10-viewport-bug-workaround.js', '1.0.0', true );
     
    	// Load comment reply ajax
    	if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
    		wp_enqueue_script( 'comment-reply' );
    	}
     
    	// Load keyboard navigation for image template
    	if ( is_singular() && wp_attachment_is_image() ) {
    		wp_enqueue_script( 'theme-keyboard-image-nav', rf_get_template_directory_uri() . '/assets/js/keyboard-image-nav.js', array( 'jquery' ), '1.0.0' );
    	}
     
    	// Google Fonts
    	$gFont = array();
    	if (get_options_data('options-page', 'font-body') == 'google') {
    		$gFont[] = get_options_data('options-page', 'font-body-google');
    	}
    	if (get_options_data('options-page', 'font-heading') == 'google') {
    		$gFont[] = get_options_data('options-page', 'font-heading-google');
    	}
    	$gFontQuery = rf_google_fonts_query( $gFont );
     
    	// Load Google Fonts
    	if (!empty($gFontQuery)) {
    		wp_enqueue_style( 'google-font', $gFontQuery, array(), null );
    	}
     
    }
    add_action( 'wp_enqueue_scripts', 'rf_enqueue_scripts' );
     
    // Override default google maps language
    if(!function_exists('set_google_maps_lang')) {
    	function set_google_maps_lang( $locale ) {
    		//$locale = 'de_DE';
    	    return $locale;
    	}
    }
    add_filter('goexplore_google_maps_lang', 'set_google_maps_lang' );

  8. #8
    Expert éminent sénior
    Avatar de mathieu
    Profil pro
    Inscrit en
    Juin 2003
    Messages
    10 235
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2003
    Messages : 10 235
    Points : 15 532
    Points
    15 532
    Par défaut
    dans ce code il y a l'utilisation d'une constante IS_CHILD qui n'est pas définie dans ce fichier donc il nous faudrait plus de code pour savoir la valeur de cette constante

    pouvez-vous nous montrez le site ou nous fournir le thème ? cela serait plus rapide pour vous aider

Discussions similaires

  1. Problème du chargement des css et javascript
    Par Eric_beauvais dans le forum Bibliothèques et frameworks
    Réponses: 1
    Dernier message: 05/01/2014, 00h58
  2. CSS Dynamique : problème de chargement des fichiers
    Par Emyleen dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 07/10/2011, 14h34
  3. Problème avec chargement des animations
    Par PomDesign dans le forum Flash
    Réponses: 2
    Dernier message: 02/04/2007, 16h52
  4. [AJAX] Chargement dynamique de CSS
    Par drannh dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 26/12/2006, 12h09
  5. [Security] Probléme de chargement des bean ??
    Par linniesurf dans le forum Spring
    Réponses: 1
    Dernier message: 03/07/2006, 17h15

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo