Ankündigung

Einklappen
Keine Ankündigung bisher.

[Tutorial] Menü Icons

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [Tutorial] Menü Icons

    moin moin,

    bislang habe ich keine Möglichkeit gesehen, den Menüpunkten individuelle Bildchen zuzuordnen. Darum hab ich dafür was gebastelt. Sollte es diese Möglichkeit bereits geben, so bitte ich um Mitteilung.
    Ob man das nun braucht oder nicht, ist eine andere Sache. Jenachdem wie man es einsetzt, kann eine Seite/ein Menü damit sehr verspielt aussehen. Aber wenn es gut gemacht ist, peppt es die Seite ein wenig auf.

    Als erstes diesen sql-Befehl ausführen (dabei den Tabellen-Präfix beachten!):
    Code:
    ALTER TABLE `contrexx_content_navigation` ADD `menu_icon` VARCHAR( 250 ) NOT NULL ,
    ADD `menu_icon_dyn` VARCHAR( 250 ) NOT NULL DEFAULT '';
    
    ALTER TABLE `contrexx_content_navigation_history` ADD `menu_icon` VARCHAR( 250 ) NOT NULL ,
    ADD `menu_icon_dyn` VARCHAR( 250 ) NOT NULL DEFAULT '' ;
    Anschließend den Anhang entpacken und per ftp auf den Server laden. Ich hab euch mal ein paar Icons (*.png) mit reingepackt zum ausprobieren.

    Einfaches Beispiel hier (ohne Bewertung )

    Wichtiger Hinweis: Dateien für Version 2.1!
    Angehängte Dateien
    Zuletzt geändert von weissnix; 16.09.2009, 11:14.
    denken erfordert die aktive Verwendung des Gehirns
    http://www.unser-zoohause.de || Tipp: Debuggen von Designs, Anleitung Themes

  • #2
    Hi,

    das funktioniert soweit jetzt ganz gut. Im ContentManager > erweiterte Optionen können im Bereich Navigation zwei verschiedene Icons angegeben werden.
    Dahinter steht auch der passende Platzhalter und was er ausgibt.
    Somit kann also auch das Anzeige-Verhalten auf der Seite ein wenig dynamisch gestaltet werden (Beispiel, Wechsel der Icons für active/inactive)

    Beispiel code der subnavbar.html
    Code:
    <!-- BEGIN navigation --><ul><!-- BEGIN level_2 --><li><a href="[[URL]]" class="[[STYLE]]" title="[[NAME]]" >[[MENU_ICON]][[MENU_ICON_DYN]] [[NAME]]</a></li><!-- END level_2 --><!-- BEGIN level_3 --><li class="level_3"><a href="[[URL]]" class="[[STYLE]]" title="[[NAME]]" >[[NAME]]</a></li><!-- END level_3 --><!-- BEGIN level_4 --><li class="level_4"><a href="[[URL]]" class="[[STYLE]]" title="[[NAME]]" >[[NAME]]</a></li><!-- END level_4 --></ul><!-- END navigation  -->
    Beispiel code der navigation.css (Auszug)
    Code:
    #left_navigation li img.icon_active, #left_navigation li img.iconDyn_inactive {
    visibility: hidden; width: 0;
    }
    #left_navigation li img.icon_inactive, #left_navigation li img.iconDyn_active {
    visibility: visible; vertical-align: middle;
    }

    PS: An einer Stelle hänge ich fest. Das zweite Bild lässt sich nicht über Doppelklick im FileBrowserfenster übernehmen. Großes Fragezeichen - hat sich erledigt; ich hatte ein 'id' vergessen.

    update: "leere" Bilder in IE und Opera werden unterdrückt
    Zuletzt geändert von weissnix; 17.05.2009, 22:38. Grund: update
    denken erfordert die aktive Verwendung des Gehirns
    http://www.unser-zoohause.de || Tipp: Debuggen von Designs, Anleitung Themes

    Kommentar


    • #3
      Danke für das Tutorial. Werd das oben festhalten!
      Forenregeln | Contrexx-Wiki | Contrexx-Themes

      Kommentar


      • #4
        Hallo Weissnix

        absolut genial und einfach zum einbinden. VIELEN DANK.

        Gruss
        Markus
        Phantasie ist wichtiger als Wissen, denn Wissen ist begrenzt.

        http://www.maesch.ch
        -be different-

        http://www.klaerli.ch


        Contrexx 2.2.6 ->vermurkst :-(

        Kommentar


        • #5
          Hallo Kaelin,
          ich habbe die database geupdate und alle files uberschreben. Aber nun gibt es keine content manager pagina mehr. Was habbe ich falsch gemacht?


          Gruße

          Emiel

          Kommentar


          • #6
            Hallo emiel_DC,

            welche Version von contrexx verwendest du? Dieses Tutorial und die files sind für Version 2.1
            In Version 2.1.1 habe ich das noch nicht getestet.

            UPDATE: Die Files können auch in Version 2.1.2 verwendet werden.
            Zuletzt geändert von weissnix; 16.09.2009, 10:40.
            denken erfordert die aktive Verwendung des Gehirns
            http://www.unser-zoohause.de || Tipp: Debuggen von Designs, Anleitung Themes

            Kommentar


            • #7
              Tolles Toll aber!

              Aber leider kann ich das nicht so übernehmen, da meine Backend datein und Frontent datein schon mit meinen Erweiterungen geändert sind.

              Also muss ich mir die einzelnen änderung manuel eintragen, da ich an Teamviewer 2 u. 3 modul schreibe.

              Und an Shoutcast,Scrolltext,Shoutbox, und noch ein paar anderen Modulen.
              Sind meine datein doch schon sehr unterschiedlich, und weichen stark vom standard ab.

              Aber ansonsten find ich das toll super.
              http://www.hsitt.at contrexx Version 2.2.2
              http://www.pikamail.at contrexx Version 2.1.3
              http://www.ctgraz.at contrexx Version 2.2.2
              Gold Partner Link H.S.I.T.T. Internet 2000

              Kommentar

              Lädt...
              X