Teile vom Beitrag aufklappen/einfahren

neontrauma

Hej,

ich bin auf der Suche nach einer Ajax-Lösung für folgenden Problem:
innerhalb eines Beitrags stehen mehrere Links in einer Liste - klickt man einen Link an, soll ein kurzer Text ausfahren und auch wieder einfahrbar sein.
Die more-Funktion fällt da raus, weil es ja mehrere Links pro Beitrag sind.

Mir fällt nur eine etwas umständliche Lösung ein, bei der ich den jeweiligen Inhalt aber immer in die JS-Datei eintragen müsste... und das kann ja nicht Sinn der Sache sein.

Gibt es da ein Plugin (oder ein Skript, was man ohne größere Probleme mit Wordpress verquicken kann)?

Lieben Gruß
neontrauma

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Ammaletu

Also das ist IMHO ein ganz klassischer Anwendungsfall für jQuery. Sowas kann man damit in wenigen Minuten basteln. Allerdings müsstest Du dann in den Beiträgen etwas im Quelltext arbeiten.

Ok, hier erstmal der Link zur jQuery-Doku:
Effects/toggle - jQuery JavaScript Library

Ok, sagen wir mal, Du hast im Beitrag folgendes stehen:

PHP

<span class="toggleLink">Hier klicken</span> <span class="hidden">Ich bin unsichtbar.</span>

WordPress würde das Ganze dann ja noch in ein p-Eleemnt verpacken, wenn davor und danach eine Leerzeile steht. Statt span kannst Du sicher auch passendere Elemente benutzen, je nachdem, was Du inhaltlich darstellen willst. Falls Du TinyMCE benutzt, musst Du aber schauen, dass der Dir Deine Elemente nicht wegzappt.

Ok, ins Stylesheet kommt dann folgendes:

Code

.toggleLink {
  /* Link-Formatierung hier ergänzen */
}


.hidden {
  display: none;
}

Damit wird der Text beim Laden der Seite nicht angezeigt. Und dann müsstest Du noch eine JS-Datei in Dein Theme einbinden mit folgendem Inhalt (jQuery muss natürlich auch eingebunden werden):

Code

/**
 * The following is jQuery functionality that will be executed as soon as the
 * DOM is ready (roughly equal to onload).
 */
jQuery(function($) {
  $(".toggleLink").click(function() {
      $(this).next(".hidden").toggle();
    });
});

Damit wird der versteckte Text beim Klick auf den "Link" an- und wieder ausgeblendet. Ohne JS sehen Deine Besucher den Text nicht, ohne Stylesheet sehen sie ihn immer.

neontrauma

Ah, klasse - funktioniert, dankeschön. :)

Ich hatte vorher mit mootools herumexperimentiert, was aus mir unerfindlichen Gründen nicht mit WordPress laufen wollte - fein, dass jQuery nicht so zickt. ;)

Lieben Gruß
neontrauma

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Teile vom Beitrag aufklappen/einfahren

Jetzt mitmachen!