Kennzeichnung von externen Links
Ja, wahrscheinlich hast du recht. Das bedeutet nur, künftig immer dran zu denken und jetzt den massigen Inhalt noch mal durchgehen.
Hatte nicht erwartet, dass es ein Problem ist, diese Links anzusprechen. Da war ich wohl wieder etwas zu naiv... 
jQuery nutze ich schon, aber bei dem Code habe ich ja auch das Problem, dass es nicht auf die Links im Content beschränkt ist, oder?
Danke, TiJo, aber irgendwas mache ich immer noch falsch... 
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script src="https://code.jquery.com/jquery-latest.js">
</script>
<script type="text/javascript">
//<![CDATA[
/* Externe Links mit einer Class versehen */
$('.jtpl-content a:not([href^="https://palaneris.de"]):not([href^="#"]):not([href^="/"])').addClass('external');
//]]>
</script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.1/css/all.css" integrity="sha384-O8whS3fhG2OnA5Kas0Y9l3cfpmYjapjI0E4theH4iuMD+pLhbf6JI0jIMfYcK3yZ" crossorigin="anonymous" />
<style>
/* <![CDATA[ */
/*externe Links mit Icon versehen*/
.external a:after {
font-family: "Font Awesome 5 Free";
font-size: 9px;
content: "\f35d";
padding-left: 5px;
}
/*]]>*/
</style>
Du musst alle im Paket enthaltenen Dateien laden (...eigener Webspace erforderlich)
- https://fontawesome.com/v5.15/how-to-use...wesome-yourself
- https://fontawesome.com/start
LG, az
Beispiel: https://redesign-animation.jimdofree.com/test/
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!-- scripts-->
<script defer="defer" src="https://redesign-berlin.lima-city.de/__fonts/fontawesome-free-5.15.4-web/js/brands.js"></script>
<script defer="defer" src="https://redesign-berlin.lima-city.de/__fonts/fontawesome-free-5.15.4-web/js/solid.js"></script>
<script defer="defer" src="https://redesign-berlin.lima-city.de/__fonts/fontawesome-free-5.15.4-web/js/fontawesome.js"></script>
<!-- styles -->
<link href="https://redesign-berlin.lima-city.de/__fonts/fontawesome-free-5.15.4-web/css/all.css" rel="stylesheet" />
<link href="https://redesign-berlin.lima-city.de/__fonts/fontawesome-free-5.15.4-web/css/brands.css" rel="stylesheet" />
<link href="https://redesign-berlin.lima-city.de/__fonts/fontawesome-free-5.15.4-web/css/solid.css" rel="stylesheet" />
<style type="text/css">
.demo-icon-list {
list-style: none;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: center;
padding: 0;
margin: 0;
}
.demo-icon {
margin: 0;
padding: 1.5rem 1rem;
}
.fa-fish {
color: salmon;
}
.fa-frog {
color: green;
}
.fa-facebook {
color: rgb(59, 91, 152);
}
</style>
<!-- html -->
<ul class="demo-icon-list">
<li class="demo-icon">
<i class="fas fa-fish"> </i>
</li>
<li class="demo-icon">
<i class="fas fa-frog"> </i>
</li>
<li class="demo-icon">
<i class="fas fa-user-ninja"> </i>
</li>
<li class="demo-icon">
<i class="fab fa-facebook"> </i>
</li>
</ul>
<center>
<span style="font-size: 3em; color: Tomato;">
<i class="fas fa-camera"> </i>
</span>
<span style="font-size: 40px; color: Dodgerblue;">
<i class="fas fa-camera"> </i>
</span>
<span style="font-size: 3rem; color: Mediumslateblue;">
<i class="fas fa-camera"> </i>
</span>
</center>
Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= 
) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).
Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!
...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de
Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de
Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html
Ähnliche Themen
Jetzt anmelden!
Jetzt registrieren!
