Noob sucht Hilfe zur Einbindung einer onLoad oder doc.load Funktion

  • Hallo Leute,

    ich habe vor ein paar Tagen angefangen mit WordPress zu arbeiten und erstelle gerade meine erste Webseite http://www.it-seitz.de damit.

    Folgender IST-Stand:

    Installierte Plugins:
    WP Editor
    Ultimate TinyMCE
    Floatbox (aber nicht die deutsch Floatbox Plus, da ich eine Free-Lizenz beantragt habe)

    Installiertes Theme:
    GamePress

    Anliegen / Problem:
    Folgendes, ich möchte beim laden, bzw. nach dem die "Startseite" geladen wurde, ein Bild in einer sogenannten "LightBox" automatisch öffnen lassen.
    Ich weis, dass ich dafür folgende Scripte / Codes benötige:

    PHP
    $(function() { 
         $('a').floatbox({fixedNavigation:true});            
         $("#startimage").trigger("click"); //Simuliert den Link-Klick 
    });
    PHP
    <a href="http://forum.wpde.org/images/top_left.jpg" id="startimage" rel="floatbox">test</a>

    Ich habe nun als absoluter Noob, was WordPress betrifft, dass Problem, dass ich nicht weis, wo ich das Script einfügen muss.
    Den Link habe ich in den <body>-Tag in der header.php eingefügt. Das Wort "test" dient nur zur Kontrolle, ob der Link auch wirklich "erscheint", "test" wird bei erfolgreicher Umsetzung entfernt, damit es ein "blinder"-Link ist und somit nicht mehr auf der Webseite zu sehen ist.

    Ich habe schon mehrere Möglichkeiten probiert, bekomme aber nicht das Ergebnis, was ich haben möchte.
    Unter anderem habe ich versucht eine eigene *.js einzufügen, habe also eine JS-Datei geschrieben und diese in den Theme-Verzeichnis in den "js"-Ordner eingefügt und in der function.php folgenden Code eingefügt:

    PHP
    wp_register_script( 'eigenes-script', 'http://www.EIGENES-SCRIPT.com');
    wp_enqueue_script( 'eigenes-script' );


    und zwar an folgender Stelle (===> hier eingefügt):


    Damit sollte das Script geladen werden. anschliessend habe ich im <body>-Tag einen "onload"-Beeigefügt, damit das Script auch ausgeführt wird. Ergebnis = 0.

    Nach dem ich ALLE eben genannten Änderungen rückgänig gemacht habe, wollte ich folgenden Lösungsweg angehen.

    Im Header folgendes Script eingefürgt:

    PHP
    <script type="text/javascript">
    $(function() { 
         $('a').floatbox({fixedNavigation:true});            
         $("#startimage").trigger("click"); //Simuliert den Link-Klick 
    });
    </script>


    Den Link wieder in die header.php eingefügt, wie oben schon erwähnt. Ergebnis = 0.

    Wäre vielleicht einer von Euch so mega freundlich und könnte mir erklären, was ich wo tun muss, damit ich meine Idee / mein Vorhaben in die Tat umsetzen kann ?

    Ich wäre Euch für Hilfe echt dankbar.

    Mit freundlichen Grüßen
    der noobige Haudegen ;) :D

    • 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

  • WP bringt jQuery schon mit, einzige Ausnahme, du darfst nicht $ verwenden, sondern musst stattdessen jQuery schreiben.
    Ich weiß allerdings nicht, ob die WP jQuery dieses floatbox (meinst du das: http://floatboxjs.com/download ?) schon mitbringt, ansonsten musst du es erst auch noch einbinden (dann könnte es sein, dass du auch wieder mit $ arbeiten musst):

    Code
    <script type="text/javascript">
      jQuery(document).ready(function(){ 
         jQuery('a').floatbox({fixedNavigation:true});            
         jQuery("#startimage").trigger("click");
    });  
    </script>


    Das ganze setzt du entweder in die header.php in den HEAD Bereich, oder in die footer.php (da js eigentlich immer erst im footer geladen werden soll).

    Mehr musst du eigentlich gar nicht machen. Kannst auch mal hier ein bisschen lesen: http://www.im-tal.net/tipps/wordpres…script-library/


    Edit:
    Falls du Floatbox.js erst noch mit einbinden musst, dann evtl. so:

    Code
    <script type="text/javascript" src="...../floatbox.js"></script>
    <script type="text/javascript">
      $(document).ready(function(){ 
         $('a').floatbox({fixedNavigation:true});            
         $("#startimage").trigger("click");
    });  
    </script>

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

    Einmal editiert, zuletzt von maxe (21. Februar 2013 um 15:11)

  • Ja ich benutze diese Floatbox und habe das Plugin Installiert.
    Wenn Du meine Webseite besuchst, dann siehst oben links auch den Link "Test",
    beim Klick öffnet sich das Bild auch in der Floatbox, dass funktioniert also.

    Ich habe beide Scripte getestet, sowohl in der header.php, als auch in der footer.php jedoch funktioniert es immer noch nicht. wobei ich mir nicht sicher bin, wo genau ich es in der footer.php einfügen soll, bei der header.php ist es klar, da kommt es in den <head>-Tag.

  • Ich habe mir mal den Spaß erlaubt und ein Script von der Webseite im-tal.net ausprobiert.
    Ich habe das Script mit der Textausblendung genommen und es in der header.php, in den
    <head>-Tag eingefügt und siehe da, es funktioniert (siehe meine Webseite / Startseite).
    JEDOCH funktioniert das Script nur, wenn ich das Script für die onLoad-Floatbox deaktiviere,
    sprich mit <!-- <script>...</script> --> rausnehme.

    Ich befürchte nun, dass das Script für die Floatbox fehlerhaft ist.

    Okay dieser Fehler ist behoben, dass Script war fehlerhaft, da ich vergessen habe, das Floatbox script zu schliessen *rolleyes* aber mein Problem besteht immer noch, das Script wird nicht ausgeführt :(

    Einmal editiert, zuletzt von Haudegen (22. Februar 2013 um 10:11)

  • Ja ich benutze diese Floatbox und habe das Plugin Installiert.
    Wenn Du meine Webseite besuchst, dann siehst oben links auch den Link "Test",
    beim Klick öffnet sich das Bild auch in der Floatbox, dass funktioniert also.

    Jetzt hatte ich mich echt gefragt, was dann noch das Problem ist.
    Noch mal genau gelesen ... du willst es nicht bei Klick, sondern automatisch??
    Dann ist .trigger("click") ja falsch. Vielleicht nimmst du dann eher sowas wie .show oder .fadeIn

    Code
    <script type="text/javascript">
      $(document).ready(function(){ 
         $('a').floatbox({fixedNavigation:true});            
         $("#startimage").fadeIn("slow");
    });  
    </script>


    Schau mal hier: http://api.jquery.com/category/effects/

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • aber click ist auf jeden Fall falsch. Musst du halt ein bisschen noch rum probieren.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • Sooo Antwort gefunden und neues Problem aufgeworfen :D

    hier erst ein mal mein Script, womit ich beim Laden der Seite eine Lightbox mit dem Plugin Floatbox erhalte:

    PHP
    <script type="text/javascript">
        $(document).ready(function(){
           fb.start( '/* DEINE URL VOM BILD */', 'roundCorners:none ' );
        });
      </script>

    sooo nun aber zu meinem daraus entstandenen Problem

    da die Lightbox nur jedes mal aufplopp, wenn ich mich innerhalt der webseite bewege, ist das natürlich extrem nervig.
    meine gedachte Lösung, ich lege dass Script nicht in den <head>-tag, sonder für es in die erstelle startseite, also in den content. gemacht und getan, dass script läuft nun ausschliesslich auf der startseite. ABER immer noch nervig, da bei jedem aufruf der startseite, die lightbox ploppt :roll:
    also wieder mal die kleine graue grütze im köpfchen angestrengt und google benutzt :mrgreen: ergebnis: man setze einen Cookie. (will kääkse...:D) habe einige scripte probiert, aber bin kläglich gescheiter, einen cookie zu setzen.
    hier mal mein letzter versuch:

    PHP
    <script type="text/javascript">
        $(function(){
          if(Cookie.read('POPUP')) return;
          Cookie.write('POPUP', '1',{duration: 0.06});
          fb.start( 'http://it-seitz.de/wordpress/wp-content/uploads/2013/02/Winter-642x362.jpg', 'roundCorners:none ' );
        });
      </script>
  • okay, wer suchet der findet. ich habe eine seite gefunden, die erklärt, wie man mit jQuery einen Cookie handhabt
    http://rene-springmann.de/2012/08/cookie…hen-mit-jquery/

    bin mit der Hilfe zu folgendem Script gekommen:

    PHP
    <script type="text/javascript">
        $(function(){
          if (alert($.cookie("POPUP") != '1')), return;
        	$.cookie("POPUP", "1", { expires: 0.42 });
          fb.start( 'http://it-seitz.de/wordpress/wp-content/uploads/2013/02/Winter-642x362.jpg', 'roundCorners:none ' );
        });
      </script>

    jedoch gibt es folgende Fehlermeldung: Uncaught SyntaxError: Unexpected token
    kann mir wer weiter helfen ?

  • Mal wieder selbst gebastelt und folgendes Ergebnis bekommen:

    PHP
    <script type="text/javascript">
        $(window).load('load',function(){
          if($.cookie("POPUP") != "besucht") return true; 
          $.cookie("POPUP", "besucht", { expires: 1, domain: 'it-seitz.de' });
          fb.start( '/* DEIN BLID */', 'roundCorners:none ' );
        });
    </script>


    Dieses Script wird nun ohne Fehlermeldung ausgeführt, ABER wenn ich bei
    den Browser in die Cookie-Ordner schaue, ist der Cookie einfach nicht aufzufinden :shock:

    Hat Jemand eine Idee ?

    Einmal editiert, zuletzt von Haudegen (23. Februar 2013 um 10:46)

  • OKAYYY...wieder einmal selber rumgespielt...der Fehler muss in der Abfrage liegen,
    denn wenn man die if-abfrage raus nimmt, wird der cookie gesetzt:

    PHP
    <script type="text/javascript">
        $(window).load('load',function(){
        //if($.cookie("POPUP") != "besucht") return true;
        $.cookie("POPUP", "besucht", { expires: 1, domain: 'it-seitz.de' });
        fb.start( '/* DEIN BLID */', 'roundCorners:none ' );
          });
    </script>

    ich seh langsam der wald vorlauter bäumen nicht...hilfeee...

  • ERLEDIGT !! Script läuft und kann vllt irgendwo als Tipp aufgenommen werden !

    Oay dieser Threat kann geschlossen / gelöscht werden, habe alle Probleme gelöst und alles funktioniert wie es soll.

    Wenn es gewünscht ist, kann ich einen Hilfe / Tipp Threat schreiben, in diesem würde ich dann beschreiben, was ich genau gemacht habe und wie die Scripte aussehen müssen.

    Grüsse
    Euer Haudegen

Jetzt mitmachen!

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