Jquery einbindung - ich dreh noch durch :)

  • Hallo liebe Foren Profis - ich möchte gern jquery in Wordpress einbinden. Also massiv schlau gemacht und einige Schritte gefunden:

    1. Einbinden in die header.php und zwar mit folgender Zeile direkt vor <?php wp_head(); ?>

    <?php wp_enqueue_script('jquery');?>

    CHECK!

    2. Getestet ob die Einbindung auch im Quellcode auftaucht.....


    CHECK!

    3. Testscript in den Footer eingebunden - gaaaanz einfaches Script und auch auf den "Non-Conflict-Mode" geachtet....

    <script>
    jquery(document).ready(function(){
    jquery("p").click(function(){
    jquery(this).hide();
    });
    });
    </script>

    CHECK!

    4. Seite in Wordpress im Theme 2017 erstellt, dort einige Paragraphs im Textmodus eingefügt....


    5. Seite im Frontend aufgerufen - Nix passiert. Ich weiß wirklich nicht, was ich da (das Problem sitzt ja meistens vor dem PC) falsch mache.

    Danke für jegliche Hilfe und Anregung im Voraus.

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Wie sieht der Quellcode im Frontend aus? Wird jQuery vor deinem Script geladen? Werden wirklich p-Tags ausgegeben? Werden Fehler ausgegeben?

    Am Besten wäre ein Link zur Seite.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]


  • 1. Einbinden in die header.php und zwar mit folgender Zeile direkt vor <?php wp_head(); ?>

    <?php wp_enqueue_script('jquery');?>

    CHECK!

    ich bin mir sicher, dass ich dies auch bei WordPress noch nie so gemacht haben...

    in der funktions.php von theme theme gibt es in der Regel:

    /**
    * Enqueue scripts and styles.
    */
    function theme_scripts() {

    wp_enqueue_script(....
    }
    add_action( 'wp_enqueue_scripts', 'theme_scripts' );


    2. Getestet ob die Einbindung auch im Quellcode auftaucht.....


    [TD="class: line-content"]<script type='text/javascript' src='http://hirnschmalzfabrik.com/wp-includes/js…in.js?ver=1.4.1'></script>[/TD]

    mit so altem jquery Kram würde ich nicht arbeiten wollen... aktuelle Version ist 3.2.1...



    3. Testscript in den Footer eingebunden - gaaaanz einfaches Script und auch auf den "Non-Conflict-Mode" geachtet....

    <script>

    in alten Umgebungen würde ich

    <script type='text/javascript'>
    /* <![CDATA[ */


    /* ]]> */
    </script>

    verwenden.


    // jquery(document).ready(function(){

    ich verwende in der Regel
    jQuery(document).ready(function (e) {


    // jquery("p").click(function(){

    ich verwende in der Regel
    jQuery('p').click(function () {


    5. Seite im Frontend aufgerufen - Nix passiert. Ich weiß wirklich nicht, was ich da (das Problem sitzt ja meistens vor dem PC) falsch mache.

    einen debugger verwenden...

    Mit offenen Augen träumen

  • Wie r23 schon schrieb, solltest du in WordPress mit [FONT=lucida console]wp_enqueue_script()[/FONT] arbeiten. Dort kannst du deine Datei festlegen und auch direkt sagen, dass die Datei mit jQuery geladen werden soll. Ein Beispiel sieht dann so aus:

    [FONT=lucida console]function wpde_scripts() {[/FONT]
    [FONT=lucida console] wp_enqueue_script(
    'DEIN-SCRIPT-NAME',
    get_stylesheet_directory_uri() . '/DEINE-DATEI.js', // tausche das Fettgedruckte, mit deinem Dateipfad aus!
    array( 'jquery' )
    );[/FONT]
    [FONT=lucida console]}[/FONT]
    [FONT=lucida console]add_action( 'wp_enqueue_scripts', 'wpde_scripts' );[/FONT]

    Wichtig: Das packst du dann in deine [FONT=lucida console]functions.php[/FONT]. Wenn du das gemacht hast, kannst du deine JS Datei im Theme Ordner mit deinem Kram befüllen. Du kannst an der Stelle DEINE-DATEI.js einen beliebigen Pfad in deinem WordPress Theme angeben. Innerhalb der [FONT=lucida console]wp_enqueue_script()[/FONT] Funktion ist ein PHP [FONT=lucida console]array()[/FONT] an letzter Stelle. Dort kannst du bereits registrierte Scripte einbinden. Hier binden wir jQuery ein. Das ist nämlich von Haus aus in WordPress eingebunden, muss nur jedes Mal abgerufen werden.

    In der Datei selbst, kannst du dann folgendermaßen mit jQuery arbeiten:

    [FONT=lucida console]jQuery(function ($) {
    // Hier schreibst du deinen Kram rein
    });[/FONT]

    Du kannst auch das Beispiel von r23 nehmen und das Ausschreiben, was ich jetzt gekürzt habe:

    [COLOR=#333333][FONT=lucida console]jQuery(document).ready(function ($) {
    // Hier schreibst du wieder deinen Kram rein
    });
    [/FONT]
    Dann sollte das alles funktionieren.
    [/COLOR]

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!