Jump to content

[SOLVED] Custom text over image


gopepe

Recommended Posts

Hi there,

 

I have recently upgraded to php5 and a small code I wrote four years ago has stopped working.

 

The idea is that at http://gopepe.com/newspaper/index.php custom text should appear inside the image. Now, the text no longer appears.

 

The code is as follows:

<html>

<head>

<title>News Bulletin</title>
</head>

<body style="font-family: Arial; font-size: 10pt">

<p><b></b><br>
Add caption to the image </p>
Type text here
<form method="POST" action="index.php">
<input type="text" name="text" size="20" maxlength="50"><br>
  <input type="submit" value="Submit" name="submit">
</form>
<br>

<?php
$imgfile="newsheader.jpg";
if(isset($text) && $text!="") 
print "<img border='0' align=center src='img.php?imgfile=newsheader.jpg&text=$text' width='720' height='212'>";
else
print "<img border='0' align=center src='newsheader.jpg' width='720' height='212'>";
?>


</body>

</html>

 

 

I know that this will probably be a simple solution, but my knowledge of php is negligible and nothing I have tried  has yet to work.

 

Many thanks!

Link to comment
Share on other sites

Sorry!

 

Here is the edited code:

 

<html>

<head>

<title>News Bulletin</title>
</head>

<body style="font-family: Arial; font-size: 10pt">

<p><b></b><br>
Add caption to the image </p>
Type text here
<form method="POST" action="index.php">
<input type="text" name="text" size="20" maxlength="50"><br>
  <input type="submit" value="Submit" name="submit">
</form>
<br>

<?php
$imgfile="newsheader.jpg";
if (isset($_POST['text'][0]))
print "<img border='0' align=center src='img.php?imgfile=newsheader.jpg&text=$text' width='720' height='212'>";
else
print "<img border='0' align=center src='newsheader.jpg' width='720' height='212'>";
?>


</body>

</html>

 

Link to comment
Share on other sites

<html>

<head>

<title>News Bulletin</title>
</head>

<body style="font-family: Arial; font-size: 10pt">

<p><b></b><br>
Add caption to the image </p>
Type text here
<form method="POST" action="index.php">
<input type="text" name="text" size="20" maxlength="50"><br>
  <input type="submit" value="Submit" name="submit">
</form>
<br>

<?php
$imgfile="newsheader.jpg";
if (isset($_POST['text'][0]))
print "<img border='0' align=center src='img.php?imgfile=newsheader.jpg&text=".$_POST['text']."' width='720' height='212'>";
else
print "<img border='0' align=center src='newsheader.jpg' width='720' height='212'>";
?>


</body>

</html>

 

But if you view the actual image:

 

http://gopepe.com/newspaper/img.php?imgfile=newsheader.jpg&text=test

 

It just says Unknown Image Format. What's the code for that page?

Link to comment
Share on other sites

<html>

<head>

<title>News Bulletin</title>
</head>

<body style="font-family: Arial; font-size: 10pt">

<p><b></b><br>
Add caption to the image </p>
Type text here
<form method="POST" action="index.php">
<input type="text" name="text" size="20" maxlength="50"><br>
  <input type="submit" value="Submit" name="submit">
</form>
<br>

<?php
$imgfile="newsheader.jpg";
if (isset($_POST['text'][0]))
print "<img border='0' align=center src='img.php?imgfile=newsheader.jpg&text=".$_POST['text']."' width='720' height='212'>";
else
print "<img border='0' align=center src='newsheader.jpg' width='720' height='212'>";
?>


</body>

</html>

 

But if you view the actual image:

 

http://gopepe.com/newspaper/img.php?imgfile=newsheader.jpg&text=test

 

It just says Unknown Image Format. What's the code for that page?

 

As I said, it used to work before the upgrade to php5, hence my surprise. The code for img.php is:

 

 

<?php
//=========== change the text to display in the image
//$text = 'mydomain.com';
//$imgfile="newsheader.jpg";
$font = 'arial.ttf';
$ext=substr($imgfile,-3);
$ext=strtolower($ext);

if($ext=="jpg" || $ext=="jpe") $im=@imagecreatefromjpeg("$imgfile");
elseif ($ext=="gif") $im=@imagecreatefromgif("$imgfile"); 
else {print "Unknown image format"; exit;}

if (!$im) { /* See if it failed */
       $im = ImageCreate (200, 100); /* Create a blank image */
       $bgc = ImageColorAllocate ($im, 255, 255, 255);
       $tc  = ImageColorAllocate ($im, 0, 0, 0);
       ImageFilledRectangle ($im, 0, 0, 150, 30, $bgc); 
       /* Output an errmsg */
       ImageString($im, 1, 5, 5, "Error loading $imgfile", $tc); 
return $im;
   }

$x=imagesx($im);
$y=imagesy($im);
$fontsize=$x/20;
$fontsize=floor($fontsize);
if($fontsize<20) $fontsize=20;

