Startseite
  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche
Startseite › Forum › Drupalcenter.de › Module ›

CSS Klasse setzen für das Ziel eines Ankers

Eingetragen von TDI (47)
am 17.04.2015 - 10:43 Uhr in
  • Module
  • Drupal 7.x oder neuer

Hi,

ich benötige das Setzen einer CSS Klasse für diese sogenannten Anker auf einer Buchseite. Ähnlich wie im Word kann man ja auf Textstellen innerhalb des Dokuments resp. einer Buchseite im Drupal verlinken.
Man klickt also irgendwo ziemlich weit oben auf der Seite ein Link und springt an das definierte Ziel auf der gleichen Seite.
Im Standard benutze ich TinyMCE 3.5.11 und CK Editor 3.6.6. Für beide ist das "Link" und "Anker" PlugIn aktiv.

Das Problem ist, dass ich am Ziel, also dort wo jeweils das Ankersymbol eingefügt wird, eine CSS Klasse brauche.

So sieht der HTML Code jetzt aus:

Absprung:

<p><a href="#localanchor1" title="Test">Das ist der verlinkte Text (Absprung)</a></p>

Ziel:
<p><a name="localanchor1">Zieltext</a></p>

Das würde ich mir nun eben wünschen:

Absprung:

<p><a href="#localanchor1" title="Test">Das ist der verlinkte Text (Absprung)</a></p>

Ziel:
<p><a name="localanchor1" class="anchor">Zieltext</a></p>

Natürlich kann man diese Klasse nachträglich bei jedem bereits erstellten Link einbauen, das ist das eine, aber ich will das diese Klasse bei jedem zukünftigen lokalen Link automatisch hinzugefügt wird.
Leider bieten beide Editoren kein Klassenattribut für das Ziel des Ankers - immer nur für den Absprungpunkt, da brauch ich das aber nicht ....

Hat jemand da eine Idee?

TDI

‹ Modul für blätterbares PDF CSS Klasse setzen für das Ziel eines Ankers ›
  • Anmelden oder Registrieren um Kommentare zu schreiben

per jquery add class bei a

Eingetragen von caw (2698)
am 17.04.2015 - 10:58 Uhr

per jquery add class bei a name

C.A.W. Webdesign

  • Anmelden oder Registrieren um Kommentare zu schreiben

ok, das war ein kurzes statement ... ;-)

Eingetragen von TDI (47)
am 17.04.2015 - 11:32 Uhr

kannst du das eventuell ein wenig genauer erklären, wie das geht ... ich finde zu dem Thema unzählige Beispiele im Netz, aber wo binde ich das Javascript ein... sorry, bin leider kein Webentwickler und bin da ein wenig ratlos

  • Anmelden oder Registrieren um Kommentare zu schreiben

da müßte ich jetzt auch

Eingetragen von caw (2698)
am 17.04.2015 - 12:52 Uhr

da müßte ich jetzt auch erstmal suchen

C.A.W. Webdesign

  • Anmelden oder Registrieren um Kommentare zu schreiben

Zitat: ich finde zu dem

Eingetragen von torfnase (1491)
am 17.04.2015 - 15:50 Uhr
Zitat:

ich finde zu dem Thema unzählige Beispiele im Netz, aber wo binde ich das Javascript ein

auch dazu findest zu unzählige Anleitungen im Netz.

Hier nur ganz kurz:
in der theme.info Datei kannst du eine eigenen JS-Datei "registrieren". Das soll heißen, dass die immer mit geladen wird.
Das geht ungefähr so:
scripts[] = js/NAME-DER-DATEI.js

Wenn die Datei im Theme-Unterordner /js liegt.

In die JS-Datei schreibst du am besten erst einmal einen "JQuery-Rumpf"

z.B. so:

(function($){
$(document).ready(function(){



});
})(jQuery);

und dann trägst du dort die Query-Methoden, Anweisungen, Funktionen, was auch immer ein.

Gruß
Berthold Lausch

Drupal Video-Tutorials

  • Anmelden oder Registrieren um Kommentare zu schreiben

ich hab das mal probiert ... DANKE

Eingetragen von TDI (47)
am 20.04.2015 - 13:20 Uhr

damit funktioniert es sogar ;-)

Ich habe nur das Problem, das bei mir ja lediglich <a name="" id="">text</a> reingeschrieben wird. Die id ist hier im Standard immer so wie der eingetragene Name des Ankers, also nicht statisch ...
Damit kann ich mich wohl nicht auf diese id beziehen um die Klasse einzutragen.

