[drupal-devel] Dynamic Text Replacement
I plan on making themes with 'fancy' or non standard fonts. The only other practical way, opposed to CSS is to use PHP and GD, to replace the text with images. I have found a method at 'A List Apart', (link here:http://www.alistapart.com/articles/dynatext/) which uses JavaScript to strip user selected tags and replace them with an image, created by GD in a user selected font, size and style. Any True Type or Open Type font can be used, leaving a very large choice for the end user. The PHP file can be located in the themes directory, but the question I want to ask is how would you implement the JavaScript. Would it be best to code it directly into the head of the theme template (using phpTemplate by the way), or create a module that get Drupal to print it to the head on page creation. the second way would be best, as then Drupal handles everything, and you could turn it on and off, as well as have an interface to select for fonts and styles, but would it be okay to have a theme dependant on an external contributed module? It would be possible for new themes to become 'Text replacement ready', and would include the fonts, and pre-made PHP file, so if the module was enabled, it would auto-find the files and handle the replacement for the user. I would like to hear your ideas on the subject, whether you think it would be useful, or a waste of time. -- Nathan
On Wednesday 23 March 2005 07.52, Solon wrote:
I plan on making themes with 'fancy' or non standard fonts. The only other practical way, opposed to CSS is to use PHP and GD, to replace the text with images.
The best way I know of is using JS, CSS and Flash, called sIFR: http://www.mikeindustries.com/blog/archive/2004/08/sifr This works nicely and also degrades nicely.
On Wednesday 23 March 2005 07.52, Solon wrote:
I plan on making themes with 'fancy' or non standard fonts. The only other practical way, opposed to CSS is to use PHP and GD, to replace the text with images.
The best way I know of is using JS, CSS and Flash, called sIFR:
http://www.mikeindustries.com/blog/archive/2004/08/sifr
This works nicely and also degrades nicely.
This method is dependant on flash, while the other is PHP. I feel that the one that runs PHP is more practical because it can be integrated easily with Drupal, and will be compatible with all users who run Drupal. With flash, it throws another requirement in the mix, and I feel, at a users end, it will be much better to use the PHP file. Any ideas on how to implement it?
On Mar 23, 2005, at 3:09 AM, Solon wrote:
On Wednesday 23 March 2005 07.52, Solon wrote:
I plan on making themes with 'fancy' or non standard fonts. The only other practical way, opposed to CSS is to use PHP and GD, to replace the text with images.
The best way I know of is using JS, CSS and Flash, called sIFR:
http://www.mikeindustries.com/blog/archive/2004/08/sifr
This works nicely and also degrades nicely.
This method is dependant on flash, while the other is PHP. I feel that the one that runs PHP is more practical because it can be integrated easily with Drupal, and will be compatible with all users who run Drupal. With flash, it throws another requirement in the mix, and I feel, at a users end, it will be much better to use the PHP file.
The only problem with the PHP-only version is that the 'fancy' fonts would need to be installed on the web server. Most web servers don't have many fonts installed because their primary function is not GUI. You would require the Drupal admin to install fonts on the server. And in addition to being a pain in the butt, many shared/virtual server hosting companies won't allow it. The sIFR stuff is very cool, surprisingly well supported, and you can use any font you want without having to install anything on the server system. -Jeff
Op donderdag 24 maart 2005 14:17, schreef Jeff Robbins:
The sIFR stuff is very cool, surprisingly well supported, and you can use any font you want without having to install anything on the server system.
Another reason why you should choose for sIFR is that it downgrades very nice. an image is... an image, blind readers (including bots like Google)cannot read that. Regards, Bèr -- [ Bèr Kessels | Drupal services www.webschuur.com ]
Bryght.com uses sIFR to great effect (thanks steven) On 24 Mar 2005, at 3:24 PM, Bèr Kessels wrote:
Op donderdag 24 maart 2005 14:17, schreef Jeff Robbins:
The sIFR stuff is very cool, surprisingly well supported, and you can use any font you want without having to install anything on the server system.
Another reason why you should choose for sIFR is that it downgrades very nice. an image is... an image, blind readers (including bots like Google)cannot read that.
Regards, Bèr -- [ Bèr Kessels | Drupal services www.webschuur.com ]
-- Adrian Rossouw Drupal developer and Bryght Guy http://drupal.org | http://bryght.com
Solon wrote:
On Wednesday 23 March 2005 07.52, Solon wrote:
I plan on making themes with 'fancy' or non standard fonts. The only other practical way, opposed to CSS is to use PHP and GD, to replace the text with images.
The best way I know of is using JS, CSS and Flash, called sIFR:
http://www.mikeindustries.com/blog/archive/2004/08/sifr
This works nicely and also degrades nicely.
This method is dependant on flash, while the other is PHP. I feel that the one that runs PHP is more practical because it can be integrated easily with Drupal, and will be compatible with all users who run Drupal. With flash, it throws another requirement in the mix, and I feel, at a users end, it will be much better to use the PHP file.
Any ideas on how to implement it?
sIFR is dead easy to implement as it can all be done in the theme. You simply include the .js file in header, decide which elements you want to sIFRize, and add a simple statement with a CSS selector (e.g. "#main h1" or ".comment h3"). Making the .swf file is very easy (just check the sIFR website for help). There are a couple things to watch out for, but really it's all been documented and commented on. Oh and note that sIFR should handle UTF-8 / Unicode appropriately, which is another hurdle when you want to use GD. As far as I know, GD and Unicode text output don't mix. Steven Wittens
How does this affect printing pages & server load? On Fri, 25 Mar 2005 00:16:01 +0100, Steven Wittens <steven@acko.net> wrote:
Solon wrote:
On Wednesday 23 March 2005 07.52, Solon wrote:
I plan on making themes with 'fancy' or non standard fonts. The only other practical way, opposed to CSS is to use PHP and GD, to replace the text with images.
The best way I know of is using JS, CSS and Flash, called sIFR:
http://www.mikeindustries.com/blog/archive/2004/08/sifr
This works nicely and also degrades nicely.
This method is dependant on flash, while the other is PHP. I feel that the one that runs PHP is more practical because it can be integrated easily with Drupal, and will be compatible with all users who run Drupal. With flash, it throws another requirement in the mix, and I feel, at a users end, it will be much better to use the PHP file.
Any ideas on how to implement it?
sIFR is dead easy to implement as it can all be done in the theme. You simply include the .js file in header, decide which elements you want to sIFRize, and add a simple statement with a CSS selector (e.g. "#main h1" or ".comment h3"). Making the .swf file is very easy (just check the sIFR website for help). There are a couple things to watch out for, but really it's all been documented and commented on.
Oh and note that sIFR should handle UTF-8 / Unicode appropriately, which is another hurdle when you want to use GD. As far as I know, GD and Unicode text output don't mix.
Steven Wittens
I plan on making themes with 'fancy' or non standard fonts. The only other practical way, opposed to CSS is to use PHP and GD, to replace the text with images. I would use CSS + PHP + GD, basically the idea is to include in your header (in the theme) a link to a generated css file, containing only the style definitions for the image replacement. For example the relevant H1s. It can be done as inline styling in the theme as well.
To be able to assign fonts, etc... you will need to modify one of the theme engines, AFAIK. or write a module, but then UI interface and paths consistency start grinning at you. I'm eyeing this idea for some time, but just don't have enough time to play with it.
I have found a method at 'A List Apart', (link here:http://www.alistapart.com/articles/dynatext/) which uses JavaScript to strip user selected tags and replace them with an image, created by GD in a user selected font, size and style. Any True Type or Open Type font can be used, leaving a very large choice for the end user.
The PHP file can be located in the themes directory, but the question I want to ask is how would you implement the JavaScript. Would it be best to code it directly into the head of the theme template (using phpTemplate by the way), or create a module that get Drupal to print it to the head on page creation. Both are valid methods, if you want configurability, then module is probably the better way, as the template path will most probably require engine modification (adding extra config options, might be wrong, not an expert), and different template engines handle things differently.
A hook for extending the template form? Have no clue, but sound like a good idea to me. Any opinion, or a ready resolution?
Op 23-mrt-05 om 10:20 heeft Vladimir Zlatanov het volgende geschreven:
I plan on making themes with 'fancy' or non standard fonts. The only other practical way, opposed to CSS is to use PHP and GD, to replace the text with images. I would use CSS + PHP + GD, basically the idea is to include in your header (in the theme) a link to a generated css file, containing only the style definitions for the image replacement. For example the relevant H1s. It can be done as inline styling in the theme as well.
To be able to assign fonts, etc... you will need to modify one of the theme engines, AFAIK. or write a module, but then UI interface and paths consistency start grinning at you.
I'm eyeing this idea for some time, but just don't have enough time to play with it. I did this twice, but unfortunatly the themes are lost due to switching servers.. :-( You can do this quite good with a plain PHP-theme and simple GD 2 (Which is recommended by drupal since the introduction of the image-api)..
Do not forget that the generated headers should be cached into a writtable directory inside your theme.. (Not nessecarilly in your theme, but it's the most logical place I can think of..) Here are the bookmarks from Safari I used some time ago to generate my node-titles with, maybe you can use them: - http://www.php.net/manual/nl/function.imageantialias.php - http://www.php.net/manual/nl/function.imagecolortransparent.php - http://www.php.net/manual/nl/function.imagettftext.php - http://www.php.net/manual/nl/function.imagefttext.php - http://www.php.net/manual/nl/function.imagefontheight.php - http://nl2.php.net/manual/nl/function.imagefontwidth.php Good luck! Stefan.
Both are valid methods, if you want configurability, then module is probably the better way, as the template path will most probably require engine modification (adding extra config options, might be wrong, not an expert), and different template engines handle things differently.
A hook for extending the template form? Have no clue, but sound like a good idea to me. Any opinion, or a ready resolution?
I am a graphic designer, so module creation would not be a strong point of mine, but I am willing to give it a go. I plan on having the module ask the user what tags they would like removed, assigning a font/ style to those tags and modifying/ creating a php file to handle the image creation. The javascript would then be outputted to the page <head> tag through the same method that other JavaScript and meta information is sent already. In phpTemplate the tag is <?php print $head ?>, so whatever method sends this data, I will look into. I will be leaning towards php and gd2, as it is supported by Drupal, and as I said, I do not want to add another requirement to Drupal installations.
participants (9)
-
Adrian Rossouw -
Bèr Kessels -
Chris Messina -
Jeff Robbins -
Karoly Negyesi -
Solon -
Stefan Nagtegaal -
Steven Wittens -
Vladimir Zlatanov