Drucksymbol ändern

Svenoldman · 7. Juni 2021

Es geht um die Seite Ankes Partyservice.

Ich möchte den Icon Drucken verändern, weil er so klein ist.

Ich finde es nicht.

Das auszudruckende Dukument habe ich das Drucksymbol gefunden, aber auf der Seite komme ich nicht an den Pfad vom Symbol.

Für euch bestimmt einen Kleinigkeit.

Danke.

JoomlaWunder · 7. Juni 2021

Google spuckt das Verzeichnis /media/system/images... aus. Suche dort zunächst mal!

Beachte die Joomla-Aktulisierungen, welche das Icon wohl wieder überschreiben,

Hier habe ich auch noch was gefunden: Override erstellen Icon Drucken in Beiträge

Svenoldman · 7. Juni 2021

Zitat

Google spuckt das Verzeichnis /media/system/images... aus.

Das habe ich ja geändert. Wenn man jetzt drucken anklickt kommt das zu druckende Bild bild mit den Schriftzug Drucken.

printButton.png

Es müssen zwei Bilder sein, also die auf der Seite selbst möchte ich ja auch noch ändern.

Da komme ich nicht an den Pfad ran.

JoomlaWunder · 7. Juni 2021

Siehe hier in der template.min.css (Zeile 18627):

Code

.bd-icon-45:before {
    content: '\211';
    visibility: inherit;
    color: #ccc;
    margin-right: 10px
}

Das Icon wird über /211 erzeugt. Eventuell noch ein font-size mitgeben!

Am besten über eine custom.css oder ähnliches. Habe mir das Template jetzt nicht angeschaut.

Svenoldman · 8. Juni 2021

Also konnte ich das Symbol garnicht finden.

Wie ändere ich das , das er nur den Text Drucken anzeigt statt den Minidrucker.

Mit font-size wäre dann ja die Schriftgröße

JoomlaWunder · 8. Juni 2021

Zitat von Svenoldman

Wie ändere ich das , das er nur den Text Drucken anzeigt statt den Minidrucker.
Mit font-size wäre dann ja die Schriftgröße

Font-size wirkt sich in diesem Fall auch auf das Schrift-Icon aus. Auch die Farbe könnte man ändern und vieles mehr.

Alternativ statt /211 (Icon) einfach bei Content den gewünschten Text eintragen. Bin mir aber nicht sicher, ob das für alle Font-Icons gilt. Da gibt es hinsichtlich css geringfügige Unterschiede.

Statt /211 kann man auch andere Icons wählen, z.B. /212 , /213 usw. Schau dir die Liste einfach mal durch!

Svenoldman · 9. Juni 2021

Hallo JoomlaWunder, vielen Dank für deine Tipps,

Habe es ertsmal als Text umgesetzt.

Probiere schon eine weile rum , so das ich statt den Text, ein eigenes Bild einfüge

Ich muß da aber Syntax Fehler machen, so das das Bild nicht erscheint.

Code

.bd-icon-45:before {
    content: 'Drucken';
    visibility: inherit;
    color: #000000;
    margin-right: 10px;
    font-size: 25px;
    font-weight: bold;

Statt den Text "drucken das Bild " http://www.ankes-partyservice.…em/images/printButton.png erscheinen

eigentlich mit dem Befehl img wobei background:url ja auch falsch wäre, es soll ja kein Hintergrundbild werden.

Wie löst man das in css?

Svenoldman · 9. Juni 2021

Eine Sache habe ich noch, wenn ich das Dokument ausdrucke,

z.B. Link

druckt er 2 Seiten

die erste ist das Dokument

und die zweite eine leere Seite wo nur oben Datum und Name der Seite

und ganz unten den Link

Kann man das ändern?

chr-hl · 9. Juni 2021

Moin,
ich habe gerade einmal den "deftigen" Speiseplan ausgedruckt.
Es wurde nur eine Seite erstellt, nur mit dem Plan!
Druckereinstellungen?

Christian

JoomlaWunder · 9. Juni 2021

Zitat von Svenoldman

Habe es ertsmal als Text umgesetzt.
Probiere schon eine weile rum , so das ich statt den Text, ein eigenes Bild einfüge
Ich muß da aber Syntax Fehler machen, so das das Bild nicht erscheint.

Statt den Text "drucken das Bild " http://www.ankes-partyservice.…em/images/printButton.png erscheinen
eigentlich mit dem Befehl img wobei background:url ja auch falsch wäre, es soll ja kein Hintergrundbild werden.
Wie löst man das in css?

Alles anzeigen

Da müsstest du wohl die entsprechende PHP-Datei abändern und das Bild dort direkt einfügen.

Re:Later · 9. Juni 2021

Code

.bd-icon-45:before {
    content: '';

    visibility: inherit;
    color: #FF0000;
    margin-right: 10px;
    font-size: 25px;
    font-weight: bold;

    background-image: url("../../../../media/system/images/printButton.png");
    background-size: cover;
    width: 50px;
    height: 50px;
}

Alles anzeigen

Den mittleren Teil bräuchte man dann eigentlich nicht mehr(?).

Entscheidend ist das "width" und "height" für den leeren content, damit dann das Hintergrundbild entsprechend angezeigt wird. Durch das "cover" eingepasst.

Svenoldman · 9. Juni 2021

Das war die Lösung, perfekt, vielen vielen Dank.