Suche
Teilen
startseite » forum

Externe Dateien (JavaScript/CSS) einbinden [Gelöst]

  • 0 x
    19 Beiträge
    0 Hilfreiche Beiträge
    07. 06. 2007, 18:29

    Ahoi zusammen,

    nach einigen Stunden des Suchens in meinen Büchern und in einigen Foren, komme ich nun an meine als Anfänger sowieso bescheidenen Grenzen.

    Ich möchte auf folgender Seite
    http://www.ihre-malermeister.eu/index.php?id=3

    mehrere JavaScripte einbinden, was nicht zu funktionieren scheint, da
    a) der Flashfilm im rechten oberen DIV nicht abgespielt wird und
    b) das CSS-Menu nicht richtig formatiert wird (es sollte eigentlich via css-datei horizontal angeordnet sein)

    Bei dem Menu bin ich von folgender Anleitung ausgegangen:
    http://82.165.8.199/typo3cms/exotec-design.de/index.php?id=89

    Bin gespannt welcher TYPO3er mir helfen kann...

    Danke in jedem Fall schon einmal!

  • 1
  • febo febo
    Sternenflotten-Admiral
    0 x
    187 Beiträge
    0 Hilfreiche Beiträge
    08. 06. 2007, 09:29

    Hi mike_mcfly,

    hier mal ein Beispiel wie Du CSS und andere Dinge in Deine Seiten über typoScript einbinden kannst.

    [TS]# Default PAGE object:
    page = PAGE
    page {
    typeNum = 0
    stylesheet = fileadmin/templates/css/style.css

    # <head>
    headTag = <head>
    headerData {
    10 = TEXT
    10.value = <script language="JavaScript" type="text/javascript" src="js/someJavaScript.js"></script>
    }

    # <body>
    bodyTag = <body>

    10 = TEMPLATE
    10 {
    template = FILE
    template.file = fileadmin/templates/main.tmpl

    ....
    u.s.w
    [/TS]

    Ich hoffe, dass löst Dein Problem.

    Gruß

    febo

  • 0 x
    19 Beiträge
    0 Hilfreiche Beiträge
    08. 06. 2007, 17:24

    Also erst mal Danke für die Antwort, leider hat es nicht funktioniert !-(

    Hier ist mal das TypoScript, dass ich angelegt habe:

    //////////////////////////////////////////////////////////////////////////////////////////////
    config{
    doctype = xhtml_trans
    locale_all = de_DE
    htmlTag_langKey = de
    xhtml_cleaning = all
    linkVars = L
    sys_language_uid = 0
    language = de
    metaCharset = utf-8
    }

    page = PAGE
    page {
    typeNum = 0
    stylesheet = fileadmin/template/main/res/layout.css
    includeCSS.file1 = template/main/res/menu.css
    }

    page.20 = TEMPLATE
    page.20 {
    template = FILE
    template.file = fileadmin/template/main/index.html
    workOnSubpart = document
    subparts.content < styles.content.get
    relPathPrefix = fileadmin/template/main/

    #Hauptmenu
    subparts.navi = HMENU
    subparts.navi {
    entryLevel = 0

    # Erste Menüebene (horizontaler Teil)
    1 = TMENU
    1 {
    wrap = <ul id="menu">|</ul>
    expAll = 1
    IFSUB = 1
    IFSUB.allWrap = <li><div id="top">|</div><ul>
    NO.linkWrap = <li><div id="top">|</div></li>
    }

    # Zweite Ebene (erster vertikaler Teil)
    2 = TMENU
    2 {
    wrap = | </ul></li>
    expAll = 1
    IFSUB = 1
    IFSUB.allWrap = <li>|<ul>
    NO {
    linkWrap = <li>|</li>
    RO = 1
    }
    }

    3 < .2
    4 < .2
    5 < .2
    6 < .2

    }

    }

    # <head>
    #headTag = <head>
    #headerData {
    # 10 = TEXT
    # 10.value = <script type="text/javascritp" src="fileadmin/template/main/res/swfobject.js"></script>
    # }

    #<script type="text/javascript" src="fileadmin/template/main/res/dynMenu.js"></script>
    #<script type="text/javascript" src="fileadmin/template/main/res/browserdetect.js"></script>

    //////////////////////////////////////////////////////////////////////////////////////////////

    Das Menu wird zwar angezeigt, allerdings kann ich es nicht mit css stylen. Auch die Flashannimation ist nicht zu sehen (oben links in dem orangefarbenen Quadrat sollte diese laufen).

    Könnte ich die benötigten Stylesheets und JavaScripts einbinden wäre das Problem vermutlich gelöst, doch im Quelltext der gerenderten Typo3-Ausgabe tauchen diese nicht auf. Somit liegt das Problem im TypoScript mit dem ich die Einbindung der externen Dateien nicht hinbekomme.

    Also an dieser Stelle noch einmal die Bitte um Hilfe, vielen dank vorab!

  • Michaelh74 Michaelh7...
    Jedi-General
    0 x
    1519 Beiträge
    0 Hilfreiche Beiträge
    09. 06. 2007, 11:30

    Hallo,

    versuch das mit der CSS-Einbindung mal so:

    [TS]includeCSS.file1 = template/main/res/layout.css
    includeCSS.file1´2 = template/main/res/menu.css
    [/TS]

    Der Header-Bereich für die JS-Einbindung ist ja auskommentiert und dort ist noch ein Rechtschreibfehler drin "javascritp"!!!
    Wenn es dann immernoch nicht geht, bitte prüfen, ob das JS im Quelltext der Ausgabedatei erscheint. Falls, liegt das Problem sicher an den Pfaden.

    Gruß
    Michael

  • 0 x
    19 Beiträge
    0 Hilfreiche Beiträge
    12. 06. 2007, 18:29

    Hallo,

    vielen Dank erst mal!

    Für alle, die ein ähnliches Problem haben, hier mal der Teil des TypoScript, dass es gelöst hat.

    [TS]includeCSS.file1 = fileadmin/template/main/res/menu.css
    headerData.1 = TEXT
    headerData.1.value = <script src="fileadmin/template/main/res/swfobject.js" type="text/javascript"></script>[/TS]

    Zeile 1. = externes CSS einbinden
    Zeils 2. bis 3. = externes JavaScript einbinden

  • BFSven BFSven
    R2-D2
    0 x
    106 Beiträge
    2 Hilfreiche Beiträge
    05. 02. 2013, 12:08

    Ich weiß, der Thread ist uralt, aber vielleicht sucht ja jemand danach und kommt auf diese Seite. Es gibt (inzwischen?) eine elegantere Löseung, als über headerData. Das Einbinden von JavaScript funktioniert genauso wie bei CSS

    1. page {
    2. 	includeCSS {
    3. 		myExt = EXT:myExt/Resources/Public/Css/myExt.css
    4. 	}
    5. 	includeJS {
    6. 		myExtTop = EXT:myExt/Resources/Public/JavaScript/myExtTop.js
    7. 	}
    8. 	includeJSFooter {
    9. 		google = http://maps.google.com/maps/api/js?v=3.3&sensor=true
    10. 		google.external = 1
    11. 		jquery_lightbox = EXT:myExt/Resources/Public/JavaScript/jquery.lightbox-0.5.js
    12. 		myExt = EXT:myExt/Resources/Public/JavaScript/myExt.js
    13. 	}
    14. }

    Da TYPO3 überprüft, ob die Datei vorhanden ist und dieses nur lokal funktioniert, müssen exterene JS-Dateien das Flag "external" bekommen (s.o. "google", die Prüfung wird so deaktiviert).
    Mit "includeJSFooter" wird die JS ganz unten im Quelltext geladen.

    Vielleicht brauchts ja nochmal jemand.

    VG Sven

  • 1
Präsentiert von