Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Embedded fonts, is this possible? 2

Status
Not open for further replies.

1DMF

Programmer
Jan 18, 2005
8,795
GB
I've been searching to find a way to use my own fonts, I have heard there is OET & PFR formats to do this.

I have found a site called true docs which seems to have a solution, but when I try the sample code in my html file nothing changes. any ideas why, here is my code.

Code:
<head>
<title>Interior design</title>
<LINK REL=FONTDEF SRC="[URL unfurl="true"]http://www.truedoc.com/pfrs/Amelia.pfr">[/URL]
<script language="JavaScript" src="[URL unfurl="true"]http://www.truedoc.com/activex/tdserver.js">[/URL]
</script>
<link>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="style.css" rel="stylesheet" type="text/css">
</head>
[code]

then I simply use the the font face command like so
[code]
<font face="Amelia BT">Company Name</font>

but the text is displayed with the standard font in the css file.

why is this not working ?
 
Google up "fahrner image replacement"

I've used something similar at for the headings.

If you look in the code they are standard <h1> tags but these are converted into images on the fly as the page is sent to the browser.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 
Hey FoamCow, is that your site, nice work!

Unfortunately it seems you are using some kind of PHP to generate the image on the fly, which I obviously cannot view the source as it will just give me the .png file when the source is called.

Plus I know nothing about PHP, although I think my web host will run PHP , I do server side via PERL.

I also found this when googling that fahrner thing and got this.

Just to refresh your memory, the Fahrner Image Replacement technique works like this: you decide you want to replace, say, a header containing text with an equivalent image. So, you wrap the text in a span, hide the span with display: none, and set your image as a background-image on the header. That's it, as seen here:


<style type="text/css">
<--
// Hide the text in the header (which is contained in the span)
h1#firt span { display: none; }
h1#firt {
height: 35px; /* height of the replacement image */
background-image: url("hello-world.gif");
background-repeat: no-repeat;
}
-->
</style>

<h1 id="firt"><span>Hello world!</span></h1>

Well if I read this code correctly I could have done the same thing with the <img> tag, there has to already be an image with the wording on it?

I need something that is dynamic and works on the fly. Can you give me any further help, or explain what i've missed.

Regards,
1DMF
 
Nope
The images ARE generated on the fly by a PHP script and are based on the content of the h1 element (and/or other elements at your discretion).
You simply pass some text to the script and it returns an image or series of images.

The generated images can also be cached to prevent server load (though for me that isn't really an issue).

Here's a better explanation, the source of the original scripts. I guess it's not really Farhner Image Replacement, but that was the original source of the technique.




Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 
1DMF,
I like this idea of yours! This supposedly can be done with Image::Magick in Perl. I'm trying to whip up an example, but I'm not coming close for now.
Module Documentation can be found at:

Please let me know if you get this to work on the Perl side. I too could find a use for it.

Hmmm... I wonder it this in regard to your "HTTP_REFERER post"

X
 
I have been having a look at this application and it is interesting. I gather that PHP has functions for direct access to and the manipulation of font files. There would also be a need to create an image, PNG? Is this functionality part of PHP?
I would be looking to create a PERL solution.

Keith
 
FoamCow, can you help, I have the heading.php file running and if i do the test
Code:
heading.php?text=my_test
[\code]
, I get the image in the font i uploaded with the ttf.

I've implemented the javascript file and included the extra CSS commands.

however when the page is rendered the normal text flashes for a second and then disappears, no image is displayed just the text vanishes where the <h2> tags are surrounding it.

any ideas why i'm getting this behaviour?

Xaqte : Thanks for the kind words, unfortunately there is no way to do what I need for my other project, the HTTP_REFERER is the only environment variable available, which can be spoofed or simply withheld, so the only other alternative is to trap the server IP running the form being submitted, only that's an environment variable also so I assume can be spoofed also, IP spoofing has been a bane in techies sides for ages, at the end of the day the way the internet is, unless you have technology and stuff like the FBI, you can be as annoyomous as you like, and even the FEDS have trouble tracking you down.

It's going to need legislation change before this type of simple security can be easily implemented into web pages.

Great idea though, but I got others, maybe that one will be my best seller :-P
 
Hey Foamy, I worked it out if you have a <td> tag with bgcolor = '#blah', it covers up the image, it must be something to do with layers, and the bg color is over the front of the image.

This is a bit of a pain as how do i colour the background of the table and display the image in the foreground?

either way, i have found the PHP script to be pretty handy and definately deserves a star.

You can even call it via an <img> tag with the src="heading.php?text=my text?colour=mycol" etc.. and really make it customizable.

Thanks a million foamy, your a diamond!
 
Without looking at it closely (no time right now) it sounds like you may be having a "flicker" issue.
Guess what? It's an IE thing. A bug actually.

If you look at that "A List Apart" article there is mention of this problem and a fix for it.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 
Incidentally, some may ask why I didn't just use images for the targetweb site headings.

Well, I wanted to make the headings dynamic as the press release and "T-Time" articles are all pulled from a database and simple admin system.
Saves me work at the end of the day as I'm the only web dev at the company.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 
it's ok , i prefer to use the <img> tag option, and pass it the url data, i can then dynamically build the text, color,font type all in the URL and display the image, also that doesn't cause a flicker problem.

Nope everything is working fantastic thanks, all you need is the heading.php script and a little editing :)

