Schriftgrößen mit CSS und TYPO3 wählen

eine Anleitung wie man das Schriftvergrößern mit RealURL nutzt wäre toll :o

Kitsunet schrieb

nimm mal überall aus den additionalParams die tx_ttnews raus.

Also anstatt:

temp.fsizemenu.40.value.typolink.additionalParams = &Fsize=0&no_cache=1&tx_ttnews[tt_news]

dann:

#
temp.fsizemenu.40.value.typolink.additionalParams = &Fsize=0

Grüße

Christian

Habe ich auch schon ausprobiert, geht leider nicht. Es wird immer "keine News id übergeben" angezeigt.

Hat jemand ne Lösung?

Hallo Leute, im Rahmen der Entwicklung von www.edesheim.de hat sich mein Problem erledigt.

Hier könnt Ihr das Ganze mit tt_news und anderen Extension sehen:

http://www.edesheim.de

Da ich es nicht abschätzen kann, ob die Seite wirklich barrierefrei ist, wäre ein Rückläufer nicht schlecht!!!!

Danke an Alle!

Gruß Arnie!

Hi,

das script funktioniert. ich möchte es aber jetzt gerne so modifizieren, dass ich zwei symbole verwende um die schrift zu verkleinern oder zu vergrößern (also nicht mehr alle stufen anzeigen).

bin typo3 dummy. in php könnte man eine variable definieren, die wenn man auf den schriftgrößer-button klickt um 1 erhöht wird und dann die entsprechende css-datei ausgewählt wird. beim schriftkleiner-buttom entsprechend umgekehrt.

könnt ihr mir da helfen?

mfg
Leuny

Hier mal das Ganze mit funktionierenden Links für RealURL und tt_news und Konsorten:

temp.fsizemenu = COA
temp.fsizemenu {
wrap = <ul>|</ul>
40 = HTML
40 {
value = Normal A
value.wrap = <li class="sizepunkt">|</li>
value.typolink.parameter.data = page:uid
value.typolink.additionalParams = &Fsize=0
value.typolink.addQueryString = 1
value.typolink.addQueryString.method = GET
}
50 < temp.fsizemenu.40
50 {
value = Mittel A+
value.wrap = <li class="sizepunkt">|</li>
value.typolink.additionalParams = &Fsize=1
value.typolink.addQueryString = 1
value.typolink.addQueryString.method = GET
}
60 < temp.fsizemenu.40
60 {
value = Groß A++
value.wrap = <li class="sizepunkt">|</li>
value.typolink.additionalParams = &Fsize=2
value.typolink.addQueryString = 1
value.typolink.addQueryString.method = GET
}
70 < temp.fsizemenu.40
70 {
value = Handy- / Textversion
value.wrap = <li class="sizepunkt">|</li>
value.typolink.additionalParams = &Fsize=3
value.typolink.addQueryString = 1
value.typolink.addQueryString.method = GET
}

}

Die Ergänzung der realurlconf.php
array(
'GETvar' => 'Fsize',
'valueMap' => array(
'n' => '0',
'g' => '1',
'gg'=> '2',
'nt'=> '3',

),
'noMatch' => 'bypass',
),

Danke das du das "rund" gemacht hast! Bin hier gerade mit so vielen anderen Sachen beschäftigt, dass ich nicht dazu gekommen bin hier mal ein Update zu posten.

Grüße

Christian

Hallo zusammen!

Erst einmal Danke für die Anleitung.
Anhand des Beispiels von Kitsunet habe ich versucht den Font-Resizer auf meiner Seite zu integrieren. Leider nicht erfolgreich. Ich bin jetzt schon seit Stunden am Überlegen wo ich den Fehler mache...

###Font size
config.linkVars = Fsize
config.uniqueLinkVars = 1

[globalVar = GP:Fsize<1]
seite.includeCSS.file1 = fileadmin/size0.css
seite.includeCSS.file1.title = Font Size Step 1
seite.includeCSS.file1.import = 1
[END]

