[Résolu] Problème pour charger des fichiers javascript !

Statut : non résolu

Ce sujet contient 57 réponses, 3 participants et a été mis à jour pour la dernière fois par foubouh, le il y a 9 années et 7 mois.

15 sujets de 1 à 15 (sur un total de 58)

1 2 3 4 →

Auteur

Messages
16 juin 2013 à 20 h 07 min #525420
foubouh
Participant

Initié WordPress
47 contributions
Bonjour,

WordPress
-3.4.2 :
– Version de PHP/MySQL :
-Thème personnel :
-Hébergement en local avec Wamp :
Impossible de trouver la bonne configuration de functions.php pour charger deux fichiers javascript :

Bonjour,

après moult recherches sur le forum et google, je viens demander de l’aide pour résoudre mon problème !
Je souhaite installer cette visionneuse sur mon thème perso.
>> Lien de la démo http://tympanus.net/Tutorials/FullscreenSlitSlider/index2.html
>> Lien de l’article avec les fichiers sources. http://tympanus.net/codrops/2012/06/05/fullscreen-slit-slider-with-jquery-and-css3/

J’ai bien compris qu’il fallait charger les fichiers javascript via functions.php. J’ai tenté les nombreuses et différentes solutions proposées par les internautes. En vain, rien ne charge.

Je me demande si ce n’est pas une erreur d’URL au niveau du fichier javascript.

Mon dossier JS comportant les différents fichiers se trouve directement dans le dossier du thème.

Voici un exemple pour un fichier javascript dans functions.php
```
function load_my_files() { //Créer une fonction pour appeler les fichiers javascript et css
     
    if (!is_admin()) { //Charges les fichiers SAUF sur l’administration du site
   //wp_enqueue_script(‘jquery’); En general jquery a déjà été chargé plus haut dans le code
//donc pas la peine de le charger 2 fois.
   wp_enqueue_script(‘jquery.slitslider’, ‘/wp-content/themes/culture/js/jquery.slitslider.js’); //Load js files
   
   wp_enqueue_style(‘jquery.slitslider’, ‘/wp-content/themes/culture/js/jquery.slitslider.js’); //Load css files
   
} 
}
add_action(‘init’, ‘load__my_files’); // Charge notre fonction qui appelle nos fichiers
//grâce à wp_enqueue_script et wp_enqueue_style
```
Est ce que j’appelle bien le fichier avec ce code ?
Une fois que le fichier est bien chargé par WordPress, comment l’appeler par la suite ? Sur le header.php ? Sur loop.php ?

Merci d’avance pour votre aide !
16 juin 2013 à 22 h 39 min #898794
foubouh
Participant

Initié WordPress
47 contributions
Bon après quelques recherches, voici le code que j’utilise pour appeler les fichiers .js :
```
function my_scripts_method() {
    wp_enqueue_script(
        ‘modernizr.custom.79639.js’,
        get_stylesheet_directory_uri() . ‘/js/modernizr.custom.79639.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘my_scripts_method’);

function my_scripts_method1() {
    wp_enqueue_script(
        ‘jquery.slitslider.js’,
        get_stylesheet_directory_uri() . ‘/js/jquery.slitslider.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘my_scripts_method1’);


function script2() {
    wp_enqueue_script(
        ‘jquery.ba-cond.min.js’,
        get_stylesheet_directory_uri() . ‘/js/jquery.ba-cond.min.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘script2’);
```
Ensuite j’ai intégré le script dans mais l’effet ne fonctionne pas…

Qd je regarde le code source de ma page, les fichiers sont bien présents. Mais ils n’ont pas l’air d’être chargé pour autant vu que rien ne se passe…

Si vous avez des idées, je suis preneur 🙂
17 juin 2013 à 7 h 13 min #898795

foubouh
Participant

Initié WordPress
47 contributions

Up ! Personne pour m’aider ?

17 juin 2013 à 7 h 39 min #898796

luciole135
Participant

Maître WordPress
13717 contributions

Vous ne pouvez pas faire successivement wp_enqueue_script et wp_enqueue_style du même fichier.
wp_enqueue_script s’utilise pour des fichiers javascript après avoir déclaré ces fichiers avec wp_register_script
http://codex.wordpress.org/Function_Reference/wp_enqueue_script
http://codex.wordpress.org/Function_Reference/wp_register_script
wp_enqueue_style s’utilise pour charger des fichiers de style CSS :
http://codex.wordpress.org/Function_Reference/wp_enqueue_style
http://codex.wordpress.org/Function_Reference/wp_register_style

17 juin 2013 à 7 h 52 min #898797
foubouh
Participant

Initié WordPress
47 contributions
Pardon, mon premier message n’avait pas le bon code.

J’ai changé ma façon de faire dans le second message, je procède comme suit. :
```
function my_scripts_method() {
    wp_enqueue_script(
        ‘modernizr.custom.79639.js’,
        get_stylesheet_directory_uri() . ‘/js/modernizr.custom.79639.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘my_scripts_method’);

function my_scripts_method1() {
    wp_enqueue_script(
        ‘jquery.slitslider.js’,
        get_stylesheet_directory_uri() . ‘/js/jquery.slitslider.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘my_scripts_method1’);


function script2() {
    wp_enqueue_script(
        ‘jquery.ba-cond.min.js’,
        get_stylesheet_directory_uri() . ‘/js/jquery.ba-cond.min.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘script2’);
```
j’ai rajouter un chiffre après function script pour l’appel 2 et l’appel 3 sinon j’avais une erreur php. Je ne sais pas si c’est la bonne solution mais mes fichiers ont l’air chargés dans le code source de ma page…

Merci de votre aide !
17 juin 2013 à 8 h 04 min #898798

luciole135
Participant

Maître WordPress
13717 contributions

