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

Shortcode mit display = "none" ausblenden

Dieses Thema im Forum "Onlineshop mit WordPress" wurde erstellt von miba, 8. Oktober 2018.

  1. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
    Hallo zusammen,

    habe eine Seite erstellt bei der per onclick Elemente eingeblendet werden die sonst mit display = "none"
    ausgeblendet sind. dies funktioniert mit Text oder Bildern super, wenn ich aber einen Shortcode verwende wird er dauerhaft angezeigt und lässt sich nicht ausgeblendet.

    Ist dies einfach nicht möglich oder gibt es einen Trick dafür?

    Danke und Grüße
    Michel

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  2. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Link zur Seite bitte.
     
  3. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    -- entfernt wegen Fehlinterpretation --
     
    #3 mensmaximus, 8. Oktober 2018
    Zuletzt bearbeitet: 8. Oktober 2018
  4. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
  5. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Mach aus den <p> Elementen divs. Der Shortcode bricht aus dem Paragraph aus und liegt derzeit nicht innerhalb des auszublenden <p>
     
  6. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
    habe aus den <p> divs gemacht aber jetzt werden die Elemente eines nach dem andern hinzugefügt aber nicht wieder ausgeblendet, und das Shortcode Element wird nicht richtig dargestellt
     
  7. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Der Javascript Code taucht in der Seite nicht mehr auf.
     
  8. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
    Den hab ich nicht verändert hier der effektive code der auf der Seite läuft
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  9. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    ("ebenen").getElementsByTagName("p"); geht bei divs natürlich nicht. Wie gesagt der Code ist nicht sehr modern und sollte komplett umgeschrieben werden. Ebenso die Art der Einbindung. Egal, Du weißt jetzt wo das Problem liegt (Shortcodes brechen <p> Tags) und kannst Dein Skript überarbeiten.
     
  10. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
    das <div> im Javascript Code habe ich wohl im eifre des Gefechts übersehen, habe es ergänzt und es läuft wieder nur das jetzt der Shortcod permanent ausgeblendet bleibt.
    du schreibst die Art der Einbindung sollte geändert werden hast du mir da eine Empfehlung?
     
  11. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Klar weil das auch divs sind und Du blendest ja alle divs aus. Arbeite mit Klassen als Slektoren, verwende ein Delegate Event, arbeite mit Objekten und data Eigenschaften schreibe den Code in eine eigene Datei, die Du mit wp_enqueue_scripts() über ein Childtheme einbindest.
     
  12. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
    dann Danke ich dir für deine Hilfe und werde deine Empfehlung versuchen umzusetzen

    Gruss
    Michel
     
    #12 miba, 8. Oktober 2018
    Zuletzt bearbeitet: 8. Oktober 2018
  13. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    1. Erstelle ein Childtheme
    2. Erstelle eine Datei mit Namen mmx-helper.js
    3. Kopiere folgenden Code in die Datei:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    4. Speichere die Datei im Verzeichnis des Childtehems ab
    5. Kopiere folgenden Code in die Datei functions.php des Childthemes
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    6. Entferne Deinen Javascriptcode aus Deinem Code ink. den onclick Events auf den Buttons
    7. Gib Deinen Buttons die CSS Klasse 'toggle-button'
    8. Entferne die Ebenen IDs von allen Elementen und gib den Elementen die Ein-/Ausgeblendet werden sollen die CSS Klasse 'toggle-layer'

    Das ist jetzt mal auf die schnelle gecodet, also keine Garantie für Fehlerfreiheit.

    PS: ich habe noch eine Data Eigenschfat vergessen um die Ebenen anzusprechen. Auf die Buttons muss also z.B. ein data-layer mit dem Namen der Ebene. Fang schon mal an, ich passe das Script an.
     
    SEpp55 gefällt das.
  14. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    So, den Code in 3 ersetzen durch

    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Vergiss die Punkte 6 und 7. Baue Dein Layout von folgendem Code neu auf:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  15. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
    Hallo und vielen Dank für deine arbeitet es funktioniert soweit gut und der Shortcode lässt sich ein und ausblenden, nur
    wird das Shortcode Element nun nicht richtig angezeigt.
     
  16. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Weil das WooCommerce CSS nicht geladen wird. Was passiert wenn Du das DIV mit dem Shortcode beim Laden anzeigen lässt?
     
  17. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
    die Produkte der Kategorie die mit dem Shortcode angezeigt wird sind aufeinander gestapelt.
    es läuft wider auf der selben Seite https://mi-pa.ch/test/
     
  18. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Bitte lies meinen Beitrag erneut.
     
  19. miba

    miba Active Member

    Registriert seit:
    16. Dezember 2017
    Beiträge:
    30
    Zustimmungen:
    2
    entschuldige dass habe ich als Frage verstanden.
    wenn ich richtig verstanden habe muss ich die CSS von WooCommerce hier rein bekommen oder sie mit style rein bekommen.
     
  20. mensmaximus

    mensmaximus Well-Known Member

    Registriert seit:
    24. Juli 2014
    Beiträge:
    8.857
    Zustimmungen:
    437
    Jetzt wird es aber zäh. Blende das DIV permanent ein und lade die Seite. Ich möchte wissen ob das CSS dann geladen wird.
     
  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