Bei größeren Websites bietet es sich an, den Besuchern ein Inhaltsverzeichnis der Website zu präsentieren. Hier kommt das Inhaltselement “Sitemap” ins Spiel. Allerdings lässt sich die bei TYPO3 mitgelieferte Sitemap nicht sehr gut konfigurieren. Als Alternative kann man zum Beispiel die Extension “dropdown_sitemap” verwenden.
Viel Spaß!


[youtube]https://www.youtube.com/watch?v=Or51KSE62R4[/youtube]
Alle TYPO3-Tutorials kostenlos downloaden

Dieser Beitrag hat 37 Kommentare

  1. scholzi

    hallo,
    ich würde gern mal sehen, wie du das Layout anpassen würdest, also z.B. die blauen Seiten ändern, die Seitenüberschrift ändern, usw. Wird das außerhalb von typo3 gemacht also in der entsprechenden css-Datei, oder doch alles in typo3?
    scholzi 😉

    1. Wolfgang Wagner

      Das Layout hat mit TYPO3 nichts zu tun. Das wird im HTML-Code bzw. den CSS-Dateien der HTML-Vorlage verändert.
      Eigentlich habe ich nicht vor, im Rahmen dieses Kurses an dem Layout zu arbeiten, denn die Videos handeln ja von TYPO3. Aber du kannst natürlich auch deine eigenen Vorlagen verwenden.
      Um das im Kurs verwendete Layout anzupassen, empfehle ich dir, dich näher mit dem verwendeten YAML-Framework zu befassen. Denn damit lassen sich natürlich auch ganz andere Layouts umsetzten (siehe meine Referenzen).

  2. Lena

    Hallo,
    ich habe da ne ähnliche Frage.
    Muss man die html datei sofort ändern oder kann man es auch nachdem umsetzen in Typo 3 ändern? Ich habe jetzt da was geändert und zwar die Überschrift. Und trotzdem wird “YAML” angezeigt, obwohl es gar nicht mehr in der html steht.. cache habe ich gelöscht, habe auch im editor kontrolliert, ob es dort wirklich was anderes steht.. Woher nimmt denn Typo3 ältere Werte?.. Habe sogar neu gemappt und unter anderem namen gespeichert und danach diesen layout der ROOTseite zugewiesen..

  3. Lena

    Ja und jetzt habe ich gerade bemerkt wenn ich was im Topnavigation anklicke, dann wird es mit dem aktuellen Text angezeigt aber ohne css formatierung:(

  4. Wolfgang Wagner

    @Lena: das Problem kenne ich 🙂

    Wenn nach dem Mappen nochmal Änderungen am Quellcode vorgenommen werden, muss man die TemplaVoila-Datenstruktur noch mal neu erstellen.

    • Gehe dazu im Seitenbaum auf den Sysordner, in dem die Datensätze gespeichert sind (in meinen Videos “Allgemeine Datensatzsammlung”)
    • Dann in das TemplaVoila-Backendmodul
    • Klicke dann auf “Abbildung aktualisieren”
    • Dann auf “DS / VO modifizieren”
    • Dann auf “Speichern” oder “Speichern und beenden”

    Jetzt sollte die Struktur aktualisiert sein. Zur Sicherheit nochma den Cache leeren, dann sollten die Änderungen übernommen werden.

    Das Layout kann natürlich jederzeit komplett verändert werden. Ihr könnt auch eigene HTML-Templates erstellen und diese verwenden. Das ist je gerade die Stärke eines Content Management Systems, die Trennung von Layout und Inhalt.

    Vielleicht mache ich dazu auch noch ein Video 😉

  5. Lena

    Vielen Dank! Jetzt kann ich zwar überall die aktuelle Überschrift sehen aber alle seiten sind nun ohne css… Wie kann ich es ändern? =)

  6. Wolfgang Wagner

    Gehe mal wieder auf “Abbildung aktualisieren” und schau unter “Kopfteile”, ob die Links zum CSS eingebunden sind. Wenn nicht, ein Häkchen setzen, dann auf “Festlegen” -> “Speichern”

  7. Lena

    Klapt:) Danke schön!

  8. Lena

    Hallo Wolfgang,
    ich habe noch eine Frage.
    Und zwar geht es um eigenes template. Habe html detei geschrieben und gemapt. Aber navi und topnavi werden nicht angezeigt.. alles anderes wird angezeigt, nur die zwei sachen nicht..
    hier ist der Quelltext:
    Navigation:
    <div id=”navi”>
    <ul>
    <li class=”aktiv”><strong>Button 1</strong></li>
    <li ><a href=”#”>Button 2</a></li>
    <li ><a href=”#”>Button 3</a></li>
    <li ><a href=”#”>Button 4</a></li>
    <li ><a href=”#”>Button 5</a></li>
    </ul>
    </div>
    Topnavigation:
    <div id=”topnavigation”>
    <span><a style=”color:#FFFFFF;” href=”#”>Login</a> | <a style=”color:#FFFFFF;” href=”#”>Contact</a> | <a style=”color:#FFFFFF;” href=”#”>Imprint</a></span> </div>
    Abgebildet wurden <div id=”navi”> und <span>

  9. Lena

    übrigens habe gerade queltext der seite gesehen, so wie er im firefox dargestellt wird… es sieht ganz anders aus und zwar so:

     <div id="navi"></div>
    <div id="topnavigation" >
    <span></span> </div>
    Irgendwie schmeißt er den inhalt weg... :(
    
  10. Wolfgang Wagner

    Ich tippe mal, dass dein TYposcript für die Navigationen nicht stimmt. Kannst du mal irgendwo einen Screenshot deines Seitenbaumes im Backend und die Typoscripts für die Navigationen hochladen? Dann kann man sich das mal anschauen.

  11. Lena

    ..kann es vielleicht auch daran liegen dass ich einfach eine css datei habe und im beispiel waren mehrere , auch für navi eine externe datei? Auf jeden fall der link für css ist richtig. Ohne typo3 funktioniert es.. In Typo3 wie gesagt wird nur helfte von css gelesen..
    [URL=http://www.radikal.ru][IMG]http://s48.radikal.ru/i120/1007/57/aa236a158c29.jpg[/IMG][/URL]
    lib.navigation = HMENU
    lib.navigation {
    wrap = <ul>|</ul>
    1 = TMENU
    1 {
    expAll = 1
    NO = 1
    NO{
    allWrap = <li>|</li>
    }
    CUR = 1
    CUR{
    allWrap = <li class=”active”><strong>|</strong></li>
    doNotLinkIt = 1
    }
    }
    2 < .1
    }
    lib.topnav = HMENU
    lib.topnav {
    special = directory
    special.value = 15
    1 = TMENU
    1 {
    NO = 1
    NO.allWrap = ||*|&nbsp;|&nbsp;||*|
    CUR = 1
    CUR.allWrap = <strong>|</strong>|*|&nbsp;|&nbsp;<strong>|</strong>|*|
    CUR.doNotLinkIt = 1
    }
    }

  12. nut

    mir ist gerade eine Wechselwirkung zwischen dropdown_sitemap und perfectlightbox aufgefallen.
    Symtom: Es wird die Sitemap nicht abgezeigt. Die komplette Seite erscheint schwarz, angezeigt werden die Menuepunkte der perfectlightbox incl. dem “ladekreisel”.
    Abstellen konnte ich das in dem ich die Effekte im Inhaltselement Drop-Down Sitemap auf None gestellt habe. Oder eben eines der beiden Plugins aus dem Roottemplate entfernt habe.
    Komische Sache

  13. nut

    2. bessere Lösung:
    Template-> Root-> Konstanten-Editor-> PERFECTLIGHTBOX(27) auswählen.
    Der erste Punkt “Which Javascript Librarys to use?” von protaculous auf zB jQuery ändern.
    Nun funktionieren die Effekte in Drop-Down Sitemap wieder.

  14. Wolfgang Wagner

    Ja, man muss aufpassen, wenn zwei Extensions ein Javascript-framework verwenden, gelegentlich kollidieren die beiden dann.

    @Lena: hast du inzwischen eine Lösung gefunden?

  15. Lena

    Ja, vielen Dank:) Aber ich habe das Ganze einfach neu gemacht und zwar wieder mit YAML. Habe da in css dateien alles angepasst wie ich wollte. Ist auch einfaher und schneller.

    1. Wolfgang Wagner

      Das ist einer der Vorteile von Frameworks: die Entwicklungszeit neuer Seiten verkürzt sich drastisch, weil man nicht jedesmal von 0 anfangen muss. Zwar muss man sich erst mal reinarbeiten, aber der Aufwand lohnt sich. Ich möchte YAML nicht mehr missen.

      1. Lena

        Genau! Ich bin jetzt auch begeistert. Echt super. Aber ich wuste am Anfang halt nicht wo genau ich css ändern kann, hab doch überall gesucht und nicht gefunden..
        Falls jemand noch dieses Problem hat, sollte man Feierbag nutzen. Das ding lässt ganz schnell finden, in welche Detei die Änderungen gemacht werden sollen. Genau so hab ich es gemacht.

        1. Wolfgang Wagner

          Da kann ich auch die YAML-Dokumentation empfehlen. Es lohnt sich, dass mal in Ruhe durch zu lesen. Dirk Jesse hat dazu auch ein Buch veröffentlich, in dem die dahinter stehende “Theorie” noch ausführlicher erklärt wird. Ebenfalls eine lohnende Lektüre.

        2. frywoj

          Template-> Root-> Konstanten-Editor-> PERFECTLIGHTBOX(27) auswählen.
          Der erste Punkt „Which Javascript Librarys to use?“ von protaculous auf zB jQuery ändern.
          Nun funktionieren die Effekte in Drop-Down Sitemap wieder.

  16. thefox

    Der Hauptgrund für eine zusätzliche Extension ist in diesem Video, das man die Unterseiten der Topnavigation nicht in der Sitemap sieht, weil diese Unterhalb einer Seite mit (nicht im Menü anzeigen) sind.
    Ebenfalls werden Seiten mit (nicht im Menü anzeigen) in der Sitemap nicht angezeigt. ( Was aus meiner Sicht Sinn macht ). Um das Problem ohne zusätzliche Extension zu lösen, kann man auch das TypoScript der Sitemap entsprechend anpassen, damit solche Seiten in der Sitemap angezeigt werden. Eine andere einfache Lösung ist, das unterhalb der Sitemap nochmal ein Menü mit dem Menütyp (Menü dieser Seiten) eingebunden wird und die gewünschten Seiten einzel hinzugefügt werden.

  17. Hanz Maaz

    Wenn ich die “Sitemap” im Tutorial nutze, muss ich “Perfekt-Lightbox”
    deinstallieren, weil sonst Perfekt-Lightbox aus einem mir nicht bekannten Grund versucht,
    die “Sitemap” zu laden. Schwarzer Schirm mit eingefrorenem Ladeversuch.
    Bin alle möglich Einstellungen im Konstanteneditor durchgegangen,
    oder auch versucht “perfektlightbox” nicht als Standard, sondern nur für spezielle Seiten
    zu verwenden – ohne Erfolg. Entweder “Sitemap” oder “Perfekt-Lightbox” – Schade!

  18. mimo

    Hallo,
    ich wollte gerne eine Sitemap anlegen damit Google meine Seite schneller checken kann.
    Ich habe mir das Addon: mc_googlesitemap downgeloadet und bin nach dem Tutorial vorgegangen:
    #####
    http://www.seo-typo3.org/2010/01/xml-sitemap-erstellen-in-typo3/
    ######
    Das tutorial hat super funktioniert, ich kann die Seite auch aufrufen, jedoch bekomme ich von Google wenn ich die Seite bei Webmaster Tools Sitemap einreichen möchte die Meldung:
    ######
    XML-Sitemap ist HTML
    Bei Ihrer XML-Sitemap handelt es sich offenbar um eine HTML-Seite. Bitte verwenden Sie stattdessen ein unterstütztes Format für XML-Sitemaps.
    ######
    Ich habe bis jetzt nur Leute gefunden die ähnliche Probleme hatten aber keine Lösung.
    Kennt jemand von euch vllt. eine Möglichkeit dies mit Typo3 zu beheben ?!
    Gruß

  19. mimo

    Danke für die schnelle Antwort!
    Ich habe die Extension seo_basics nun installiert wie in der Anleitung beschrieben:
    http://typo3.org/documentation/document-library/extension-manuals/seo_basics/0.7.0/view/1/2/
    Unter Roots habe ich Metatags and XML Sitemap (seo_basics) hinzugefügt.
    Könnten Sie mir sagen wo genau “seite.headerData.776 “Info” => “SEO Management” etwas sehen kann.
    (Ich habe den gleichen Aufbau wie in Ihren Tutorials)
    Gruß

    1. mimo

      Kleine korrektur, da habe ich etwas zu schnell Antworten gedrückt…

      Könnten Sie mir sagen wo genau „seite.headerData.776″ hinzugefügt werden muss damit man unter “Info” => “SEO Management” etwas sehen kann. Da ich den gleichen Aufbau wie Sie habe in den Tutorials müsste ich auch irgendwie wissen durch was “SEITE” in meinem Fall ersetzt wird.

      Danke

  20. s

    Hi
    zuerst, mal vielen dank fuer die Tutorials!
    Man koennte es auch ohne extensions so machen, dass man 2 Sitemaps hintereinander einfuegt (Menütyp Menü der Unterseiten der ausgewählten Seiten). Die erste von Home und zweite vom Topnav. Bei der 2. versteckt man noch die Beschriftung und es sieht auch nicht so schlecht aus…
    LG und vielen dank nochmals fuer die SUPER Videos

    1. Wolfgang Wagner

      Ja, es gibt viele Möglichkeiten, das zu machen. Das ist das interessante an TYPO3, es gibt oft viele Wege zu einem Ziel.

  21. Thomas

    Hallo Wolfgang,
    auch ich moechte mich erstmal bei dir fuer die Super-Tutorials bedanken!!!
    Bei dieser Lektion habe ich aber ein Problem: waehrend die Standard-Sitemap funktioniert, bekomme ich bei der dropdown_sitemap immer eine Fehlerseite … Das Plugin ist installiert, das statische Template unter ROOT eingerichtet, Standard-Sitemap geloescht, alles so gemacht, wie du’s machst (bilde ich mir zumindest ein).
    Ich hab das neueste stable typo3.
    Hast du eine Idee?
    Danke + Gruss,
    T

    1. Wolfgang Wagner

      Hm, was denn für ein Fehler? Ein paar Infos mehr wären schon hilfreich.

  22. Thomas

    Hallo Wolfgang,
    ein letzter verzweifelter Blick in’s Log hat Aufschluss gebracht: mein typo3 4.6 meckerte zwar nicht, als ihm die api_macmade fehlte, hat sie aber auch nicht automatisch geladen.
    Das hab ich jetzt nachgeholt und nun funzts! 🙂
    Gruss,
    T
    P.S.: kannst die Kommentare gleich loeschen
    P.P.S: Vielen vielen Dank nochmal fuer deine Zeit!

    1. Wolfgang Wagner

      Nee nee, die lösche ich nicht. Vielleicht hat ja jemand das gleiche Problem, dann findet er hier vielleicht die Lösung 😉

  23. Uslu

    Hallo,
    ich habe auch eine ähnliche Problem wie “nut” Javascript Kollision, aber ich habe eine javascript auf der Seitenlayout und andere ist der Extension “dropdown-sitemap”, habt ihr eine Lösung für mein Fall?
    Ansonsten muss ich sitemap rausnehmen.
    Danke im voraus..

    1. Wolfgang Wagner

      Verwendest du verschiedene Frameworks, also z.B. jQuery + Prototype oder so?
      Dann könntest du noch versuchen, beide im No Conflict-Modus aufzurufen, wobei ich jetzt natürlich nicht weiss, was du wo verwendest.

  24. Reasken

    Hallo,
    ich hoffe, ich finde hier zu meinem Problem noch eine Antwort.
    Und zwar habe ich die Dropdown-Sitemap bei mir installiert. Funktioniert auch wunderbar. Aber sobald ich die Extension “Scriptmerger” aktiviere, also sobald meine JS-Dateien gemerged sind, findet die Dropdown Sitemap die entsprechenden Funktionen nicht mehr und die Sitemap wird nicht mehr aufgeklappt.
    Hättest du eine Idee, wie ich dieses “Problem” umgehen kann? Aufgrund kürzerer Ladezeiten würde ich es schon gerne beibehalten, dass meine JS-Dateien gemerged bleiben.
    Vielen Dank im Voraus.

Kommentare sind geschlossen.