WBCE CMS Forum

bbs2

Mitglied

Link auf kompletten Container für einen Newseintrag

Hallo,

ich möchte einen Link auf den div des Newseintrags setzen und dafür den Button
"weiterlesen" und die Bildverlinkung wegfallen lassen.

Dies funktioniert im Ansatz gut, der Link als solcher lässt sich setzen.

Hier der code im "Beitrag Schleife":

<div class="newseintrag" >
<a href="[LINK]"><span class="link"></span> </a>
<div class="bild">[IMAGE]</div> 
<div class="kopf">[TITLE]</div> 
<div class="text">[SHORT]</div>
<div class="fuss">
<div class="datum">
[PUBLISHED_DATE]  
</div>
</div> 
</div>

Dazu die CSS

.link {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 1;
      }

display: block ist in der CSS ".Newseintrag" gesetzt.

Problem:

Auf meiner Testseite https://vlw-rlp.de/home-2-spalten-kopfbild/
sind 4 Newseinträge. Egal welcher Eintrag angeklickt wird, es erscheint immer der Langtext
zum 4. Eintrag.

Wird jedoch diese Verlinkung beseitigt und nur das Bild und der Button verlinkt, funktioniert die Seite.

Nach langem Probieren suche ich nun hierzu Hilfe.

Viele Grüße
Heinz

Beitrag geändert von bbs2 (20.08.2022 18:15:47)

bernd

Developer

Re: Link auf kompletten Container für einen Newseintrag

Verpasse mal der Klasse .newseintrag noch ein position:relative;
dann sollte es auch mit dem position:absolute aus .link funktionieren ...

Edit zur Erklärung:
position:absolute bezieht sich immer auf das übergeordnete Element das ebenfalls eine position-Angabe hat.
In deinem (Ursprungs)Fall wäre das der div #container
So stapel sich deine absolut positioniert spans alle übereinander und erstrecken sich über den ganzen container div.

Das Verhalten kannst du schön beobachten, wenn du dem .link mal einen auffälligen Rahmen gibst, z.B: border: 1px solid red;

Beitrag geändert von bernd (20.08.2022 19:54:17)

---

... nein in Europa verwenden wir beim Programmieren nicht € statt $ ...

bbs2

Mitglied

Re: Link auf kompletten Container für einen Newseintrag

Hallo Bernd,

super Hilfe. Es funktioniert. Wie in einer Uhr, fehlt ein kleines Rädchen,
hier im div ".Newseintrag" ein "Position: relative;" ,
dann funktioniert das Ganze eben nicht.

Vielleicht kann in einem Module-Update eine alternative Standardview mitgeliefert werden,
die den kompletten div verlinkt. Auf eine Verlinkung des Bildes und auf ein Linkbutton
kann dann verzichtet werden. Diese Form sieht man im Internet immer öfters,
sofern grundsätzlich hinter einem Shorttext ein Langtext steht (siehe z.B. tagesschau.de). Diese mitgelieferte
view wäre dann garantiert professioneller als meine view.
Danke.

Ich möchte zudem noch einmal an meinen Beitrag
https://forum.wbce.org/viewtopic.php?id=4055
für ein evtl. Modulupdate erinnern.

Viele Grüße
Heinz