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 - 11: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 (2728)
am 17.04.2015 - 11: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 - 12: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 (2728)
am 17.04.2015 - 13: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 (1521)
am 17.04.2015 - 16: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 - 14: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 - 07: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

  • Konto löschen, wie? (Drupalorg/Drupalcenter)
  • Wie 'saubere' Dateinamen bei Upload erzwingen?
  • Modul lässt Website anstürzen
  • Showroom
  • rename admin paths - Probleme mit Modul - Alterantive?
  • Probleme mit Installation voa COMPOSER
  • Drupal- Vor- und Nachteile
  • Text Editor verschwunden
  • Wie URL Alias für Entity in Drupal 9 erstellen?
  • in View zwischen Felder einer Node filtern
  • HTML-Code funktioniert nicht
  • Webform, Condtional Logik, Kontrollkästchen
Weiter

Neue Kommentare

  • Hallo, bitte löscht meinen
    vor 1 Tag 19 Stunden
  • Schau mal hier
    vor 2 Tagen 22 Minuten
  • Das Modul ist ja ganz schön,
    vor 4 Tagen 23 Stunden
  • Modul Purge
    vor 5 Tagen 18 Stunden
  • Nö
    vor 6 Tagen 1 Stunde
  • Manuell aus der Datenbank löschen
    vor 6 Tagen 2 Stunden
  • Bots ... auf Abstand
    vor 6 Tagen 17 Stunden
  • Cache vs Browser
    vor 6 Tagen 18 Stunden
  • h2b2 schrieb Nach einigen
    vor 1 Woche 2 Tagen
  • Vor- und Nachteile
    vor 1 Woche 2 Tagen

Statistik

Beiträge im Forum: 247802
Registrierte User: 19535

Neue User:

  • Chrisvek
  • RebeccaBeils
  • rogerfk18

» Alle User anzeigen

User nach Punkten sortiert:
wla9209
stBorchert6003
quiptime4972
Tobias Bähr4019
bv3924
ronald3845
md3717
Thoor3678
Alexander Langer3416
Exterior2903
» User nach Punkten
Zur Zeit sind 1 Benutzer und 9 Gäste online.

Benutzer online

  • wla

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