my sincere gratitude to you foamy.
 
There is a benefit to using h1 (or other text) tags in that they are properly read by crawlers, screen readers and the like.

If the image generation fails for some reason the page will degrade gracefully in as much as the text will still be readable as plain old HTML text.

Foamcow Heavy Industries - Web design and ranting
Target Marketing Communications - Advertising, Direct Marketing and Public Relations
I wonder what possesses people to make those animated gifs. Do you just get up in the morning and think, "You know what web design r
 
1DMF,
it's ok , i prefer to use the <img> tag option, and pass it the url data, i can then dynamically build the text, color,font type all in the URL and display the image, also that doesn't cause a flicker problem.

So, all you really want is an image with dynamically generated text on it?

Presuming the above is true, and I know your more of a Perl junkie so here ya go:
Code:
#!/usr/bin/perl 

use strict;
use warnings;
use Image::Magick;
use CGI qw(-no_xhtml :standard :html4);

my $os = $ENV{'HTTP_USER_AGENT'};
my $style = "/home/1DMF.css"

my $img_file = 'banner.gif';
my $im = Image::Magick->new();
my $rc = $im->Read($img_file);
 die $rc if $rc;
                       
$rc = $im->Annotate(
     gravity => "Center",
     text => "Company Name",
     font => "AMELIABT.TTF",
     pointsize => 18,
);
  die $rc if $rc;

$rc = $im->Write("1.gif");
   die $rc if $rc;

my $tag = '<img src="/Test/1.gif" />';
web("$tag");

sub web{
   my $goto = shift;
print
     header,
     start_html(-title=>'Interior design',
                            -style=>{'src'=>$style},
                            -dtd=>4),
     h1("Hello"),
     $tag,
end_html;
}

Sorry if I'm just shooting blanks here!
 
No Xaqte, you're firing on all cylinders, i appreciate the post.

Can you explain this bit though please, i think your using CGI to build a HTML page, I don't use this method and would normally build a string with the HTML code and print it to the screen.

Code:
sub web{
   my $goto = shift;
print
     header,
     start_html(-title=>'Interior design',
                            -style=>{'src'=>$style},
                            -dtd=>4),
     h1("Hello"),
     $tag,
end_html;
}

is there a way of acheiving the FoamCow approach for images that fail to be created, I guess before printing the result you could do something like this instead of

Code:
die $rc if $rc;

use this
Code:
if($rc){print
     header, $cgi->param('text');}
else{my $tag = '<img src="/Test/1.gif" />';
web("$tag");}

i've assumed you can get the value pairs from the URL calling the CGI using ->param, i'm unsure if this only works with post data, if it is wrong, can you advise how i get the URL value pairs via Get Method.

Many Thanks,

1DMF
 
1DMF,
I was just using the CGI method as a simple example. But I'm glad to have sparked your interest. Let me take this one step at a time to make sure we are both going the right direction with this.
...i think your using CGI to build a HTML page, I don't use this method and would normally build a string with the HTML code and print it to the screen.
I'm assuming by this you mean something similar to this:
Code:
#!/usr/bin/perl

use strict;
use warnings;
my $title = "Interior Design";
print '<HTML><HEAD><TITLE>';
print $title;
print '</TITLE></HEAD>';
print '<BODY>';
print "Welcome to $title";
print '</BODY></HTML>';
If this is true, then I suggest using a template engine. But, you can get the value pairs from the URL using CGI if want to go that route. There are many great ones out there. I personally use Template Toolkit. It is not that difficult to pick up. But once you do, you'll never look back. So, let me show you the template way:
First the script-
Code:
#!/usr/bin/perl 

use strict;
use warnings;
use Template;
use Image::Magick;