$black = imagecolorallocate($im, 100, 100, 100);


imagettftext($im, $fontsize, 0, 0, 150, $white, $font, $text);

if($ext=="gif") 
{
header("Content-type: image/gif");
imageGIF($im);
}
else
{
header("Content-type: image/jpeg");
imagejpeg($im);

}
imagedetroy($im);
?>

 

 

Link to comment
Share on other sites

$ext=substr($imgfile,-3);

 

to

$imgfile = $_GET['imgfile'];
$ext=substr($imgfile,-3);

 

Thanks for the help everyone.

 

The image is no longer broken after submitting the form, but it just returns the original blank image without any blank text.

 

Ozestretch, when I make that amendment, I receive the following error:

Parse error: syntax error, unexpected T_ELSE in /hermes/bosweb/web199/b1992/ipw.gopepeco/public_html/newspaper/index.php on line 25
Link to comment
Share on other sites

I am assuming it is not getting $text either.

 

//=========== change the text to display in the image
$text = 'mydomain.com';
$imgfile="newsheader.jpg";

 

uncomment like above, see if it displays the image with the text 'mydomain.com'

 

Yep. Regardless of what text I input into the box, it returns with 'mydomain.com'

Link to comment
Share on other sites

okay, good :)

 

now change

$text = 'mydomain.com';

to

$text = $_GET['text'];

 

Ah! It now returns to the image without text...  :P

 

Just to make sure I have not missed out any parts of the code, the codes for the two files are as follows:

 

index.php

<html>

<head>

<title>News Bulletin</title>
</head>

<body style="font-family: Arial; font-size: 10pt">

<p><b></b><br>
Add caption to the image </p>
Type text here
<form method="POST" action="index.php">
<input type="text" name="text" size="20" maxlength="50"><br>
  <input type="submit" value="Submit" name="submit">
</form>
<br>

<?php
$imgfile="newsheader.jpg";
if (isset($_POST['text'][0]))



print "<img border='0' align=center src='img.php?imgfile=newsheader.jpg&text=$text' width='720' height='212'>";
else
print "<img border='0' align=center src='newsheader.jpg' width='720' height='212'>";
?>


</body>

</html>

 

 

img.php

<?php
//=========== change the text to display in the image
$text = $_GET['text'];
$imgfile="newsheader.jpg";
$font = 'arial.ttf';
$imgfile = $_GET['imgfile'];
$ext=substr($imgfile,-3);
$ext=strtolower($ext);

if($ext=="jpg" || $ext=="jpe") $im=@imagecreatefromjpeg("$imgfile");
elseif ($ext=="gif") $im=@imagecreatefromgif("$imgfile"); 
else {print "Unknown image format"; exit;}

if (!$im) { /* See if it failed */
       $im = ImageCreate (200, 100); /* Create a blank image */
       $bgc = ImageColorAllocate ($im, 255, 255, 255);
       $tc  = ImageColorAllocate ($im, 0, 0, 0);
       ImageFilledRectangle ($im, 0, 0, 150, 30, $bgc); 
       /* Output an errmsg */
       ImageString($im, 1, 5, 5, "Error loading $imgfile", $tc); 
return $im;
   }

$x=imagesx($im);
$y=imagesy($im);
$fontsize=$x/20;
$fontsize=floor($fontsize);
if($fontsize<20) $fontsize=20;

$black = imagecolorallocate($im, 100, 100, 100);


imagettftext($im, $fontsize, 0, 0, 150, $white, $font, $text);

if($ext=="gif") 
{
header("Content-type: image/gif");
imageGIF($im);
}
else
{
header("Content-type: image/jpeg");
imagejpeg($im);

}
imagedetroy($im);
?>

Link to comment
Share on other sites

Works for me: http://gopepe.com/newspaper/img.php?imgfile=newsheader.jpg&text=test

 

So that means the form code is the wrong bit. Should be like so:

 

<html>

<head>

<title>News Bulletin</title>
</head>

<body style="font-family: Arial; font-size: 10pt">

<p><b></b><br>
Add caption to the image </p>
Type text here
<form method="POST" action="index.php">
<input type="text" name="text" size="20" maxlength="50"><br>
  <input type="submit" value="Submit" name="submit">
</form>
<br>

<?php
$imgfile="newsheader.jpg";
if (isset($_POST['text'][0]))



print "<img border='0' align=center src='img.php?imgfile=newsheader.jpg&text=".$_POST['text']."' width='720' height='212'>";
else
print "<img border='0' align=center src='newsheader.jpg' width='720' height='212'>";
?>


</body>

</html>

Link to comment
Share on other sites

Forgot the change of $text to $_POST['text'] below

<html>

<head>

<title>News Bulletin</title>
</head>

<body style="font-family: Arial; font-size: 10pt">

