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

WP 5.x WooCommerce Produktübersicht verlinken

Dieses Thema im Forum "Allgemeines" wurde erstellt von jackomo89, 21. Februar 2019.

  1. jackomo89

    jackomo89 Active Member

    Registriert seit:
    4. Juni 2018
    Beiträge:
    41
    Zustimmungen:
    0
    Hallo ihr Lieben,

    ich habe noch mal eine Frage zu meiner Website.
    Wenn man beispielsweise auf https://o-schell.de/product-category/rotwein/ klickt, würde ich ganz gerne das gesamte Produktbild verlinken und nicht nur den Produktnamen.

    Habe da ein paar mal einen Probelauf mit Testpersonen gemacht und die meisten haben nicht gesehen, dass man erst auf den Namen bzw. den Produkttitel klicken muss, um weitere Informationen zu den einzelnen Produkten zu erhalten.

    Besteht da irgendwie nie Möglichkeit, auf diese Kategorieseite beispielsweise via FTP zu gelangen, um dann das gesamte Bild zu verlinken?

    Vielen Dank schon mal :)
     
  2. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Das Bild ist verlinkt. Durch den Hovereffekt wird aber ein Layer über die unteren 3/4 des Bildes geschoben, wodurch der Link verdeckt wird. Man kann den Link auf dem Titel absolut positionieren und über die gesamte Fläche des Bildes ziehen:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Das padding wird benötigt, weil der Titel aus dem Flow genommen wird und sonst bis an den Rand des Bildes laufen kann.

    Natürlich muss man noch prüfen wie das bei kleinere Auflösungen aussieht.
     
  3. jackomo89

    jackomo89 Active Member

    Registriert seit:
    4. Juni 2018
    Beiträge:
    41
    Zustimmungen:
    0
    Vielen Dank, das funktioniert super... Ich gucke mir das jetzt noch mal bei der mobilen Ansicht an, aber auf der Desktop Version funktioniert das sehr gut :)
     
  4. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Funktioniert aber nur in der Thumbnail Ansicht. In der Listenansicht ist das Layout kaputt. Bitte die CSS Regel ersetzen durch:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Diese Regel wirkt nur in der Thumbnail Ansicht.
     
    jackomo89 gefällt das.
  5. jackomo89

    jackomo89 Active Member

    Registriert seit:
    4. Juni 2018
    Beiträge:
    41
    Zustimmungen:
    0
    Vielen Dank, dass du dir da so eine Mühe gemacht hast :)
    Wirklich, Tausend Dank:)

    Ich will deine Freundlichkeit jetzt nicht überstrapazieren, ich habe da nur noch zwei Fragen...

    Wenn man über die Bilder drüber geht, also der Hover- Effekt, dann wird da so ne komische Klammer angezeigt. Weißt du ob und wenn ja, wie ich das ändern kann?
    Also für das erste würde das auch reichen mit der Klammer, Hauptsache man sieht, dass da dann irgendwas passiert.
    Alternative dachte ich, dass anstelle der Klammer ein Text erscheint "mehr Informationen" oder so.

    Dann habe ich noch eine zweite Frage:
    Wenn man auf ein Produkt geklickt hat, gibt es da keinen Button für zurück. Könnte man da noch einen irgendwo einfügen?
    Ich dachte schon mal, wenn man im Template unter oder über dem Produktbild einen Button platziert. Dieser sollte aber dann zur vorherigen Seite verweisen.
    Ist sowas Grundsätzlich möglich?

    Wie schon gesagt, ich möchte jetzt deine Freundlichkeit nicht ausnutzen oder überstrapazieren :)
    Ich bin dir wirklich sehr sehr dankbar schon für die Hilfe mit der verlinkung des Bildes, der Rest sind mehr so Feinheiten :)
     
  6. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Ich sehe keine Klammer beim Überfahren (hover) der Bilder. Lösche mal Deinen Browsercache und deaktiviere das Plugin Autoptimize. Falls das nichts bringt mache bitte einen Screenshot und markiere dort diese Klammer.

    Bezüglich des Buttons kannst Du natürlich bei jedem Produkt einen in den Content mit einfügen. Du kannst auch mittels einer Funktion in der functions.php eines Childthemes so einen Button bei allen Produkten einbauen:

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
    jackomo89 gefällt das.
  7. jackomo89

    jackomo89 Active Member

    Registriert seit:
    4. Juni 2018
    Beiträge:
    41
    Zustimmungen:
    0
    Ach krass, das ging ja "schell und leicht" mit dem Button, ich dachte, das wäre aufwändiger...

    Auch wenn ich mich wiederhole, auch hier noch mal für deine Hilfe mehr als Tausend Dank :)

    Hier ist übrigens diese Klammer, von der ich gesprochen habe (Autoptimize ist grade deaktiviert):
     

    Anhänge:

  8. SirEctor

    SirEctor Well-Known Member
    Ehrenmitglied

    Registriert seit:
    28. Oktober 2008
    Beiträge:
    12.361
    Zustimmungen:
    427
    Bzgl. der Klammer versuch mal das
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Edit:
    für einen Text anstelle der Klammer, ginge sowas:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
    jackomo89 gefällt das.
  9. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Ach das Ankerbild. Ich habe nach eine [] oder {} oder () gesucht.
     
  10. jackomo89

    jackomo89 Active Member

    Registriert seit:
    4. Juni 2018
    Beiträge:
    41
    Zustimmungen:
    0
    Perfekt :) Ich hatte bisher folgendes Versucht:

    .hover_icon_link:hover{
    content:"MEHR ERFAHREN";
    }


    das hatte aber nie funktioniert... Aber dein Code klappt :)

    Ich danke euch wirklich für eure Hilfe!!!!!!
     
  11. SEpp55

    SEpp55 Well-Known Member

    Registriert seit:
    3. Februar 2016
    Beiträge:
    3.138
    Zustimmungen:
    591
    Ich will jetzt nicht Fehler suchen, aber das springt mir ins Auge ;)

    upload_2019-2-22_16-12-54.png

    Im Customizer unter Design - Zusätzliche CSS mit folgendem Code zu beheben.

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
    jackomo89 gefällt das.
  12. jackomo89

    jackomo89 Active Member

    Registriert seit:
    4. Juni 2018
    Beiträge:
    41
    Zustimmungen:
    0
    @mensmaximus: Tut mir leid, das lag wohl an meiner nicht so idealen Beschreibung meines Problems :D. Das Ankerbild ist aber richtig... Das funktioniert jetzt erst mal alles gut :)

    @SEpp55 Vielen Dank, dass du dir die Seite noch mal angeguckt hast :)
    Das ist wirklich super lieb - gerne kannst du mich auf Fehler hinweisen; darüber bin ich ja sehr dankbar.
    Bisher habe ich das noch nicht gesehen, dass es bei mir "normal" angezeigt wird.

    Ich habe grade gesehen, wenn ich viele Produkte im Warenkorb habe und dann auf diesen klicke (oben rechts), dann kann ich in diesem nicht mehr scrollen. Ich hoffe, dass ich verständlich erklärt habe :D:D:D
    Ich wollte jetzt erst mal noch einen Button zum Menü hinzufügen, über den man direkt zum Warenkorb kommt.
    Aber würde auch die Möglichkeit bestehen, den Warenkorb "scrollable" zu machen?
     
  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.
    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.
    Information ausblenden