$| = 1; 
print "Content-Type: text/html; charset=iso-8859-1\n\n";

  my $config = {
      INTERPOLATE  => 1,               # expand "$var" in plain text
      POST_CHOMP   => 1,               # cleanup whitespace 
      EVAL_PERL    => 1,               # evaluate Perl code blocks
  };

my $tt = Template->new($config);

my $input = '1DMF.tmpl';

my $style;
my $data;

my $img_file = 'banner.gif';
my $im = Image::Magick->new();
my $rc = $im->Read($img_file);
 die $rc if $rc;
                       
$rc = $im->Annotate(
     gravity => "Center",
     text => "Company Name",
     font => "AMELIABT.TTF",
     pointsize => 18,
);
  die $rc if $rc;

$rc = $im->Write("1.gif");
   die $rc if $rc;

my $tag = '<img src="/Test/1.gif" />';
web("$tag");

 

sub web{
   my $img = shift;
  $data->{'img_tag'} = $tag;
  
$tt->process($input, $data)
	|| die $tt->error();
}
Now in the template (1DMF.tmpl), you would have something along these lines:
Code:
[% INCLUDE header %]
<body>
     [% IF img_tag %]
	[% img_tag %] 
     [% ELSE %]
     <img  src="heading.php?text=my text?colour=mycol" />
     [% END %]   
</body></html>
Of course, I just gave you a small taste what using templates could offer. Sorry if I went off the deep end.

X
 
hmmm, don't like this template thing, Also in your example I don't use multiple print statements only one, eg..

Code:
my $screen = "
<HTML>
<HEAD>
BLAH BLAH
</HTML>";

print $screen;

also why does the template use heading.php ? i'm guessing this is a typo.

can i not do this...

in the HTML main page
Code:
<img src="heading.cgi?text=my text&col=my col&size=my size">

the script as follows....
Code:
#!/usr/bin/perl 

use strict;
use warnings;
use Image::Magick;
use CGI qw(-no_xhtml :standard :html4);

my $cgi = new CGI;
my $tag = "";
my $os = $ENV{'HTTP_USER_AGENT'}; # why is this here ?

my $img_file = 'banner.gif';
my $im = Image::Magick->new();
my $rc = $im->Read($img_file);
if($rc){$tag = $cgi->param('text');}
            
# WHERE TO I SELECT COLOUR ????
           
$rc = $im->Annotate(
     gravity => "Center",
     text => $cgi->param('text'},
     font => $cgi->param('font'},
     pointsize => $cgi->param('size'),
);
if($rc){$tag = $cgi->param('text');

$rc = $im->Write("1.gif");
if($rc){$tag = $cgi->param('text');
else{$tag = '<img src="/Test/1.gif" />';
}
print $tag,

exit();

basically either display the image of the text or just the text.

hope you get what i mean



 
1DMF,
Yes you can do this the cgi way you have proposed. Although, you may be missing some of the cgi parts (the header, end_html...)- You've got the right idea with using this method with cgi.
also why does the template use heading.php ? i'm guessing this is a typo.
No, that wasn't a typo. Its one of the ways to include a header using Template Toolkit.

my $os = $ENV{'HTTP_USER_AGENT'}; # why is this here ?

Oops, I accidently left this in from one of my scripts. I sometimes use this to use alternate stylesheets based on browser type.

As far as the color:
Code:
$rc = $im->Annotate(
     gravity => "Center",
     text => "Company Name",
     font => "AMELIABT.TTF",
     fill => "blue",  #Here is your color
     pointsize => 18,
);
  die $rc if $rc;

There are a number of other paramaters available for this though. Have a look at the link in my first response, alot of good info can be found here.

If you have problems with the cgi part, you may want to post your newly made code to:
forum452

If you do post it in that forum, you may want to include a link to this post. If this is the case, I'll look for ya in that forum.

Best of luck to you!

X
 
Thanks, I'm a little confused still over the use of a PHP script to produce a heading in PERL CGI.

I've looked through the link and all I can find about colour is this..
Colorize fill=>color name, opacity=>string

I wan't to pass it the HEX code for colour not a name, can i do this?

1DMF
 
Yes, HEX codes work (just tested it to be sure):
Code:
$rc = $im->Annotate(
     gravity => "Center",
     text => "Company Name",
     font => "AMELIABT.TTF",
     fill => "#871F78",  #Here is your color
     pointsize => 18,
);
  die $rc if $rc;

Thanks, I'm a little confused still over the use of a PHP script to produce a heading in PERL CGI.
This is the work of Template Toolkit. It is similar to header function your thinking of in PHP.

X
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top