Zum Inhalt springen

Einbindung von JavaScript via TS wird durch Extension "gestört"

Erstellt am 1. April 2013 · 3 Antworten · letzte Antwort am 1. April 2013

Tags: Frage

GordonR ·

Hallo Zusammen!

Ich habe ein Problem bei der Verwendung von JavaScript-Funktionen im Zusammenhang mit einer Galerie-Extension (rgsmoothgallery). Ich binde via TS die nachfolgenden JavaScript-Elemente in meine Website ein...

page.headerData.10 = TEXT
page.headerData.10.value (
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta http-equiv="expires" content="0"/>
<meta http-equiv="cache-control" content="no-cache"/>
<meta http-equiv="pragma" content="no-cache"/>
<meta name="robots" content="index, follow"/>
<meta name="author" content="AWO Bremerhaven"/>
<meta name="robots" content="index, follow"/>
<link rel="shortcut icon" href="favicon.png"/>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="fileadmin/awotempel/js/jquery.tools.min.js"></script>
<script src="fileadmin/awotempel/js/jquery.cycle.all.latest.js"></script>

<script type="text/javascript">

  $(document).ready(function() {
      $('.slideshow').cycle({
      fx: 'fade',
      speed: 1000,
      timeout: 15000,
      pause: 1,
      random: 1
    });
  });

  $(document).ready(function() {
    $('#inputuser').click(function() {
    if (this.value == this.defaultValue) {
    this.value = '';
    }
    });
    $('#inputuser').blur(function() {
    if (this.value == '') {
    this.value = this.defaultValue;
    }
    });
  });

  $(document).ready(function() {
    $('#sjs').fadeOut();
    $("img[rel]").overlay();
  });

</script>

)

Funktioniert auch alles wunderbar. Auf einer der Inhaltsseiten verwende ich dann aber zusätzlich eine Galerie-Extension. Diese Extension sorgt anscheinend dafür, dass die von mir eingebundenen JavaScripte nicht mehr geladen/gefunden werden. Abgesehen von der Galerie funktioniert keines meiner eingebundenen Scripte mehr. Deaktiviere ich die Galerie funktionieren auch meine Scripte wieder. Die Konsole in Chrome gibt mir diesen Fehler aus:

Uncaught TypeError: Object #<error> has no method 'cycle' index.php:46
(anonymous function) index.php:46
c.extend.ready jquery.tools.min.js:38
L

Da ich kein Entwickler bin brauche ich dringend Hilfe bei diesem Problem. Ich weiß nicht wo der Fehler liegt. Ich ahne zwar, dass die durch die Galerie zusätzlich hinzugefügten JavaScript-Referenzierungen einen Konflikt mit den meinigen erzeugen, aber ich habe keine Ahnung, wie ich dieses Problem lösen könnte. Vielleicht liegt es ja an der Reihenfolge (damit hatte ich vorher schon Probleme, bis ich herausgefunden habe, dass ich zuerst das "externe" und dann die beiden "internen" Referenzierungen eintragen muss). Aber wie kann ich steuern, wo Typo3 seine Links in den Header einfügt? Oder muss ich die ganze Einbindung anders gestalten?

Im Grunde genommen ergibt sich für mich natürlich die generelle Frage, wie ich "eigenes JavaScript" in Typo3 einbinden muss, ohne dass es durch die Verwendung irgendwelcher Extensions "ausgeschaltet" wird.

Ich wäre wirklich sehr dankbar für eure Hilfe bei meinem Problem. Bitte bedenkt aber, dass ich kein Entwickler bin. Also bitte laaangsam sprechen... 🙂

Vielen Dank im Voraus und frohe Ostern!

Gordon

typix ·
GordonR schrieb

Im Grunde genommen ergibt sich für mich natürlich die generelle Frage, wie ich "eigenes JavaScript" in Typo3 einbinden muss, ohne dass es durch die Verwendung irgendwelcher Extensions "ausgeschaltet" wird.

Hallo,

nimm den js-Code aus Deiner setup.txt bzw. aus dem TSConfig heraus und speichere den Code in separaten Dateien in einem Unterordner des fileadmin-Verzeichnisses.
Eingebunden werden solche Dateien dann grundsätzlich mit includeXXX:

page = PAGE
page {

typeNum = 0
meta {
}

10 = TEMPLATE
10 {

Irgendwas...

includeCSS {
file7 = fileadmin/templates/css/normalise.css
file8 = fileadmin/templates/css/style.css
}

includeJSlibs {
file15 = fileadmin/templates/js/html5.js
html5.forceOnTop = 1
}

includeJSFooterlibs {
file16 = fileadmin/templates/js/jquery.min.js
jquery.forceOnTop = 1
}

includeJSFooter {
file17 = fileadmin/templates/js/script.js
}
}
}

Welche includeXX-Option Du nimmst, hängt davon ab, ob js schon im Header geladen werden muss oder ob ein späteres Laden in den Footer ausreicht.
Wichtig ist auch, dass jede file-Anweisung eine eigene Nummer hat, sonst wird der vorherige file mit derselben Nummerierung vom späteren file überschrieben. Dann nicht vergessen, die Dateirechte auf 550 und user:user zu setzen und dann sollte es eigentlich laufen🙂

GordonR ·

Ein fettes Danke für Deine Hinweise. Ich probiere es gleich morgen aus und gebe dann Feedback ob ich es hinbekommen habe...

🙂