Lightbox mit Artikel verlinken

Liebe Gemeinde,

auf meiner Startseite habe ich einen sehr langen Teasertext. Diesen möchte ich nun abschneiden und den Rest in der Lightbox (nach Klick auf [Weiterlesen]) anzeigen lassen.

Wie ist hier am besten vorzugehen?

Mein erster Versuch den fortlaufenden Text in einer neuen, versteckten Seite (Seitenstruktur) als Artikel abzuspeichern und auf diesen dann zu verweisen (siehe Screenshot) schlägt fehl.

LG

Der "Weiterlesen..."-Teil musst du als Link erfassen :)

Schau mal da: https://contao.org/neuigkeiten/items...t_2-8-RC1.html

"Hinzufügen von Videos und externen Inhalten"

Hi Toflar,

ah ok, aber dann müsste ich ja den Text in eine extra HTML-Datei kopieren oder? Das ist natürlich für den Kunden nicht wirklich pflegbar?!? Oder sehe ich das falsch?

LG

Pack einfach den kopletten Teaser in ein Div mit der ID "mb_xxx" und dann <a href="#mb_xxx" rel="mediabox" ...

Das Div dann natürlich mit display:none; verstecken

Hi Psi,

hmmh, das klingt wirklich verdammt lecker, aber leider bleibt meine Lightbox leer - ohne das ich den entsprechenden DIV auf "display:none" gesetzt habe.

Hier der HTML-Code:

HTML-Code:

---

[<a rel="lightbox[social 600 480]" href="#teaser_lightbox">mehr</a>]</p>

<div id="teaser_lightbox">
<p>Blindtext, Blindtext und nochmals Blindtext. Dieser sollte eigentlich in der Lightbox erscheinen.</p>
</div>

---

Verlinke ich über "rel=mediabox" springt der Screen lediglich runter zum DIV-Container, wie halt bei einem Anchor-Link auch.

Was mache ich falsch?

Hi,
ich klinke mich einmal ein, da ich ebenfalls an diesem Problem gerade hänge. Wenn ich rel="lightbox" angebe, dann wird ein iframe erzeugt. Ich würde gerne inline html nutzen. Die Mediabox kann dies ja scheinbar.

Linkadresse ist die ID, des html auf der Seite, was in der mediabox geöffnet werden soll.

vg,
john

Versuch mal das ganze als inline-content in einem HTML-Inhaltselement mit einem Insert-Tagzu realisieren.

HTML-Code:

---

<p><a rel="lightbox[inline 600 480]" href="#mb_inline">weiterlesen</a></p>
<div id="mb_inline" style="display: none;"> <span style="color: #999999; text-align: left;">{{insert_content::*}}<br /><br /> <a onclick="Mediabox.close();return false;">schliessen »</a></span></div>

---

Die ID des Divs MUSS mit mb_ beginnen! Sonst mag das Herr Mediabox nicht :cool:

Supi, mit der Bennenung des Div nach "mb_" hat'S geklappt! Merci!!!

Gibt es hierfür irgendwo eine Doku???

das Sternchen sollst Du ja durch die ID des entsprechenden Inhaltselement ersetzen. Das funktioniert bei mir auf jeden Fall.

Hallo zusammen

Ich habe im Zusammenhang mit lightbox und #mb_inline festgestellt, dass die lightbox sich nicht in der Höhe anpasst und mir somit Inhalt abschneidet:

http://etzbergpark.ch/test-123.html

HTML-Code:

---

<p><a rel="lightbox[inline]" href="#mb_inline">inline content »</a></p>
<div id="mb_inline" style="display: none;">
<div class="ce_image block">
<div class="image_container">
<a title="[lt]a href=" onclick="window.open(this.href); return false;" rel="lightbox" href="tl_files/inhalte/bilder/Architektur_2.jpg">
<img title="PDF downloaden" src="tl_files/inhalte/bilder/Architektur_2.jpg" alt="[lt]a href=" />
</a>
</div>
</div>
<span style="color: #999999; text-align: center;">This is an example of content that was hidden on the page, and opened in Mediabox using an anchor link.<br /><br />
<a onclick="window.open(this.href); return false;" href="tl_files/inhalte/pdfs/Etzbergpark Wohnungs-Grundrisse.pdf">PDF</a></span>
</div>

---

Aus irgendeinem mir nicht ganz klaren Grund passt sich die Höhe der lightbox nicht an.
Hat jemand einen Tipp?

Beste Grüsse
Nick


---> GELÖST

Konnte es mit Inhaltsänderungen der lightbox und mit CSS hinbiegen:

#mbCenter #mbImage
{
height:auto !important;
}