Page 1 of 1
Externe Links kennzeichnen?
Posted: Wed Nov 14, 2007 12:01 pm
by maxfli55
Kann man unter s9y externe Links kennzeichnen, so dass hinter dem Link-Text z.b. ein Bild (Pfeil) oder Text erscheint?
Ciao
maxfli55
Re: Externe Links kennzeichnen?
Posted: Wed Nov 14, 2007 12:34 pm
by garvinhicking
Hi!
Leider kann man externe und interne Links voneinander nur unterscheiden, wenn du einen Link mit einer speziellen CSS-Klasse ausweist.
Also z.B.
Code: Select all
<a class="ext" href="http://www.google.de/">google</a>
Eine andere Lösung wäre, mit javascript dem Problem zu Leibe zu rücken. Es gibt scripts, die alle links untersuchen, relative links in absolute umwandeln und am ende schauen, welche von deiner domain wegzeigen. Das kostet jedoch einiges an performance, ist dafür aber gründlich. Ich habe sowas noch nie eingesetzt, da müsste man also mal speziell nach googlen oder hoffen, dass jemand anderes hie retwas davon weiß
Grüße,
Garvin
Re: Externe Links kennzeichnen?
Posted: Wed Nov 14, 2007 1:21 pm
by yellowled
garvinhicking wrote:Leider kann man externe und interne Links voneinander nur unterscheiden, wenn du einen Link mit einer speziellen CSS-Klasse ausweist.
Also z.B.
Code: Select all
<a class="ext" href="http://www.google.de/">google</a>
Jein.
Grundsätzlich ist das natürlich richtig, weil es die einzige rein CSS-basierte Methode ist, die in allen Browsern funktioniert, insofern wäre sie meines Erachtens absolut vorzuziehen. Leider ist sie mit Arbeit verbunden
Anständige[tm] Browser unterstützen bereits eine fortgeschrittene Methode, die eigentlich erst mit CSS Level 3 implementiert wird: Einen speziellen Attributselektor. Das geht dann etwa so (style.css):
Der Haken ist offensichtlich:
So betrifft es
alle Links in einem Blog, die mit "http" beginnen, also z.B. auch absolute Links auf das eigene Blog (wie etwa die homelinks im Header). Dafür erwischt es bleistiftsweise keine externen FTP- oder HTTPS-Links. Und es wird eben (noch) nicht von allen Browsern unterstützt ...
YL
Posted: Sat Nov 24, 2007 3:05 am
by stm999999999
Damit lassen sich übrigens noch ganz andere nette Dinge machen, wie etwa
Code: Select all
a[href *="de.wikipedia.org"], a[title *="de.wikipedia.org"] {
padding: 5px 30px 5px 0;
background: transparent url(templates/stm/img/icons/Wikipedia-de.png) no-repeat center right;
}
/* websites (pictures and movies) */
a[href *="youtube.com/watch?"], a[href *="sevenload.com/videos/"], a[href *="metacafe.com/watch/"] {
padding: 5px 20px 5px 0;
background: transparent url(templates/stm/img/icons/icon_film.gif) no-repeat center right;
}
/* extensions */
a[href$='.doc'], a[href$='.rtf'],
a[title$='.doc'], a[title$='.rtf'] {
padding: 5px 20px 5px 0;
background: transparent url(templates/stm/img/icons/icon_doc.gif) no-repeat center right;
}
Eigentlich wollte ich das ja mal als Plugin zusammenstellen ...
Re: Externe Links kennzeichnen?
Posted: Sat Nov 24, 2007 3:07 am
by stm999999999
yellowled wrote:
Der Haken ist offensichtlich:
So betrifft es
alle Links in einem Blog, die mit "http" beginnen, also z.B. auch absolute Links auf das eigene Blog (wie etwa die homelinks im Header). Dafür erwischt es bleistiftsweise keine externen FTP- oder HTTPS-Links. Und es wird eben (noch) nicht von allen Browsern unterstützt ...
Letzteres dürfte sich relativ leicht lösen lassen:
Code: Select all
a[href^="http"], a[href^="https"], a[href^="ftp"] {
color: #f00;
}
Re: Externe Links kennzeichnen?
Posted: Mon Nov 26, 2007 8:11 am
by yellowled
stm999999999 wrote:Letzteres dürfte sich relativ leicht lösen lassen:
Code: Select all
a[href^="http"], a[href^="https"], a[href^="ftp"] {
color: #f00;
}
Ja, sicher. Nur wird der benötigte CSS-Code umso länger, desto mehr man bedient - schließlich müsste man , um es
ganz korrekt zu machen, dann auch interne Ausnahmeregelungen einbauen. Natürlich ist das letztlich nicht
schwer, aber doch relativ viel Aufwand dafür, dass es bislang bestenfalls teilweise umgesetzt wird.
Zudem ist die obige Beispielformatierung ja noch simpel. Verwende mal verschiedene Linkicons, unterschiedliche Linkformatierungen für :link, :visited, :hover, :active und :focus (von :visited:hover usw. ganz zu schweigen), und baue dann noch Ausnahmestyles für Browser ein, die das Ganze (noch) nicht unterstützen ... das ist ein enormer Aufwand für etwas, was mit »class="external"« und etwas Disziplin beim Verfassen von Einträgen sehr viel simpler und zudem browserübergreifend zu lösen wäre (2 cents usw.
)
YL
Posted: Mon Nov 26, 2007 3:06 pm
by stm999999999
naja, ob das nun soviel Aufwand ist!?
Guck Dir mal
http://blog.stephan.manske-net.de/serendipity.css an, da habe ich jede Menge solcher Anweisungen drin und einmal gemacht ist es dauerhaft da ...
Und man könnte das sicher auch in ein Plugin packen, wo man dann die Ausnahmen einfach angeben kann.
BTW, man könnte das mit der class=extern vielleicht im exit-tracking-plugin unterbringen?
Posted: Mon Nov 26, 2007 4:28 pm
by yellowled
stm999999999 wrote:naja, ob das nun soviel Aufwand ist!?
Das ist nicht das hüpfende Komma - eine simple .external ist de facto kürzer und funktioniert zudem browserübergreifend, sie erfordert halt nur etwas mehr »Handarbeit« beim Verfassen von Einträgen
YL
Posted: Mon Nov 26, 2007 7:31 pm
by stm999999999
und genau diese Handarbeit würde ich als (permanenten) Aufwand betrachten