Antworten auf deine Fragen:
Neues Thema erstellen

JS-Datei im Header verlinken - wie genau geht das?

dn3d_fanboy

Aktives Mitglied

Hallo,
ich möchte im Header meiner WP-Seite eine JS-Datei verlinken, die in einem Unterverzeichnis meines Themes ist.
Wie genau verlinke ich das nun?
Im Html sieht es momentan noch so aus:
Code:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.validate.js"></script>
    <script type="text/javascript" src="js/jquery.flexslider.js"></script>

Es geht um die letzten beiden JS-Dateien. Nehme ich da die komplette URL der Seite, bzw. den Pfad der Datei oder geht das ähnlich wie bei eigenen CSS-Dateien auch flexibler?

Ich hoffe mir kann jemand helfen.

Besten Dank im Voraus.
 

cythux

Aktives Mitglied

Hier so binde ich es meistens bei mir ein die Datei nennt sich dann zb script.php, in der function.php bin ich diese mittels require_once ein
Code:
<?php
/**
* Scripts and stylesheets
*
* Enqueue stylesheets in the following order:
* 1. /theme/assets/css/bootstrap.css
* 2. /theme/assets/css/bootstrap-responsive.css
* 3. /theme/assets/css/app.css
* 4. /child-theme/style.css (if a child theme is activated)
*
* Enqueue scripts in the following order:
* 1. jquery-1.9.1.min.js via Google CDN
* 2. /theme/assets/js/vendor/modernizr-2.6.2.min.js
* 3. /theme/assets/js/plugins.js (in footer)
* 4. /theme/assets/js/main.js    (in footer)
*/

function deinTheme_scripts() {
  wp_enqueue_style('deinTheme_bootstrap', get_template_directory_uri() . '/assets/css/bootstrap.css', false, null);
  wp_enqueue_style('deinTheme_bootstrap_responsive', get_template_directory_uri() . '/assets/css/bootstrap-responsive.css', array('c1nm_bootstrap'), null);
  wp_enqueue_style('deinTheme_app', get_template_directory_uri() . '/assets/css/app.css', false, null);

  // Load style.css from child theme
  if (is_child_theme()) {
    wp_enqueue_style('deinTheme_child', get_stylesheet_uri(), false, null);
  }

  // jQuery is loaded using the same method from HTML5 Boilerplate:
  // Grab Google CDN's latest jQuery with a protocol relative URL; fallback to local if offline
  // It's kept in the header instead of footer to avoid conflicts with plugins.
  if (!is_admin()) {
    wp_deregister_script('jquery');
    wp_register_script('jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js', false, null, false);
  }

  if (is_single() && comments_open() && get_option('thread_comments')) {
    wp_enqueue_script('comment-reply');
  }

  wp_register_script('modernizr', get_template_directory_uri() . '/assets/js/vendor/modernizr-2.6.2.min.js', false, null, false);
  wp_register_script('deinTheme_plugins', get_template_directory_uri() . '/assets/js/plugins.js', false, null, true);
  wp_register_script('deinTheme_main', get_template_directory_uri() . '/assets/js/main.js', false, null, true);
  wp_enqueue_script( 'fitvids', get_template_directory_uri() . '/assets/js/vendor/jquery.fitvids.min.js', array( 'jquery' ), '1.1' );



  wp_enqueue_script('jquery');
  wp_enqueue_script('modernizr');
  wp_enqueue_script('deinTheme_plugins');
  wp_enqueue_script('deinTheme_main');
}

add_action('wp_enqueue_scripts', 'c1nm_scripts', 100);

// http://wordpress.stackexchange.com/a/12450
function c1nm_jquery_local_fallback($src, $handle) {
  static $add_jquery_fallback = false;

  if ($add_jquery_fallback) {
    echo '<script>window.jQuery || document.write(\'<script src="' . get_template_directory_uri() . '/assets/js/vendor/jquery-1.9.1.min.js"><\/script>\')</script>' . "\n";
    $add_jquery_fallback = false;
  }

  if ($handle === 'jquery') {
    $add_jquery_fallback = true;
  }

  return $src;
}

if (!is_admin()) {
  add_filter('script_loader_src', 'deinTheme_jquery_local_fallback', 10, 2);
}

function c1nm_google_analytics() { ?>
<script>
  var _gaq=[['_setAccount','<?php echo GOOGLE_ANALYTICS_ID; ?>'],['_trackPageview']];
  (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
    g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
    s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
<?php }
if (GOOGLE_ANALYTICS_ID) {
  add_action('wp_footer', 'deinTheme_google_analytics', 20);
}
 

afr0kalypse

Allwissendes Karmameerschweinchen!

Alternativ geht auch:
PHP:
<script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/datei.js"></script>
Da Wordpress aber schon jQuery anbietet, würde ich ganz klar cythux' Variante empfehlen.

Übrigens: Bitte nicht im Header laden, sondern im Footer, bzw. vor </body>
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.616
Beiträge
1.538.358
Mitglieder
67.536
Neuestes Mitglied
QuestionMark
Oben