[globalVar = GP:Fsize=1]
seite.includeCSS.file1 = fileadmin/size1.css
seite.includeCSS.file1.title = Font Size Step 2
seite.includeCSS.file1.import = 1
[END]

[globalVar = GP:Fsize=2]
seite.includeCSS.file1 = fileadmin/size2.css
seite.includeCSS.file1.title = Font Size Step 3
seite.includeCSS.file1.import = 1
[END]

###Hier wird die MAIN-CSS Datei eingebunden
page.includeCSS.file2 = fileadmin/style-main.css
page.includeCSS.file2.title = Styles für die Bildschirmausgabe
page.includeCSS.file2.import = 1

[...]

###Marker Font Size
marks.SIZE0 = COA
marks.SIZE0.40 = HTML
marks.SIZE0.40.value = A
marks.SIZE0.40.value.typolink.parameter.data = page:uid
marks.SIZE0.40.value.typolink.additionalParams = &Fsize=0

marks.SIZE1 = COA
marks.SIZE1.40 = HTML
marks.SIZE1.40.value = A+
marks.SIZE1.40.value.typolink.parameter.data = page:uid
marks.SIZE1.40.value.typolink.additionalParams = &Fsize=1

marks.SIZE2 = COA
marks.SIZE2.40 = HTML
marks.SIZE2.40.value = A++
marks.SIZE2.40.value.typolink.parameter.data = page:uid
marks.SIZE2.40.value.typolink.additionalParams = &Fsize=2

Die Marker werden wie geplant ersetzt und auch beim Klick auf A++ wird diese Endung (.html?&Fsize=2) angehängt. Nur leider ändert sich am Schriftbild nichts.
Im style-main.css befinden sich sämtliche Styles. In den Styles size0.css, size1.css und size2.css nur der Body-Tag mit

body
{
font-size:120%;
}

Jeweils eine andere Größe.

Sieht jemand den Fehler?

BEST!

Also du benutzt wahrscheinlich simulateStaticDocuments, oder?

Du hast das hier geschrieben:

..nd auch beim Klick auf A++ wird diese Endung (.html?&Fsize=2) angehängt.

.html?&Fsize=2 kann aber nicht funktionieren... Es muss in diesem Fall:

.html?Fsize=2 rauskommen... Also versuch mal bei diesen Zeilen hier:

marks.SIZE0.40.value.typolink.additionalParams = &Fsize=0 jeweils das & rauszunehmen...

Viele Grüße
Christian

Hallo Kitsunet!

Danke für deine Anleitung und die schnelle Antwort.

Ja, ich benutze simulateStaticDocuments. "&" habe ich jetzt mal rausgenommen.
Leider ist das Problem damit nicht behoben. Jetzt wird gar nichts mehr angehängt.
Wenn ich die Endung manuell in der Adresszeile des Browsers anfüge geschieht auch nichts.
Hast du vielleicht noch eine Idee?

Eine URL wäre nicht schlecht um das aus erster Hand zu sehen. Kannst du mir auch per PM schicken...

Hallo und einen schönen guten Abend.

Ich habe dasselbe Problem wie Jens.
Gibt es denn bereits dazu eine Lösung?

Ich nutze auch simulateStaticDocuments und
wenn ich das Ampersand entferne wird nichts mehr angehangen.

Vielen Dank für die Hilfe.

Grüße S.

Ich hab es nicht mit simulateStatic getestet. Werd ich mal tun und dann versuchen die Lösung hier zu posten.

Hallo, zuerst mal danke für diese gute Methode, die Schriftgrößen einfach zu verändern.

Ich habe jedoch ein Problem mit RealURL und der realurlconf.php. Mit der habe ich keinerlei Erfahrung. Google hat mir erklärt, dass ich sie ins Verzeichnis typo3conf legen muss und per

<?php include(PATH_typo3conf.'realurlconf.php'); php?>

in der localconf.php einbinden muss.