(function($){
$(document).ready(function(){

var id='tdi1';
var myClassName="anchor"; //must keep a space before class name
var d;
d=document.getElementById(id);
d.className=d.className.replace(myClassName,""); // first remove the class name if that already exists
d.className = d.className + myClassName; // adding new class name

});
})(jQuery);

  • Anmelden oder Registrieren um Kommentare zu schreiben

Custom filter

Eingetragen von stBorchert (6003)
am 21.04.2015 - 06:56 Uhr

Moin.
Der sicherstetm Weg, Klassen in die Anchor reinzubekommen, ist ein eigener Filter-Handler.

Vom Prinzip her läuft das so: beim Speichern des Textes schaut der Filter durch den Text, ob ein bestimmtes Muster vorhanden ist ("<a name="...">) und ersetzt dass gefundene Muster dann nach einen Wünschen.
Du kannst den Filter entweder komplett selbst bauen ([api:hook_filter_info:7]) oder Du verwendest das Modul [do:customfilter Custom filter]. Bei Letzterem könntest Du dann folgende Optionen verwenden:

* "Pattern" (ungetestet): /(<a[^>]+(name="\w+")[^>]+>)/
* "PHP Code": on
* "Replacement" (auch ungetestet ;)): $result = str_replace($matches[2], $matches[2] . ' class="anchor"', $matches[1]);

hth,

 Stefan

Tipp: Beachte die Verhaltensregeln des DrupalCenter.

Logo undpaul

  • Anmelden oder Registrieren um Kommentare zu schreiben

Benutzeranmeldung

  • Registrieren
  • Neues Passwort anfordern

Aktive Forenthemen

  • [gelöst]Pflichtfeld vom User deaktivieren lassen
  • Konto löschen, wie? (Drupalorg/Drupalcenter)
  • Layout-Builder hängt
  • Drupal 8/9 SEO-Beratung/Coaching
  • Verschachtelte UND / ODER Abfrage mit hook_views_query_alter
  • Kartenansicht, Position des Users und Nodes anzeigen
  • Hilfe zu Views und Filter?
  • Views für 2 Kategorien
  • [gelöst]Probleme nach löschen eines Menüpunktes im Adminmenü
  • [gelöst]Zufallsausgabe von Inhalt
  • Variable aus dem inkludierten Partial Template auslesen
  • Probleme beim Versand von Mails via Drupal 9
Weiter

Neue Kommentare

  • Danke das ist die Lösung
    vor 15 Stunden 18 Minuten
  • Ah, das sind wertvolle Hinweise
    vor 18 Stunden 19 Minuten
  • Schau Dir mal folgenden
    vor 18 Stunden 31 Minuten
  • Du kannst die Eigenschaften
    vor 18 Stunden 35 Minuten
  • Bitte meinen Account auch löschen
    vor 18 Stunden 36 Minuten
  • Danke, den hook kannte ich natürlich
    vor 20 Stunden 6 Minuten
  • Ich würde das mit
    vor 21 Stunden 42 Minuten
  • php war es nicht
    vor 1 Tag 10 Stunden
  • Ich mache so Sachen:-)
    vor 1 Tag 12 Stunden
  • Bei Google musst Du erst ab
    vor 2 Tagen 22 Stunden

Statistik

Beiträge im Forum: 246097
Registrierte User: 18884

Neue User:

  • Stine_64
  • uniquename
  • xapizm

» Alle User anzeigen

User nach Punkten sortiert:
wla9016
stBorchert6003
quiptime4972
Tobias Bähr4019
bv3917
ronald3832
md3717
Thoor3678
Alexander Langer3416
Exterior2903
» User nach Punkten
Zur Zeit sind 0 User und 6 Gäste online.

Hauptmenü

  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche

Quicklinks I

  • Infos
  • Drupal Showcase
  • Installation
  • Update
  • Forum
  • Team
  • Verhaltensregeln

Quicklinks II

  • Drupal Jobs
  • FAQ
  • Drupal-Kochbuch
  • Best Practice - Drupal Sites - Guidelines
  • Drupal How To's

Quicklinks III

  • Tipps & Tricks
  • Drupal Theme System
  • Theme Handbuch
  • Leitfaden zur Entwicklung von Modulen

RSS & Twitter

  • Drupal Planet deutsch
  • RSS Feed News
  • RSS Feed Planet
  • Twitter Drupalcenter
Drupalcenter Team | Impressum & Datenschutz | Kontakt
Angetrieben von Drupal | Drupal is a registered trademark of Dries Buytaert.
Drupal Initiative - Drupal Association