<p><b></b><br>
Add caption to the image </p>
Type text here
<form method="POST" action="index.php">
<input type="text" name="text" size="20" maxlength="50"><br>
  <input type="submit" value="Submit" name="submit">
</form>
<br>

<?php
$imgfile="newsheader.jpg";
if (isset($_POST['text'][0]))



   print "<img border='0' align=center src='img.php?imgfile=newsheader.jpg&text=".$_POST['text']."' width='720' height='212'>";
else
   print "<img border='0' align=center src='newsheader.jpg' width='720' height='212'>";
?>


</body>

</html>

 

and then in second part comment out

$text = $_GET['text'];
//$imgfile="newsheader.jpg";
$font = 'arial.ttf';

Link to comment
Share on other sites

Now, one more thing. Do you know how I can align the text to the centre of the image please?

 

Was my first thought when I seen the text to the left.

 

Don't think you have posted that part of the code yet ;)

 

haha.

 

There are actually only four items in the folder:

index.php

img.php

newsheader.jpg

arial (font-type)

 

I have posted the complete codes for index.php and img.php.

Do you have any idea?

 

Once again, thank you for this!

Link to comment
Share on other sites

So have... found a little snippet you might be able to use:

 

<?php
//=========== change the text to display in the image
$text = $_GET['text'];
$font = 'arial.ttf';
$imgfile = $_GET['imgfile'];
$ext=substr($imgfile,-3);
$ext=strtolower($ext);

if($ext=="jpg" || $ext=="jpe") $im=@imagecreatefromjpeg("$imgfile");
elseif ($ext=="gif") $im=@imagecreatefromgif("$imgfile"); 
else {print "Unknown image format"; exit;}

if (!$im) { /* See if it failed */
       $im = ImageCreate (200, 100); /* Create a blank image */
       $bgc = ImageColorAllocate ($im, 255, 255, 255);
       $tc  = ImageColorAllocate ($im, 0, 0, 0);
       ImageFilledRectangle ($im, 0, 0, 150, 30, $bgc); 
       /* Output an errmsg */
       ImageString($im, 1, 5, 5, "Error loading $imgfile", $tc); 
   return $im;
   }

$x=imagesx($im);
$y=imagesy($im);
$fontsize=$x/20;
$fontsize=floor($fontsize);
if($fontsize<20) $fontsize=20;

$black = imagecolorallocate($im, 100, 100, 100);

/*
* Add this
*/
$tb = imagettfbbox($fontsize, 0, $font, $text);
$x = ceil((200 - $tb[2]) / 2); // lower left X coordinate for text
imagettftext($im, $fontsize, 0, $x, 150, $white, $font, $text); // write text to image
/*
* End Add
*/

// comment this out
// imagettftext($im, $fontsize, 0, 0, 150, $white, $font, $text);

if($ext=="gif") 
   {
   header("Content-type: image/gif");
   imageGIF($im);
   }
else
   {
   header("Content-type: image/jpeg");
   imagejpeg($im);

   }
imagedetroy($im);
?>

Link to comment
Share on other sites

So have... found a little snippet you might be able to use:

 

<?php
//=========== change the text to display in the image
$text = $_GET['text'];
$font = 'arial.ttf';
$imgfile = $_GET['imgfile'];
$ext=substr($imgfile,-3);
$ext=strtolower($ext);

if($ext=="jpg" || $ext=="jpe") $im=@imagecreatefromjpeg("$imgfile");
elseif ($ext=="gif") $im=@imagecreatefromgif("$imgfile"); 
else {print "Unknown image format"; exit;}

if (!$im) { /* See if it failed */
       $im = ImageCreate (200, 100); /* Create a blank image */
       $bgc = ImageColorAllocate ($im, 255, 255, 255);
       $tc  = ImageColorAllocate ($im, 0, 0, 0);
       ImageFilledRectangle ($im, 0, 0, 150, 30, $bgc); 
       /* Output an errmsg */
       ImageString($im, 1, 5, 5, "Error loading $imgfile", $tc); 
   return $im;
   }

$x=imagesx($im);
$y=imagesy($im);
$fontsize=$x/20;
$fontsize=floor($fontsize);
if($fontsize<20) $fontsize=20;

$black = imagecolorallocate($im, 100, 100, 100);

/*
* Add this
*/
$tb = imagettfbbox($fontsize, 0, $font, $text);
$x = ceil((200 - $tb[2]) / 2); // lower left X coordinate for text
imagettftext($im, $fontsize, 0, $x, 150, $white, $font, $text); // write text to image
/*
* End Add
*/

// comment this out
// imagettftext($im, $fontsize, 0, 0, 150, $white, $font, $text);

if($ext=="gif") 
   {
   header("Content-type: image/gif");
   imageGIF($im);
   }
else
   {
   header("Content-type: image/jpeg");
   imagejpeg($im);

   }
imagedetroy($im);
?>

 

Great! Thank you very much! I really appreciate your help!  :D

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.