Wenn ich allerdings in der reaulurlconf wie von Arnie2001 beschrieben den Code

array(
'GETvar' => 'Fsize',
'valueMap' => array(
'n' => '0',
'g' => '1',
'gg'=> '2',
'nt'=> '3',

),
'noMatch' => 'bypass',
),

einfüge, dann bleibt meine Website weiß und zeigt gar nichts mehr an. Wenn ich die realurlconf nicht einbinde, funktioniert die Größenverändernung, allerdings wird sie nicht weitergegeben, d.h. wenn ich auf eine andere Seite klicke, wird die wieder in der Standardschriftgröße dargestellt. Was mache ich falsch?

Hier mein TS im Setup:

# Schriftgrößen:

[globalVar = GP:Fsize<1]
page.headerData.40 = TEXT
page.headerData.40.value =  <link href="fileadmin/templates/style-m.css" rel="stylesheet" type="text/css" />
[END]

[globalVar = GP:Fsize=1]
page.headerData.40 = TEXT
page.headerData.40.value =  <link href="fileadmin/templates/style-l.css" rel="stylesheet" type="text/css" />
[END]

[globalVar = GP:Fsize=2]
page.headerData.40 = TEXT
page.headerData.40.value =  <link href="fileadmin/templates/style-xl.css" rel="stylesheet" type="text/css" />
[END]

