Wie kann ich das vorangestellte Icon bei einer Download-Datei deaktivieren

Wenn du bei deiner Spreadmind Webseite eine PDF-, Word-, Excel- oder ZIP-Datei als Download-Link einfügst, werden für diese Dateiformate automatisch im Frontend die entsprechenden Icons dem Download-Link vorangestellt: 

Diese Icons erscheinen allerdings auch dann, wenn du das Divi Modul "Button" benutzt und als URL-Link die Medien-URL für eine PDF-, Word-, Excel- oder ZIP-Datei einfügst: 

Wie in dem Bild zu sehen, verdeckt das Icon den Text des Buttons. 

Wir zeigen dir nun, wie du diese Icons für einen Download-Link oder Button ausblenden kannst. Für beide Varianten nutzen wir eine eigene CSS-Klasse kein-icon – aber keine Sorge, du musst keinen eigenen Code dafür programmieren. Wir haben bereits alles so eingestellt, dass du nur noch diese CSS-Klasse einfügen musst, damit das Icon nicht mehr sichtbar ist.

Icon ausblenden bei einem Download-Link

Download-Links kannst du sowohl im Standard-Editor oder über ein Divi-Modul einfügen. Bei beiden Varianten ist es wichtig, dass du in die "Text"-Editor Ansicht wechselst und dort beim HTML-Link die CSS-Klasse kein-icon einfügst. 

1. Text-Editor Ansicht wechseln:

Das sieht dann bspw. so aus: 

Ein Hyperlink wird aus dem HTML-Element <a href="...">...</a> aufgebaut. Dieses wird nun einfach um class="kein-icon" erweitert (im Bild unten blau markiert): 

Ergibt:

<a class="kein-icon" href="...">...</a>

Diese Einstellungen werden gespeichert und schon ist das Icon für die "Beispiel-doc" Download-Datei im Frontend nicht mehr sichtbar: 

Icon ausblenden bei einem Button-Modul

Wie im Bild oben zu sehen, ist beim Button auch das PDF-Icon nicht mehr sichtbar. Auch hier wrd die CSS-Klasse kein-icon genutzt. Öffne dazu die Einstellungen des Button-Moduls und gehe zur Registerkarte "Erweitert" und füge bei der Option "CSS-ID & Klassen" unter "CSS-Klasse" kein-icon ein:

Speicher alle Anpassungen, damit diese auch im Frontend sichtbar sind.

Brauchst du noch weitere Hilfe? Kontaktiere das Spreadmind Support Team Kontaktiere das Spreadmind Support Team