web-dev-qa-db-fra.com

comment appeler des fichiers dans le thème de l'enfant?

J'ai créé un thème enfant "mon thème" . Dans style.css, je n'ai rien écrit, seulement les détails obligatoires que j'ai écrits là-bas.

/*
Theme Name:     my-theme
Theme URI:      http://example.com/
Description:    Child theme for the Twenty Twelve theme 
Author:         Bhuvnesh
Author URI:     http://example.com/about/
Template:       my-theme
Version:        0.1.0
*/

Toutes les règles de style que j'écris dans "mon-thème/css/style.css" fichier. Maintenant dans index.php J'appelle<?php get_header(); ?>ceci s'appelle header.php maintenant dans header.php fichier J'appelle ce fichier css comme

<link href="css/style.css" rel="stylesheet" type="text/css" />

mais ce n'est pas en train de charger mes css. comme ceci, j'appelle des fichiers .js qui se trouvent sous "my-theme/js /" directory as

<script type="text/javascript" src="js/jquery-1.7.2.min.js"> </script>

cela ne charge pas non plus.

Je sais que je fais des erreurs pour appeler des fichiers ou que je peux être dans functions.php.

Je viens de copier le fichier complet functions.php de vingt-douze . Y a-t-il une erreur que je fais?

Dites-moi s'il vous plaît quoi écrire dans functions.php fichier et comment appeler des fichiers tels que des fichiers js sous le répertoire js. Des fichiers .php dans le répertoire includes, les images dans le répertoire Images.

J'ai cherché comment créer un thème enfant et c'est fait, mais impossible d'appeler des fichiers.

Aidez-moi s'il vous plaît! Je serai très reconnaissant à vous !!!!

child-theme
4
Bhuvnesh Gupta

On ne jette pas simplement les balises <link> (CSS) ou <script> dans le <head> d'un thème WordPress.

La bonne façon de le faire: inscrivez-vous, faites une mise en file d'attente ...

WordPress dispose de la "API de dépendance" pour cette tâche. Il consiste essentiellement en ces fonctions publiques:

Ensuite, vous alignez les fonctions sur désenregistrez des scripts ou des styles , récupérez des données de PHP à JS -, par exemple, pour les utiliser à des fins de localisation ou AJAX - et vérifie/Conditionals pour voir si un style ou un script a été enregistré/mis en file d'attente.

Comment les utiliser

Tout d’abord, vous devez vous assurer que votre fichier header.php a le hook approprié:

wp_head();

Ajoutez ensuite une fonction à votre fichier de thèmes functions.php, comme expliqué sur WP Make . Comme vous pouvez le constater, les scripts et les fichiers utilisent le hook wp_enqueue_scripts-.

add_action( 'wp_enqueue_scripts', 'wpse82474_load_styles' );
add_action( 'wp_enqueue_scripts', 'wpse82474_load_scripts' );
wpse82474_load_styles()
{
    wp_enqueue_style( /* etc. */ );
}
wpse82474_load_scripts()
{
    wp_enqueue_script( /* etc. */ );
}

Les arguments

Les principaux arguments sont les suivants

 wp_enqueue_style( $handle, $src, $deps, $ver, $media );

Dans le monde réel (pour parler: dans votre thème), vous l'utiliserez comme suit. L'exemple montre un script dont jQuery est chargé en tant que dépendance (en d'autres termes: chargé avant votre fichier mis en file d'attente).

wp_enqueue_script(
     'my-theme-script'
    ,get_template_directory_uri().'/js/custom_script.js'
    ,array( 'jquery' )
);

Obtenir le bon chemin

Depuis un thème enfant, vous voudrez toujours utiliser get_stylesheet_directory_uri() et depuis un thème parent ou "normal", vous utiliserez get_template_directory_uri().

Le chargement depuis un sous-dossier de votre thème enfant utiliserait un chemin comme celui-ci:

$stylesheet_path = get_stylesheet_directory_uri().'/css/style.css';