lib.schriftzoom = COA
lib.schriftzoom {
wrap = Schrift: |
40 = HTML
40 {
value = normal
value.wrap = &nbsp;|
value.typolink.parameter.data = page:uid
value.typolink.additionalParams = &Fsize=0
value.typolink.addQueryString = 1
value.typolink.addQueryString.method = GET
}
50 < lib.schriftzoom.40
50 {
value = gro&szlig;
value.wrap = &nbsp;&middot;&nbsp; |
value.typolink.additionalParams = &Fsize=1
value.typolink.addQueryString = 1
value.typolink.addQueryString.method = GET
}
60 < lib.schriftzoom.40
60 {
value = gr&ouml;&szlig;er
value.wrap = &nbsp;&middot;&nbsp; |
value.typolink.additionalParams = &Fsize=2
value.typolink.addQueryString = 1
value.typolink.addQueryString.method = GET
}

PS: Ich bin eher Gestalter als Programmierer, verzeiht mir also bitte etwaige blöde Fragen.

Hallo,

also das die Auswahl von einer Seite zur nächsten nicht übernommen wird, hat nichts mit RealURL zu tun, sondern sollte auch ohne funktionieren. Ich vermute aber mal, dass du den Code an der falschen Stelle in deine realurlconf.php eingebaut hast. Poste doch mal deine komplette RealURL Config.

Nun aber zu deinem eigentlichen Problem. Du musst darauf achten, dass du config.linkVars = Fsize setzt (siehe mein Code auf der ersten Seite), damit der Parameter auf weiteren Seiten übernommen werden. Außerdem müssen deine Links natürlich in TYPO3 erzeugt werden, d.h. wenn du einfach in dein Template schreibst <a href="index.php?id=3" /> dann werden da die Parameter natürlich nicht übernommen...

Grüße
Christian

Ahh! Gut, dass Du mich nochmal auf das config.linkVars = Fsize hingewiesen hast! Ich hatte es in die Constants geschrieben. Jetzt, wo ich ins Setup gesetzt habe, klappts!

Die Sache mit der RealURL ist nicht weiter wichtig. Ich finde es nicht weiter schlimm, wenn in der Adresszeile die Variable Fsize übergeben wird. Trotzdem der Vollständigkeit halber: Da ich keine realurlconf gefunden hatte, hatte ich eine neue angelegt und dort dann den Code von Arnie2001 reinkopiert.

Danke nochmal für Deine Hilfe!

Hallo,

erstmal vielen Dank für die super Erklärung. Leider bin ich noch auf ein Problem gestoßen welches hier anscheinend noch keiner hatte.

Ich habe Bilder genommen statt Buchstaben und möchte diese nun bei RO und ACT austauschen lassen.

Gibt es da eine Möglichkeit?

Grüße
Florian

Super Tutorial! Funzt einwandfrei und ist genau das, was ich gesucht hatte.
Besten Dank an den Ersteller.

Gruß

Guten Morgen alle zusammen!

Ich versuche seit zwei Tagen, vergebens das Ding zu Laufen zu bekommen und weiß absolut nicht mehr weiter!

Die Links werden angezeigt und die Variable auch übergeben.
index.php?id=19&Fsize=2
Aber es Passiert nichts!
Ich glaube, es hat irgendetwas mit meiner css datei zu tun, denn wenn ich in meiner stylez.css im body die fontsize auskommentiere, wird die fontsize der size2.css dargestellt!

[globalVar = GP:Fsize<1]
	page.includeCSS.file1 = fileadmin/templates/css/size0.css
	page.includeCSS.file1.title = Font Size Step 1
	page.includeCSS.file1.import = 1
	[END]
 
	[globalVar = GP:Fsize=1]
	page.includeCSS.file1 = fileadmin/templates/css/size1.css
	page.includeCSS.file1.title = Font Size Step 2
	page.includeCSS.file1.import = 1
	[END]
 
	[globalVar = GP:Fsize=2]
	page.includeCSS.file1 = fileadmin/templates/css/size2.css
	page.includeCSS.file1.title = Font Size Step 3
	page.includeCSS.file1.import = 1
	[END]
	
	page.includeCSS.file2 = fileadmin/styles.css
	page.includeCSS.file2.title = Styles für die Bildschirmausgabe 
	page.includeCSS.file2.import = 1

Vielleicht hat ja jemand eine Idee?
Viele Grüße
Flo

Die Reihenfolge ist entscheidend. Erst deine styles einbinden als file1 und dann die verschiedenen Größen als file2 danach, das sollte helfen...

Hallo Kitsunet.
Vielen Dank für den Tipp!
Hab die Reihenfolge geändert, leider ohne Erfolg.

Die Schriftgröße ist dann die der size2.css(95%), schon bevor ich auf A+ oder A++ gedrückt habe!.
Ich hab die size0.css mal zum Test mit der size2.css getauscht und nun zeigt er die size0.css(75%) an. Wenn ich dann auf A,A+ oder A++ drücke passiert garnichts!

        includeCSS.file1 = fileadmin/styles.css
	includeCSS.file1.title = Styles für die Bildschirmausgabe 
	includeCSS.file1.import = 1 
	
        [globalVar = GP:Fsize<1]
	includeCSS.file2 = fileadmin/templates/css/size2.css
	includeCSS.file2.title = Font Size Step 1
	includeCSS.file2.import = 1
	[END]
 
	[globalVar = GP:Fsize=1]
	includeCSS.file2 = fileadmin/templates/css/size1.css
	includeCSS.file2.title = Font Size Step 2
	includeCSS.file2.import = 1
	[END]
 
	[globalVar = GP:Fsize=2]
	includeCSS.file2 = fileadmin/templates/css/size0.css
	includeCSS.file2.title = Font Size Step 3
	includeCSS.file2.import = 1
	[END]

# my marks

	fsizemenu = COA
	fsizemenu.40 = HTML
	fsizemenu.40.value = A
	fsizemenu.40.value.typolink.parameter.data = page:uid
	fsizemenu.40.value.typolink.additionalParams = &Fsize=0
 
	fsizemenu1 = COA
	fsizemenu1.40 = HTML
	fsizemenu1.40.value = A+
	fsizemenu1.40.value.typolink.parameter.data = page:uid
	fsizemenu1.40.value.typolink.additionalParams = &Fsize=1
 
	fsizemenu2 = COA
	fsizemenu2.40 = HTML
	fsizemenu2.40.value = A++
	fsizemenu2.40.value.typolink.parameter.data = page:uid
	fsizemenu2.40.value.typolink.additionalParams = &Fsize=2