Hallo,
ich habe ein Banner erstellt, das aber nach dem Rendern auf den oberen Trailer total verrauscht ist. Ich habe es sowohl mit png als auch mit jpeg probiert. Die aus der Bildbearbeitung exportierte Grafik sieht einwandfrei aus. Erst online, also nach dem Typo die Grafik platziert hat, sieht die so aus...kann mir nicht erklären wieso.
Bild: 2and2.net/…/rauschen.png
# Den Trailer dynamisch ansprechen
TRAILER = IMAGE
TRAILER.file = GIFBUILDER
TRAILER.file {
XY = 730, 114
backColor = #FFFFFF
#Stimmungsbanner auf Trailer rendern
10 = IMAGE
10.file = fileadmin/e-learning/template/top_banner.png
10.file.width = 730
10.offset = 0,-10
Was mache ich falsch?
Josef
Hi,
du erstellst ein GIF, aber GIF ist nicht dafür gemacht Bilder anzuzeigen da GIF nur über 256 Farben verfügt. GIF ist geeignet für Flächen, Grafiken, etc...! Ich würde den Banner als Hintergrund einfügen und den Text darüber legen als transparentes GIF.
grüsse
FordPrefect schrieb
Hi,
du erstellst ein GIF, aber GIF ist nicht dafür gemacht Bilder anzuzeigen da GIF nur über 256 Farben verfügt. GIF ist geeignet für Flächen, Grafiken, etc...! Ich würde den Banner als Hintergrund einfügen und den Text darüber legen als transparentes GIF.
grüsse
Sieht eher nach eine PNG aus...
hi,
stimmt, net drauf geachtet...
Könnstest mit folgenden Einstellungen arbeiten:
10 = IMAGE
10.file = fileadmin/e-learning/template/top_banner.png
10.file.width = 730
10.offset = 0,-10
10.format = jpg
10.quality = 100
Grüsse
Erstmal danke für die Antwort.
Also ich habe jetzt etwas experimentiert und habe die Grafik etwas besser hinbekommen, in dem ich folgendes geschrieben habe.
Den Trailer dynamisch ansprechen
TRAILER = IMAGE
TRAILER.file = fileadmin/e-learning/template/top_banner.jpg
XY = 730, 114
backColor = #FFFFFF
Das bild ist aber jetzt noch unscharf. Wie ist die Syntax um jetzt die Qualität des jpg hochzusetzen?
Und wie schaff ich es denn jetzt noch Text auf das Bild zu rendern?
Den ursprünglichen code habe ich aus Robert Meyers Buch. Selbst der hat ein Jpeg-Bild (Snowbordschule) auf dieses per Gifbuilder erstellten Trailer gerendert. Nachher wurde das Bild dann dynamisch je nach Eintrag in der Datenbank verändert. So wäre mir das auch am liebsten. Nur die Qualität des Bildes soll besser sein o.O
Seid geduldig mit mir....
Hi,
arbeitest du mir Image-Magick oder mit der GDLib, die GDLib liefert nicht so tolle ergebnisse.
Grüsse
Ford
Wie sieht das Ergebnis momentan überhaupt aus? Welche Zahl besitzt der dpi-Wert im InstallTool(InstallTool > Punkt1 oder Punkt4)? Falls 72, stell den mal auf 96.
Wenn die Schrift nicht sonderlich exotisch aussehen soll, setze per CSS eine grössere Arial/Verdana Schrift vor die Original-Hintergrundbilder, anstatt über GIFBUILDER.
Ansonsten mal im Forum nach "qualität gifbuilder" suchen, und png als Ausgabe testen.
grüsse
Also....
Die dpi-Anzahl habe ich nur im Zusammenhang mit Freetype gefunden. Ich verstehe nicht den Zusammenhang zwischen Freetype und dem Rendern des jpegs/pngs, aber ich habe den jetzt mal auf 96 gestellt. Konfig sieht so aus:
ImageMagick enabled: 1
ImageMagick path: c:\im4\ (4.2.9)
ImageMagick path/LZW: ()
Version 5 flag: 0
GDLib enabled: 1
GDLib using PNG: 0
GDLib 2 enabled: 0
IM5 effects enabled: 0 (Blurring/Sharpening with IM 5+)
Freetype DPI: 96 (Should be 96 for Freetype 2)
Mask invert: 0 (Should be set for some IM versions approx. 5.4+)
File Formats: gif,jpg,jpeg,tif,bmp,pcx,tga,png,pdf,ai
Also mit CSS da noch anzufangen überfordert mich, sorry. Das buch "little Boxes" steht zwar schon hier, aber das würde ich jetzt vorerst gerne aussparen.
Ich würde gerne diese Bannergrafik in einer guten Qualität im hintergrund liegen haben und darauf dann Schrift rendern können. Mir wäre es auch wichtig, das Bild je nach Seite zu ändern.
Hier nochmal "mein" TS:
# Die Designvorlage integrieren
10 = TEMPLATE
10.template = FILE
10.template.file = fileadmin/e-learning/template/vorlage.html
10.workOnSubpart = DOKUMENT
10.marks {
# Den Platzhalter DATUM ansprechen
#DATUM = TEXT
#DATUM.data = date : d.m.Y
# Das Logo einlesen
LOGO = IMAGE
LOGO.file = fileadmin/e-learning/template/logo_medienzentrum.png
LOGO.file.width = 180
# Das Logo einlesen
LOGO2 = IMAGE
LOGO2.file = fileadmin/e-learning/template/logo_uni.png
LOGO2.file.width = 180
# Den Trailer dynamisch ansprechen
TRAILER = IMAGE
TRAILER.file = GIFBUILDER
TRAILER.file {
XY = 730, 114
backColor = #FFFFFF
#Stimmungsbanner auf Trailer rendern
#10 = IMAGE
#10.file = fileadmin/e-learning/template/top_banner.png
#10.file.width = 730
#10.offset = 0,-10
#Stimmungsbanner auf Trailer rendern
10 = IMAGE
10.file = fileadmin/e-learning/template/top_banner.jpg
10.file.width = 730
10.offset = 0,-10
10.format = jpg
10.quality = 100
Was ich nicht so ganz verstehe, warum denn jetzt diese quality=100 - Parameter nicht greift und das Bild immer noch genauso verrauscht aussieht wie das ganz oben in meiner ersten Mail.
Auf der anderen Seite, wenn ich das Problem richtig verstehe....ich erstelle einen Trailer, als GIF-Grafik mit den üblichen Beschränkungen und render DARAUF ein jpeg...egal ob 50 oder 100er Qualität, das jpeg wird immer verrauscht sein. Hmmm....Hilfe....
Josef
Also mit CSS da noch anzufangen überfordert mich, sorry. Das buch "little Boxes" steht zwar schon hier, aber das würde ich jetzt vorerst gerne aussparen.
#mein-banner {
font-size: 14px;
color: #fff;
width: 730px;
height: 114px;
background-image: url(fileadmin/banner/grafik.jpg);
background-image: no-repeat;
}
Immernoch überfordert #paralyzed# ? Eine Schrift vor eine Grafik zu setzen ist per CSS doch kein Problem. Z.B. ein DIV mit der Grösse eines Bildes definieren und den Text vor das Bild setzen. Grafik als background-image.
Probier's bei Bedarf aus. Evtl. genau die Lösung, die Dir passt.
grüsse
Da blicke jetzt leider nicht so ganz durch, wie ich das benutze. Was ich von dem alten Code weglassen muss, etc. Da bewege ich mich auf einem Gebiet wo ich einfach nicht fit bin. Dann muss ich wohl mit dem verrauschten Bild leben, denn wenn ich den Code von Dir integriere, klappt gar nichts mehr :o
Mir wäre eine Lösung mit der vorhandenen Lösung (nkl. Code) am liebsten gewesen, weil ich da zumindest halbwegs durchblicke...
Mir wäre eine Lösung mit der vorhandenen Lösung (nkl. Code) am liebsten gewesen, weil ich da zumindest halbwegs durchblicke...
Was erwartest nun hier für eine Antwort ^^. Dass User sich tagtäglich im Forum opfern um Fertiglösungen zu produzieren #paralyzed# ? Ich würde sagen: "nein", bei TYPO3 ist Initiative und Zeit nunmal nötig. Wirst Du noch genug oft herausfinden. Und blind was kopieren und 2 Zeilen abändern hat nicht besonders viel mit "halbwegs durchblicken" zu tun. HTML/CSS ist bei eigenen TYPO3-Seiten schlichtweg vorausgesetzt. Wenns mit Background-Image auf ein bestimmtes Element happert, hast Du Wissenslücken, die ich an deiner Stelle füllen würde.
Und wenn Du ernsthaft während 30min mal auf http://www.css4you.de, Google, etc. stöberst bringst Du CSS mit Hintergrundbild und Text wirklich hin. Bissal in P*p* kneiffen. Wenn es in TYPO3 unklar ist, bau es zuerst lokal über ein HTML-File zusammen. CSS und Bild dazu. Fertig.
grüsse
Naja sagen wir mal so....da ist ja eine Lösung, die ich auch verstehe. Meine Frage war nur, ob ich an einer oder der anderen Stelle etwas verändern muss, also irgendwo GIF durch JPEG austauschen o.ä. Da kann man nicht direkt von einer Komplettlösung sprechen, die ich mir hier von irgendjemandem zusammenbauen lassen will. Ich habe (immerhin) schon das komplette Meyer-Buch durchgearbeitet und mich mit dem System beschäftigt. Natürlich stehe ich damit noch komplett am Anfang, das ist mir bewußt.
Die CSS-Lösung ist also scheinbar die einzige Möglichkeit. Es wurde ja noch kein Wort darüber verloren, ob es mit der ursprünglichen Lösung funktionieren kann, wenn man ein oder zwei Schrauben dreht. CSS ist ja eigentlich ein komplett anderer Ansatz der Realisierung.
Also noch zwei Fragen:
- Wenn ich das mit CSS realisiere, ist es dann auch problemlos möglich immer den gerade angewählten Punkt auf den Background zu rendern? So wie ich das mit
# Text auf den Trailer rendern
30 = TEXT
30.text.field = subtitle // title
30.fontFile = fileadmin/fonts/verdana.ttf
30.fontSize = 18
30.fontColor = #FFFFFF
30.offset = 8, 105
in der ursprünglichen Lösung auch hatte?
- Kann ich nicht einfach als Background das jpeg laden und mit dem gerade geschriebenen TS den Text auf den Background schreiben um das CSS zu umgehen?
Ich will es mir nicht leicht machen, ich bin nur etwas unter Zeitdruck...
Josef
Hallo shodaan,
shodaan schrieb
ImageMagick enabled: 1
ImageMagick path: c:\im4\ (4.2.9)
ImageMagick path/LZW: ()
Version 5 flag: 0
GDLib enabled: 1
GDLib using PNG: 0
GDLib 2 enabled: 0
IM5 effects enabled: 0 (Blurring/Sharpening with IM 5+)
Freetype DPI: 96 (Should be 96 for Freetype 2)
Mask invert: 0 (Should be set for some IM versions approx. 5.4+)
File Formats: gif,jpg,jpeg,tif,bmp,pcx,tga,png,pdf,ai
also ich erziele mit dieser Einstellung (Datei typo3conf/localconf.php) ganz gute Ergebnisse:
$TYPO3_CONF_VARS["GFX"]["thumbnails_png"] = '1';
$TYPO3_CONF_VARS["GFX"]["gdlib_png"] = '1';
$TYPO3_CONF_VARS["GFX"]["TTFdpi"] = '96';
$TYPO3_CONF_VARS['GFX']['im_version_5'] = 'gm'; // GraphicsMagick verwenden
$TYPO3_CONF_VARS['GFX']['im_v5effects'] = true;
$TYPO3_CONF_VARS['GFX']['im_path'] = '/pfad/zu/graphicsmagick/bin/';
$TYPO3_CONF_VARS['GFX']['gdlib_2'] = '1';
$TYPO3_CONF_VARS['GFX']['png_truecolor'] = '1';
$TYPO3_CONF_VARS['GFX']['jpg_quality'] = 85;
Natürlich kann man auch ImageMagick verwenden. "png_truecolor = 1" hat bei mir in ähnlicher Situation das Rauschen beseitigt (True Color statt 256 Farben). Aber auch die GDLib Version kann wichtig sein. GDLib 2 beherrscht auf jeden Fall auch TrueColor.
Das ist bestimmt nur eine Einstellungssache. Viel Glück.
http://img213.imageshack.us/my.php?image=conftq4.png
Das sind die Einstellungen an denen ich drehen kann, leider habe ich nirgendwo eine truecolor-Einstellung gesehen, oder muss ich dafür die localconf über einen Editor bearbeiten?
Also über die Bordmittel von Typo3 (Installation->All Configuration) habe ich verschiedenes probiert. Wenn ich IM ausschalte bekomme ich eigentlich von der Qualität alles hin....sieht super aus....NUR....manche Grafiken sind plötzlich riesig groß geworden? Das Rauschen ist aber damit weg......wie bekomme ich jetzt die anderen Grafiken wieder klein? #angry#
Manchmal ist es einfacher die localconf.php direkt zu bearbeiten. Du kannst eigene Werte ans Ende der Datei anfügen. Probiere doch mal, ob diese beiden Werte zusammen etwas bewirken (gdlib_png=1 ist ja bereits eingetragen):
$TYPO3_CONF_VARS["GFX"]["gdlib_png"] = '1';
$TYPO3_CONF_VARS['GFX']['png_truecolor'] = '1';
Meiner Erfahrung nach ist es genau, wie in diesem Thread beschrieben: 
#42563
Ich bin mir nicht sicher, es kann aber sein, dass du die GDlib2 benötigst um Text in TrueColor-Grafiken zu rendern.
Hier ist eine Erklärung zu einigen GFX-Einstellungen:
http://www.typo3.net/backendkonfiguration/grafikgenerierung_konfigurieren/
In der Datei t3lib/config_default.php sind die Default-Einstellungen mitsamt erklärenden Kommentaren (auf Englisch) eingetragen. Diese Werte werden von denen in localconf.php überschrieben.
Ich würde an deiner Stelle IM nicht ausschalten. Das bringt nur neue Probleme mit sich. Wichtig ist an erster Stelle, dass die Testbilder im Install-Tool (Bereich Image Processing) alle korrekt berechnet werden und genau so aussehen, wie die Vergleichsgrafiken.
Wenn es schnell gehen muss und du so nicht weiterkommst würde ich dir aber auch die CSS-Lösung empfehlen.
Hab Dir ne PM geschrieben, falls Dich CSS noch interessiert.
Hier Beispiele, falls andere User Interesse haben:
In fast jedem Blog anzutreffen
http://andy.wordpress.com/
http://vanfossen.wordpress.com/
grüsse
Es ist bei der CSS-Lösung aber schon so, dass bei der Erstellung eines neuen Menüpunktes (durch einen Redakteur zum Beispiel) der Text automatisch auf das Bild gerendert wird und ich nicht noch Hand anlegen muss?