|
Wednesday 11 August 2004 3:02:40 am
I wanted to create coloured image buttons and headers without using photoshop. I found a lot of topics in the forum about the use of True Type Fonts (ttf) in combination with the Texttoimage function. I 've put it all together below.
Texttoimage is the Exponential function that converts text to an image. Ideal for creating buttons or nice headers.
It works more or less like this: {'Amazing Button Text'|texttoimage('arial')}
You can paste this in a .tpl (pagelayout.tpl) to see what happens...
Texxtoimage is further explained here: http://ez.no/ez_publish/documentation/development/libraries/ez_template/operators/image_handling I didn't want to use the boring Arial but the more spectacular Willies Super Bold font that I have as willy.ttf on my Windows computer. I uploaded my new font as willy.ttf to design/standard/fonts. (as pointed out by Jan in http://ez.no/community/forum/install_configuration/texttoimage_how_is_working_/re_texttoimage_how_is_working_) It should be place in my site's design directory (design/corporate/fonts) but for some reason it didn't work out) After that i added an entry to settings/texttoimage.ini [willy]
Family=willy
PointSize=14
XAdjustment=0
YAdjustment=0
WidthAdjustment=8
HeightAdjustment=6
BackgroundColor=#FFFFFF
TextColor=#000066
(Thanks to Ekkehard for pointing this out in http://ez.no/community/forum/suggestions/dynamic_heading_generator) I changed the pagelayout.tpl {'Amazing Button Text in Willies Font'|texttoimage('willy')}
to see it work. I wanted to use various colours. This had to be changed in the settings/texttoimage.ini. There I added 4 more entries. [willy-blue]
Family=willy
PointSize=14
XAdjustment=0
YAdjustment=0
WidthAdjustment=8
HeightAdjustment=6
BackgroundColor=#FFFFFF
TextColor=#004E9E
[willy-red]
Family=willy
PointSize=14
XAdjustment=0
YAdjustment=0
WidthAdjustment=8
HeightAdjustment=6
BackgroundColor=#FFFFFF
TextColor=#B11A3B
[willy-green]
Family=willy
PointSize=14
XAdjustment=0
YAdjustment=0
WidthAdjustment=8
HeightAdjustment=6
BackgroundColor=#FFFFFF
TextColor=#006C3A
[willy-yellow]
Family=willy
PointSize=14
XAdjustment=0
YAdjustment=0
WidthAdjustment=8
HeightAdjustment=6
BackgroundColor=#FFFFFF
TextColor=#F6BE62
To conclude I changed the pagelayout.tpl {'Happy Things for Blue People'|texttoimage('willy-blue')}
{'Happy Things for Red People'|texttoimage('willy-red')}
{'Happy Things for Green People'|texttoimage('willy-green')}
{'Happy Things for Yellow People'|texttoimage('willy-yellow')}
It made me happy... Another usefull thread is: http://ez.no/community/forum/setup_design/texttoimage_how_to_set_character_size
|