http://codex.wordpress.org/Function_Reference/get_stylesheet_directory_uri
n’est pas la fonction adéquate non plus, lisez le codex donné au dessus

17 juin 2013 à 8 h 14 min #898799
foubouh
Participant

Initié WordPress
47 contributions
Merci.

Par contre mon code plus haut était il bon sans le problème get_stylesheet_uri ?

J’ai modifié le code comme suit.. Mais toujours rien.
```
function my_scripts_method() {
    wp_enqueue_script(
        ‘modernizr.custom.79639.js’,
        get_stylesheet_directory() . ‘/js/modernizr.custom.79639.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘my_scripts_method’);

function my_scripts_method1() {
    wp_enqueue_script(
        ‘jquery.slitslider.js’,
        get_stylesheet_directory() . ‘/js/jquery.slitslider.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘my_scripts_method1’);


function script2() {
    wp_enqueue_script(
        ‘jquery.ba-cond.min.js’,
        get_stylesheet_directory() . ‘/js/jquery.ba-cond.min.js’,
        array(‘jquery’)
    );
}
add_action(‘wp_enqueue_scripts’, ‘script2’);
```
Du coup pour résumer, est ce que ce code est « propre » pour appeler mes fichiers .js via wordpress ?
Y at’il un moyen de vérifier si ces fichiers sont effectivement chargés par wordpress ?

Merci de ton aide en tout cas !
17 juin 2013 à 8 h 21 min #898800

luciole135
Participant

Maître WordPress
13717 contributions

A quel endroit précis sont ces fichiers js sur votre hébergement ?

17 juin 2013 à 8 h 23 min #898801
foubouh
Participant

Initié WordPress
47 contributions
Bon ça y est je me suis perdu dans le codex. Je croit comprendre qu’il faut aussi utiliser la fonction register comme vous me l’avez préciser plus haut.

Voilà donc ce que j’ai rajouté au fichier functions.php
```
wp_register_script( ‘modernizr.custom.79639’, get_stylesheet_directory() . ‘/js/modernizr.custom.79639.js’);
wp_register_script( ‘jquery.slitslider’, get_stylesheet_directory() . ‘/js/jquery.slitslider.js’);
wp_register_script( ‘jquery.ba-cond.min’, get_stylesheet_directory() . ‘/js/jquery.ba-cond.min.js’);
```
Mais cela ne fonctionne toujours pas…
17 juin 2013 à 8 h 31 min #898802

foubouh
Participant

Initié WordPress
47 contributions

je suis en local. Mes fichiers se trouve là : c:/wamp/www/culture/wp-content/themes/culture/js

17 juin 2013 à 8 h 34 min #898803

foubouh
Participant

Initié WordPress
47 contributions

*trouvent
désolé pour la grosse faute 😉

17 juin 2013 à 8 h 38 min #898804
foubouh
Participant

Initié WordPress
47 contributions
Je crois avoir un début de réponse, j’ai aussi ce script que je rajoute dans loop.php, à la suite du code html fourni par le tuto de codrops (lien dans le premier message). Peut-être qu’il faut le rajouter ailleurs…?
voici le code :
```
	
			$(function() {
			
				var Page = (function() {

					var $nav = $( ‘#nav-dots > span’ ),
						slitslider = $( ‘#slider’ ).slitslider( {
							onBeforeChange : function( slide, pos ) {

								$nav.removeClass( ‘nav-dot-current’ );
								$nav.eq( pos ).addClass( ‘nav-dot-current’ );

							}
						} ),

						init = function() {

							initEvents();
							
						},
						initEvents = function() {

							$nav.each( function( i ) {
							
								$( this ).on( ‘click’, function( event ) {
									
									var $dot = $( this );
									
									if( !slitslider.isActive() ) {

										$nav.removeClass( ‘nav-dot-current’ );
										$dot.addClass( ‘nav-dot-current’ );
									
									}
									
									slitslider.jump( i + 1 );
									return false;
								
								} );
								
							} );

						};

						return { init : init };

				})();

				Page.init();

				/**
				 * Notes: 
				 * 
				 * example how to add items:
				 */

				/*
				
				var $items  = $(‘<div class="sl-slide sl-slide-color-2"><div class="sl-slide-inner bg-1"><div class="sl-deco"></div><h2>some text</h2><blockquote><p>bla bla</p><cite>Margi Clarke</cite></blockquote></div></div>‘);
				
				// call the plugin’s add method
				ss.add($items);

				*/
			
			});
		
```
17 juin 2013 à 9 h 26 min #898805

luciole135
Participant

Maître WordPress
13717 contributions

Faites un var_dump du chemin allant vers votre fichier js
var_dump (get_stylesheet_directory() . ‘/js/jquery.ba-cond.min.js’); pour vérifier si votre chemin est correct

17 juin 2013 à 9 h 30 min #898806
foubouh
Participant

Initié WordPress
47 contributions
Je viens de remarquer que les fichiers javascript sont appelés différemment si l’on utilise
```
get_stylesheet_directory()
```
(exemple1) ou
```
get_stylesheet_directory_uri()
```
(exemple2)

L’adresse fournit par
```
get_stylesheet_directory_uri()
```
semble plus valide que pour l’autre exemple même si apparemment je ne dois pas l’utiliser. Alors est ce une erreur de ma part en codant avec
```
get_stylesheet_directory()
```
Bon je cherche, je cherche mais je ne trouve pas !
17 juin 2013 à 9 h 33 min #898807

foubouh
Participant

Initié WordPress
47 contributions

J’ai copié ça dans functions, et j’ai eu ça comme réponse : string ‘C:wampwwwculture/wp-content/themes/culture/js/jquery.ba-cond.min.js’ (length=70)

C’est ce que je devais faire ?
Auteur

Messages