1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Menü: Bilder bei Mouseover in der Navigationsleiste

Dieses Thema im Forum "Design" wurde erstellt von walinjo, 28. Juni 2010.

Seite 1 von 2
  1. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    Hallo liebe Wordpressler, ich hoffe ich kann auf euch zählen.
    Bei Wordpress 2.9 war es kein Problem mithilfe des Hover-Plugins einen Hovereffekt mit einem Bild zu erzeugen, indem man bei der Kategorie-beschreibung einfach einen gesonderten IMG-Tag reingehauen hat => super.
    Bei Wordpress 3.0 sieht das jetzt anders aus. Ich habe zwar diesen tollen Menü-builder und kann sogar ein HTML-Attribut title (optional) einfügen, was ja eigentlich dafür gedacht ist einen tollen hovereffekt sehr einfach für jedermann zu gewährleisten, doch leider gehen jetzt die Bilder nicht mehr.
    Egal wie ich den Img-Tag bei dem HTML-Attribut eingebe, es kommen keine Bilder. Außerhalb der Navigationsleiste, in den Seitenwidgets, greift weiterhin das Hover-Plugin und ich hab meinen gewünschten Effekt, aber wie bekomme ich wieder Bilder beim Mouseover in der Menüleiste. Hilfe bitte
     
    #1 walinjo, 28. Juni 2010
  2. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Wozu ein Plugin, wenn es doch auch rein mit CSS geht?

    Gib den Menüeinträgen bei der Generierung doch einfach die WP-ID der Seite/Kategorie als ID* mit und schreibe eine passende CSS-Deklaration.

    Gruß
    Mo

    *Da IDs nicht rein aus Zahlen bestehen dürfen, muss der von WP übergebenen ID mindestens ein Buchstabe voran gestellt werden.
     
    #2 Morris, 28. Juni 2010
  3. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    ich hab nicht ein wort verstanden :neutral:
    kannst du das nochmal für doofe erklären? Also was muss ich da eintragen? Wo muss ich was ändern, damit es auch ohne plugin funzt?
     
    #3 walinjo, 28. Juni 2010
  4. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Da ich keine Ahnung habe wie du auf deiner Seite dein Menü zusammenbaust und wie groß deine Kenntnisse bzgl. HTML, CSS und PHP sond hier eine recht allgemein gehaltene Erklärung:

    Jeder Beitrag, jede Seite und jede Kategorie bekommen von Wordpress intern eine ID zugeordnet. Diese ID kann man im Template via Template Tags und PHP ausgeben lassen.

    Auch HTML und CSS kennen IDs.

    Wenn man nun die WP-ID zu einer HTML-ID macht kann man diese per CSS direkt ansprechen und ihm so ein Hintergrundbild inkl. Mouseover zuordnen. Das könnte z.B. so aussehen:
    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Gruß
    Mo
     
    #4 Morris, 28. Juni 2010
  5. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    uff
    ne, sorry, ich steh grad total auf dem schlauch.
    ich versteh den zusammenhang zu ner navigationsleiste nicht, bzw. den html code nicht, wo ich dem link einen namen geben soll.
    <a href="example.htm" id="wp_1234">Ein Menüeintrag</a> du kennst doch sicher diesen wp 3.0 menubuilder, wo man ganz easy dem link einen "alt"-text, ein attribut geben kann. Warum kann man da kein Bild zuordnen, wo ist da der Haken?
     
    #5 walinjo, 28. Juni 2010
  6. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Kannte ich bisher nicht, hab ich mir grade mal angeschaut. Nimmt dir augenscheinlich aber schon ein bisserl Arbeit ab.

    Den Menüelementen werden schon die passenden IDs mitgegeben (wenn auch nicht die WP-IDs):

    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Jetzt musst du nur noch in deiner CSS-Datei einen entsprechenden Eintrag (s.o.) machen.

    Gruß
    Mo
     
    #6 Morris, 28. Juni 2010
  7. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    habe nun in die allesüberschreibende user.css folgendes eingetragen was ich im seitenquelltext gefunden hab
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    (also hab ein xbeliebiges bild genommen)

    leider passiert garnichts. muss ich irgendwo noch wie was eintragen? :confused: was mach ich falsch..eventuell beim html-attribut im Menubuilder?
     
    #7 walinjo, 28. Juni 2010
  8. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Deine CSS-Definition trifft auf ein nicht vorhandenes Element zu.

    Wordpress gibt LI-Element die ID, nicht dem A-Element.
    Entweder deklarierst du:

    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Hiermit spricht du das A-Element als Kindelement des LI-Elements mit der ID "menu-item-302" an.

    oder

    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Hier bekommt das LI-Element das Hintergrundbild.

    oder

    HTML:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Hier würde jedes Element mit der ID "menu-item-302" ein Hintergrundbild bekommen.

    Gruß
    Mo
     
    #8 Morris, 28. Juni 2010
  9. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    wir sind nah dran, aber ich glaube wir haben uns von vorneherein falsch verstanden.
    ich möchte kein hintergrundbild beim mouseover, sondern eine art popup nebendran, sodass man das ganze bild sieht und nicht nur ein wenig.
    weißt du wie das funktioniert?

    http://www.moneytreesystems.com/css/picpopup.html#
    ungefähr so wie hier, nur, dass ich nicht über ein bild fahre sondern über einen link..und dann soll ein bild aufpoppen.
     
    #9 walinjo, 28. Juni 2010
    Zuletzt bearbeitet: 28. Juni 2010
  10. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Ja, das ist natürlich was anderes...aber auch machbar, wenn auch ungleich komplizierter. Nächstes Mal gleich ein Beispiel mitgeben.

    Dazu musst du die Ausgabe von wp_nav_menu() anpassen.

    Ich würde es mit $after probieren
    PHP:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Mittels CSS passt du die A- und die SPAN-Elemente an:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Damit erreichst du, dass die SPAN-Elemente innerhalb des A-Elements erst beim Mouseover sichtbar werden.

    Mittels

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    definierst du nun die entsprechenden Bilder.

    Gruß
    Mo
     
    #10 Morris, 28. Juni 2010
  11. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    ok, wenn du mir jetzt noch konkret sagst wo ich den php code eingeben soll, denke ich dass wir es geschafft haben :grin:
     
    #11 walinjo, 28. Juni 2010
    Zuletzt bearbeitet: 28. Juni 2010
  12. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Ich kann nur vermuten, dass das bei dir in der "header.php" steht.
    Je nach verwendetem Theme und Autor kann das sehr unterschiedlich sein.

    Zumindest im WP 3.0 Standard Theme "twentyten" ist es in der "header.php" in Zeile 73 zu finden. Hier muss der Eintrag ergänzt und nicht ersetzt werden.

    Gruß
    Mo
     
    #12 Morris, 28. Juni 2010
  13. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    PHP:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    hab das hier in der header.php gefunden
    ich benutze das arrastheme.
    meinst du du weißt wie ich das da reinbauen muss? mag da nix kaputt machen
     
    #13 walinjo, 28. Juni 2010
  14. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Das Theme kenn ich nicht.
    Theoretisch müsste es reichen diese Zeile zu ergänzen:

    PHP:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    PHP:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Gruß
    Mo
     
    #14 Morris, 28. Juni 2010
  15. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    :(
    hab jetzt nur unter jedem link einen fetteren weißen streifen, von dem bild keine spur..^^
     
    #15 walinjo, 28. Juni 2010
  16. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Hast du mal den Link zu deiner Seite? Meine Glaskugel gibt nämlich so langsam den Geist auf.

    Gruß
    Mo
     
    #16 Morris, 28. Juni 2010
  17. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    $after bringt hier scheinbar nicht den gewünschten Erfolg, da bei dir das SPAN-Element erst hinter das A-Element geschrieben wird und nicht wie ich vermutet hatte in.

    Komisch...dafür sollte doch laut doku $link_after zuständig sein.

    Du könntest probieren deine CSS entsprechend anzupassen:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Gruß
    Mo
     
    #17 Morris, 28. Juni 2010
  18. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    leider nix :(
    nada
    totgeburt
    mag nicht :neutral:
     
    #18 walinjo, 28. Juni 2010
  19. Morris

    Morris Well-Known Member

    Registriert seit:
    27. Mai 2006
    Beiträge:
    1.560
    Zustimmungen:
    0
    Probier mal das hier

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Gruß
    Mo
     
    #19 Morris, 28. Juni 2010
    Zuletzt bearbeitet: 28. Juni 2010
  20. walinjo

    walinjo Well-Known Member

    Registriert seit:
    23. April 2010
    Beiträge:
    69
    Zustimmungen:
    0
    nope

    immer noch der dicke weiße balken.. :neutral:
    ich glaub ich geb das auf, auch wenn es ultra schade ist
     
    #20 walinjo, 28. Juni 2010
(Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können. )
Seite 1 von 2
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Akzeptieren Weitere Informationen...
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Akzeptieren Weitere Informationen...
    Information ausblenden