Darstellung der Pfeile in der Breadcrumb-Navigation ändern � Designvorlage "Rome"

Jimdo-Userforum � Jimdo User-Forum � Allgemeines � Darstellung der Pfeile in der Breadcrumb-Navigation ändern � Designvorlage "Rome"

Themen-Einstellungen

Thema drucken

Bereich wechseln

Allgemeines Regeln f�r die Benutzung des Forums HowToDo ( = so geht�s) Jimdo User-Forum Eure Jimdo-Webseiten - Vorstellungsrunde Bugs, Workarounds und Anregungen Jimdo-Elemente Allgemeines Jimdo-Shop Jimdo-Specials (Tools, Widgets, HTML und CSS) Suchmaschinenoptimierung (SEO) Sonstiges Tutorials "OffTopic"-Themen "�bernahme" von Beitr�gen aus dem offiziellen Jimdo-Forum... Nutzungsbedingungen und Haftungsausschluss Jimdo-Blog

#1 | Darstellung der Pfeile in der Breadcrumb-Navigation ändern � Designvorlage "Rome" datum

19.12.2018 19:35 (zuletzt bearbeitet: 19.12.2018 19:36)

Hallo zusammen! Weiß jemand, wie ich die Pfeile in der Breadcrump-Navigation ändern kann? Deren Darstellung ist von der Designvorlage ("Rome") vorgegeben und sieht aus wie hier: https://www.renaesu.com
Das passt aber leider optisch gar nicht zu der von mir sonst gewählten Schriftart. Ich habe keinen Weg gefunden, wie ich die Optik anpassen kann. Allerdings gibt es Beispiele im Netz, wo die Pfeile anders aussehen. Z.B. hier: https://www.landscapesatwar.eu/
Also muss es einen Weg geben.

Lieben Dank im Voraus
Dinilini

Antworten

#2 | RE: Darstellung der Pfeile in der Breadcrumb-Navigation ändern � Designvorlage "Rome" datum

19.12.2018 20:50 (zuletzt bearbeitet: 19.12.2018 22:06)

az_

Informationen anzeigen

Beitr�ge:	2403
Registriert seit:	28.04.2015
Wohnort:	Berlin

Hallo und willkommen in unserem Forum!

Für das Pfeil-Symbol ist eine sog. Pseudo-Klasse verantwortlich:

1
2
3
4
5
6
7
8
 
.jtpl-breadcrumb__title-navigation-gutter a:link:before, 
.jtpl-breadcrumb__title-navigation-gutter a:visited:before {
    content: '\2986';
    opacity: .5;
    font-size: 80%;
    left: 15px;
    position: absolute;
}
 

Wenn Du das ändern möchtest, musst Du zuerst eine eigene Symbolschrift auf Deiner Webseite einbinden
(z.B. FontAwesome https://fontawesome.com/):

1
 
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

...und dann das CSS entsprechend abändern.

LG, az

Achtung: Code im Forum bitte immer mit der Schaltfläche für "Code" einkapseln!!! (=

)

Bitte sendet mir keine privaten Nachrichten über dieses Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de

...hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de

...NEU!!! - hier könnt Ihr unser Userforum finanziell unterstützen: https://redesign-berlin.xobor.de/donations.html

Antworten

#3 | RE: Darstellung der Pfeile in der Breadcrumb-Navigation ändern � Designvorlage "Rome" datum

19.12.2018 21:13 (zuletzt bearbeitet: 19.12.2018 21:44)

az_

Informationen anzeigen

Beitr�ge:	2403
Registriert seit:	28.04.2015
Wohnort:	Berlin

Infos zu Icon-Fonts findest Du z.B. hier: http://weloveiconfonts.com/ (...leider für Jimdo nur eingeschränkt zu gebrauchen, weil nicht https://)

...dieses Icon ist aus dem Font-Awesome Font genommen. Das CSS dafür ist:

1
2
3
4
5
6
7
8
9
10
11
12
 
<style type="text/css">
	.jtpl-breadcrumb__title-navigation-gutter a:link:before,
	.jtpl-breadcrumb__title-navigation-gutter a:visited:before {
		content: "\f054";
		opacity: .5;
		font-size: 80%;
		left: 15px;
		position: absolute;
		font-family: 'FontAwesome', sans-serif !important;
	}
 
</style>
 

LG, az

Achtung: Code im Forum bitte immer mit der Schaltfläche für "Code" einkapseln!!! (=

Antworten

#4 | RE: Darstellung der Pfeile in der Breadcrumb-Navigation ändern � Designvorlage "Rome" datum

19.12.2018 21:24 (zuletzt bearbeitet: 19.12.2018 21:45)

az_

Informationen anzeigen

Beitr�ge:	2403
Registriert seit:	28.04.2015
Wohnort:	Berlin

1
2
3
4
5
6
7
8
9
10
11
 

.jtpl-breadcrumb__title-navigation-gutter a:link:before, 
.jtpl-breadcrumb__title-navigation-gutter a:visited:before {
    content: "\f0a4";
    opacity: 1;
    font-size: 100%;
    left: 5px;
    margin-top: -1px;
    position: absolute;
    font-family: 'FontAwesome', sans-serif !important;
}
 

LG, az

Achtung: Code im Forum bitte immer mit der Schaltfläche für "Code" einkapseln!!! (=

Antworten

#5 | RE: Darstellung der Pfeile in der Breadcrumb-Navigation ändern � Designvorlage "Rome" datum

20.12.2018 09:31

Cool! Lieben Dank für die schnelle und ausführliche Hilfe! Das funktioniert! :-)

Antworten

Foto des Artikels in der Bestellansicht anzeigen � � Mobile Website bearbeiten

�hnliche Themen

Antworten

Letzter Beitrag

ROME ohne Breadcrumbs links unten am Header � auch bei Mobiles
Erstellt im Forum Jimdo-Specials (Tools, Widgets, HTML und CSS) von Wolfgang Wick 1 25.10.2021 12:07
az_ • Zugriffe: 1381
Rome - Navigation in Topbar rechtsbündig
Erstellt im Forum Allgemeines von Tirreg 0 23.04.2021 11:08
Tirreg • Zugriffe: 1353
Design Rome: Logo und Navigation untereinander
Erstellt im Forum Allgemeines von Tho 1 26.01.2021 19:58
az_ • Zugriffe: 1163
CTA-Button in der Navigation - Design Vorlage ROME
Erstellt im Forum Jimdo-Elemente von Dominique123 6 04.06.2019 19:43
az_ • Zugriffe: 1893
Breadcrumb Navigation in die Designvorlage Copenhagen einbauen
Erstellt im Forum Jimdo-Specials (Tools, Widgets, HTML und CSS) von juerg s 0 08.05.2018 15:21
juerg s • Zugriffe: 817
Design Rome - Schriftgröße Breadcrumb Trail in mobiler Ansicht
Erstellt im Forum Allgemeines von Thomas Müller 4 25.04.2018 17:26
Thomas Müller • Zugriffe: 932
Design Rome - Header verkleinern
Erstellt im Forum Allgemeines von Vita 21 30.01.2018 07:55
Eisbärin • Zugriffe: 5624
"Scroll" Pfeil im Head Bereich von Design Stockholm möglich?
Erstellt im Forum Allgemeines von make 2 25.07.2017 21:47
make • Zugriffe: 1761
Rome Layout zweisprachig / angepasstes Tokyo Layout
Erstellt im Forum Allgemeines von moritz 7 07.10.2017 21:22
justin • Zugriffe: 2331

Xobor-Forum f�r Jimdo-Creator User

Bitte geben Sie einen Grund f�r die Verwarnung an