Anker in Contao

[kubjo]

Hi Leute,
ich bin einigermaßen entsetzt: Wenn ich mich nicht irre, ist es in unserem geliebten contao nicht ohne Weiteres möglich einem CE einen Anker (echtes HTML) mitzugeben und diesen auch leicht (ohne inserttag o.ä.) von der schon geladeneen Seite aus anzuspringen. Die Lösung über "{{env::request}}#anker" lädt die Seite neu!

Ich hoffe ich täusche mich!

Grüße aus Ludwigsburg
Jochen Kubik

[Spooky]

Sollte ohne weiteres funktionieren. Poste einen Link zur Seite mit einem Beispiel.

[kubjo]

Hi Spooky,
ja, der insertag funktioniert im Prinzip, nur die Seite wird dann (unnötigerweise) nochmal neu geladen!
Aber ich würde das gerne einfacher haben: In jedem CE sollte ein Feld für einen HTML Anker vorhanden sein, den ich dann, wenn ich einen Link zu einer meiner eigenen Seiten einfüge, zur Auswahl bekomme.
Ich hoffe ich habe mich verständlich ausgedrückt!

Grüße aus Ludwigsburg
Jochen Kubik

[Spooky]

Das gibt es bereits . Die CSS ID ist der "Anker". So etwas wie <a name="…"> verwendet man nicht mehr (siehe https://www.w3schools.com/tags/att_a_name.asp).

Zu deinem anderen Problem musst du einen Link zur Seite posten, um das nachvollziehen zu können.

[kubjo]

Jetzt habe ich es geschafft!
Klasse! Für alle die hier her kommen:

- Anker setzen: in der CSS ID z.B. "anker1" eintragen
- Im Fließtext einen Link einfügen, auf die entsprechede Seite (kann auch die gedade aktuelle sein)
- Hinter dem Link einfach "#anker1" einfügen
Fertig!

Danke Spooky für Deinen Unterstützung!

Grüße
JK

[wincla]

Hallo zusammen,

als Contao-Neuling freue ich mich sehr darüber, dass ich hier endlich fündig geworden bin, wie man auf einer Seite zu einem bestimmten Abschnitt/Artikel springen (und trotzdem weiterhin scrollen) kann.
Mit kubjo's Anleitung habe ich es geschafft in meiner 4.4.16-Version einen Anker zu setzen und dann dorthin zu verlinken.
Klinkt man nun auf den Link, springt der Abschnitt an den obersten Seitenrand, in meinem Fall unter die Menu-Leiste, so dass diese die anvisierte Ankerstelle verdeckt.
Gibt es hierfür einen "Trick" wie man nach etwas weiter unten springen könnte, z.B. in das obere Viertel der Seite?
Oder muss man sich hierzu anderweitig behelfen, in dem man die Anker weiter oben setzt?
Meine nächste Frage wäre dann inwiefern diese "Notlösung" noch responsive ist?
Ich hoffe, ich habe mich nicht allzu missverständlich ausgedrückt und bedanke mich im Voraus für Eure Hilfe.

Vielen Dank
Claudia

[McMatty]

Hallo Jochen und Spooky

Eben bei mir aufgetauchte Anforderung und hiermit auch schon wieder gelöst.

Dank an euch!

LG
McMatty

[Hoch-3]

Anker von einer auf die andere Seite rauschen (nicht immer!) an der ID vorbei.

<a href="{{link_url::x}}#ankername">Ankerlink</a>

Das funktioniert, eigentlich.

Aber! Je weiter unten die id="ankername" ist, desto eher rauscht der Anker-Link ganz an den Schluss der Seite. Und zwar auf allen Browsern...

Weiss jemand wie man das verhindern kann?

[Spooky]

Aber! Je weiter unten die id="ankername" ist, desto eher rauscht der Anker-Link ganz an den Schluss der Seite. Und zwar auf allen Browsern...

Ja, weil gewisser Inhalt ja erst vom Browser nachgeladen wird (zB Bilder) und sich dann die Höhe des Inhalts ändert.

[Hoch-3]

Ja, weil gewisser Inhalt ja erst vom Browser nachgeladen wird (zB Bilder) und sich dann die Höhe des Inhalts ändert.

Zum Beispiel Accordions?



Darf ich kurz das Beispiel schicken?

http://pflegekind.hoch3.ch/home.html


Unter Aktuell gibt es zwei Links.

Der erste "Infos dazu hier" verweist auf eine ID ziemlich am Anfang der Seite, auf die Anker-Subnavigation.
Der zweite "hier" verweist auf die ID "regionaler-austausch" Das ist ein Artikel gegen Ende der Seite, der Anker rauscht aber daran vorbei. Manchmal hält er kurz und rast dann weiter, manchmal bleibt er auch stehen.

Ist die Lösung tatsächlich, dass wir nur auf die Anker-Navigation verweisen?

[Hoch-3]

Zum Beispiel Accordions?



Darf ich kurz das Beispiel schicken?

http://pflegekind.hoch3.ch/home.html


Unter Aktuell gibt es zwei Links.

Der erste "Infos dazu hier" verweist auf eine ID ziemlich am Anfang der Seite, auf die Anker-Subnavigation.
Der zweite "hier" verweist auf die ID "regionaler-austausch" Das ist ein Artikel gegen Ende der Seite, der Anker rauscht aber daran vorbei. Manchmal hält er kurz und rast dann weiter, manchmal bleibt er auch stehen.

Ist die Lösung tatsächlich, dass wir nur auf die Anker-Navigation verweisen?

Es sind tatsächlich die Accordions, die diese falsche Position der Ankerlinks verursachen. Vor dem ersten Accordion klappst, nachher nicht mehr.

Hat jemand eine einfache Idee, wie man trotzdem auch nach geschlossenen Accordions, auf die richtige Position verweisen kann?
Zur Präzisierung. Anker innerhalb der Seite funktionieren richtig. Es betrifft nur Links mit Anker von einer anderen Seite her.



Hat niemand eine Idee, wie man das lösen könnte?

[Justd]

Hallo Leute,
Ihc habe eine Contao 4.9 und in der Startseite mehrere Artikel-Elemente.
In einem der unteren Element, gibt es 2 Inhaltselemente (in dem Fall jeweils eine Tabelle)

Ich möchte jetzt im 3. Element auf der Seite im Text einen Link zum 8. Element (dort im 2. Inhaltselement) springen.

Ich habe es schon mal mit {{article::1204}} versucht, was die ID des 2. Inhaltselements ist. Aber leider funktioniert das so nicht.
Denn wenn ich bei dem Artikel oben, den Link anschaue, dann ist da nur die URL, der Hauptseite zu sehen. Nichts vom Artikel-Inhaltselement zu sehen.

Darf ich mal fragen, wie das genau aussehen muss?

[planepix]

Hallo Justd,

ergänze in der Tabelle, zu der du den Sprunglink setzen möchtest, im Feld CSS ID den Anker; z.B. #anker1.
Dann erstellt du den Link auf die Seite, in der die Tabelle ist - Das kannst du direkt im Picker auswählen.
Und dann ergänzt du den Anker in der URL.

Wäre dann etwas:

{{link::ID-der-Seite}}#anker1

[Justd]

@Planepix.. und die Seite wird NICHT neu geladen.. oder doch?

ach.. soo?

{{link::*}} Dieses Tag wird mit dem HTML-Code für einen Link ersetzt. Der Parameter kann entweder die ID oder der Alias einer Seite sein, auch eine absolute URL ist möglich.

Hatte mich nach dem hinweis gerichtet, aus dem Link: https://docs.contao.org/manual/de/ar...g/insert-tags/

{{article::*}} Dieses Tag wird mit einem Link zu einem Artikel ersetzt (ersetze * mit der ID oder dem Alias).

Mist, ich habe schon eine CSS-ID, weil ich die Tabelle speziell formatieren wollte.
Dann müßte ich es auf Class umstellen, damit ich die CSS-ID frei bekomme.

[planepix]

Du kannst doch, mit einem Leerzeichen, eine weitere ID eintragen

[Justd]

Das hier hat dann bei mir funktioniert... und es wird einfach runter gescrollt.. genau wie ich es wollte. DANKE planePix

{{link_url::91}}#versammlung steht im Linkfeld

Im Artikel habe ich vom TinyMCE, das Flag benutzt..
da brauchte ich gar nicht über die CSS-ID zu gehen.

Also ein 2. Weg, der möglich ist. Dennoch danke.

[zonky]

{{env::request}}#versammlung 

wenns auf der selben Seite ist

[norbert]

Habe festgestellt, dass im contao 4.9 die Anchor Funktion im TinyMCE fehlt. (Wieso eigentlich?) Wollte es nun erweitern und war in den Docs https://www.tiny.cloud/docs-4x/plugins/anchor/ und hab alles so eingetragen wie es dort steht. Leider kam dann die folgende Warnung im Backend im ce_text Element:

Failed to load plugin: anchor from url https://neu.truleccreation.de/assets.../plugin.min.js

Also hab ich in dem Ordner nachgeschaut. Und ja, der Ordner und die Datei fehlen. Leider kann man die bei https://www.tiny.cloud auch nicht herunterladen. Irgendwie unlogisch das Ganze. Weiß da jemand wie man das hinbekommt? Oder muss man für so eine Kleinigkeit echt jetzt die Erweiterug "cliffparnitzky/tiny-mce-anchor" installieren?

[zonky]

damit mal probiert?
https://github.com/cliffparnitzky/TinyMceAnchor

[Findarato]

Sorry, ich muss das Thema noch mal aufwärmen.

So habe ich den Anker gesetzt:

?<a class="btn" href="{{link_url::{{page::33|urlattr}}|urlattr}}#karriere-form">mehr</a>

Zum einen setzt Contao nach dem Speichern des Artikels 2 x "|urlattr" ein. Zum anderen funktioniert das nicht so, wie gedacht. Statt auf der selbern Seite zum Anker zu springen, lädt sich die Startseite.

Was mache ich falsch? Woran kann es liegen?

Danke und Grüße, Jörg

[derRenner]

{{link_url::33|urlattr}}#karriere-form

sofern deine Ziel-ID die 33 ist, sollte das so ausreichen

[Findarato]

{{link_url::33|urlattr}}#karriere-form

sofern deine Ziel-ID die 33 ist, sollte das so ausreichen

Leider nicht. Ich habe nochmal ein wenig ausprobiert, aber er spring mir immer auf die Startseite und nicht zu dem Artikel auf der gleichen Seite.

[mandrake]

Hast Du eine mehrsprachige Website?

Gesendet von meinem Redmi Note 9 Pro mit Tapatalk

[Findarato]

Hast Du eine mehrsprachige Website?

Gesendet von meinem Redmi Note 9 Pro mit Tapatalk

Nein, eigentlich nicht.

[MacKP]

Hallo
einen Anker-Link auf der gleichen Seite kannst du am besten mit {{env::request}} machen -> https://docs.contao.org/manual/de/ar...bungsvariablen
Also:

{{env::request}}#karriere-form

Warum das bei dir allerdings auf die Startseite springt könnte daran liegen, dass du eventuell nen 404 bekommst, du den aber auf die Startseite weiter leitest. Aber das ist jetzt einfach geraten...
Eventuell könntest du mal in den Quellcode schauen, was dir Contao da für eine URL generiert damit du da etwas mehr erkennen kannst, was da passiert.

Viele Grüße

[Findarato]

Damit passiert nichts. Der Link wird erkannt, aber ein Klick bewirkt nichts.

Im Seitenquelltext steht jetzt folgendes:

<a class="btn" href="karriere.html#karriere-form">mehr</a>

Wenn ich über "Link einfügen/bearbeiten" gehe, kann ich ja auch einen Artikel verlinken. Dann wird dieser geladen, aber auch nur dieser. Alle anderen Artikel sind hier nicht vorhanden. Ist wahrscheinlich auch so gedacht, aber bringt mich auch nicht weiter.

[MacKP]

Wenn ein Klick nichgts bewirkt, ist dann überhaupt die ID 'karriere-form' irgendwo vorhanden?
Gib uns einen Link zu der Seite, dann können wir da mal schauen...

Viele Grüße

[zonky]

vllt. wäre die Bekanntgabe der Seite/Link ein Trick...

[Findarato]

Moin und sorry.
Manchmal steht man auf der Leitung. Ich habe wirklich eine Klasse eingetragen, statt eine ID.
Das ist ziemlich doof. Mir ist es nicht aufgefallen.

Also, tausendmal Entschuldigung.

Jörg