Chargement de WP scripts et de styles fournis avec le noyau

Si vous souhaitez charger des fichiers déjà livrés avec core, vous pouvez simplement les mettre en file d'attente sans arguments supplémentaires.

wp_enqueue_script( 'jquery' ); // Load jQuery

La même chose vaut pour tous les autres scripts (ou styles) fournis avec core, comme vous pouvez le lire dans Codex .

Si vous voulez savoir si un script est déjà enregistré, vous n'avez pas besoin de chercher dans le noyau ni dans Codex. Utilisez simplement wp_script_is() (ou son équivalent pour les styles). Par défaut, cela vérifie la liste enqueue, mais vous pouvez également utiliser registered ou done comme arguments.

wp_script_is( 'jquery', 'registered' ) AND wp_enqueue_script( 'jquery' );
9
kaiser

Tous vos fichiers js et css inclus sont inclus à l’aide de chemins relatifs. C'est mauvais.

Vous constaterez que l'utilisation d'un thème pour enfants n'est pas pertinente, car il est horriblement brisé avec et sans un thème pour enfants.

Alors, au lieu de cela, apprenez à mettre correctement en file d'attente les styles et les scripts en utilisant wp_enqueue_style dans functions.php

http://codex.wordpress.org/Function_Reference/wp_enqueue_style

function theme_styles()  
{ 
  // Register the style like this for a theme:  
  // (First the unique name for the style (custom-style) then the src, 
  // then dependencies and ver no. and media type)
  wp_register_style( 'custom-style',
    get_template_directory_uri() . '/css/style.css', 
    array(), 
    '20120208', 
    'all' );

  // enqueing:
  wp_enqueue_style( 'custom-style' );
}
add_action('wp_enqueue_scripts', 'theme_styles');

et wp_enqueue_script:

http://codex.wordpress.org/Function_Reference/wp_enqueue_script

function my_scripts_method() {
    wp_enqueue_script( 'jquery' );
}    

add_action('wp_enqueue_scripts', 'my_scripts_method');

Notes finales:

  • Ne jamais inclure des scripts et des styles directement dans header.php
  • Toujours utiliser wp_enqueue_style et wp_enqueue_script
  • Si vous n'utilisez pas ces fonctions, les plugins de mise en cache ne peuvent pas les modifier et vous manquez des choses
  • Ne joignez jamais JQuery à votre thème, utilisez toujours la copie fournie via WordPress, ne vous inquiétez jamais de grouper une version aussi obsolète que v1.7.x
4
Tom J Nowell

Dans le fichier style.css de votre thème enfant, vous avez une ligne Template: my-theme. Cela devrait être le nom du modèle que vous voulez avoir en tant que parent.

Exemple pour un thème enfant du thème par défaut Twenty Twelve:

/*
Theme Name:     Twenty Twelve Child
Theme URI:      http://example.com/
Description:    Child theme for the Twenty Twelve theme 
Author:         Your name here
Author URI:     http://example.com/about/
Template:       twentytwelve
Version:        0.1.0
*/

Une explication rapide de chaque ligne:

  • Nom du thème. (obligatoire) Nom du thème de l'enfant.
  • Thème URI. (facultatif) page Web sur le thème de l'enfant.
  • La description. (facultatif) Qu'est-ce que ce thème? E.g .: Mon premier thème enfant. Hourra!
  • Auteur. (facultatif) Nom de l'auteur.
  • Auteur URI. (facultatif) Page Web de l'auteur.
  • Modèle. (obligatoire) nom du répertoire du thème parent, sensible à la casse.
    • REMARQUE. Vous devez changer de thème et revenir au thème enfant lorsque vous modifiez cette ligne.
  • Version. (optionnel) version thème enfant. Ex .: 0,1, 1,0, etc.

Vous trouverez plus d’informations sur les thèmes relatifs aux enfants ici dans les pages Codex.

De cette façon, vous ne devriez plus avoir de problèmes avec les fichiers de thèmes enfants qui ne se chargent pas.

0
Mike Madern