how to pass php generated image into html meta tag
Asked Answered
A

3

9

Im trying to pass a merged image from php into a html meta tag (for a twitter summary card if you're wondering) but the data of the image is not being passed. When I run this code I get no errors from html or php:

PHP

$dest = imagecreatefromjpeg('http://www.website.com/Some-images/'.$postID.'.jpg'); 
$src = imagecreatefromjpeg('http://www.website.com/media/dog.jpg');



imagealphablending($dest, false);
imagesavealpha($dest, true);


imagecopymerge($dest, $src, 10, 9, 0, 0, 181, 180, 100); 

HTML

<meta name="twitter:image" content="'.$dest.'">

I'm not 100% sure that you can even pass a raw image at all into the content attribute of the meta tag but I'm thinking there should be a way to do this and I'm also thinking that this is what is causing the image to not show. I'm open to an html/css solution if a php solution is not possible. I've been stuck on this for a while so any suggestions and input you might have will be mighty appreciated. Thank You!

EDIT

I should add that this is a php script so the html is being created like this:

$html = '

<html>
<head>

<meta name="twitter:image" content="'.$dest.'">

</head>
<body>

</body>
</html>

';

echo $html;
Accepter answered 28/8, 2016 at 7:41 Comment(5)
If you put var_dump($dest); into your code, do you see the value of $dest showing, or nothing at all?Sandstone
@MartinParkin yeah I get the output: "resource(3) of type (gd)"Accepter
I think your problem is that you're loading the resource into the webpage, but you're never actually displaying it (i.e, have no <img> tag.)Americanism
This won't work. 'imagecopymerge' returns the image data, which has to be saved to a file with 'imagejpg', this file then has to be referenced in the HTML. Alternative: You reference the PHP file in HTML and output the file without saving (also with 'imagejpg', but without the second parameter).Moises
Link about Twitter cards for anyone else who is unfamiliar: dev.twitter.com/cards/markup Looks like you'll need to break this into two bits, one html page which has the reference to the image url, and one php script which directly outputs the image (plenty of questions on SO on how to do that). So, basically, what @Moises said.Americanism
M
11

This won't work. 'imagecopymerge' returns an image resource, which has to be sent to the browser as an image or saved to the server hard disk a file with 'imagejpeg'. If it's directly sent to the browser (first option), this PHP file then has to be referenced in the HTML.

So basically, in your HTML, reference to a PHP file, with your postid parameter:

<meta name="twitter:image" content="image.php?postid='.$postID.'">

In the file image.php create your file and output it (you should also add some validation code for $_GET['postid'] here):

<?php
$dest = imagecreatefromjpeg('http://www.website.com/Some-images/'.$_GET['postid'].'.jpg'); 
$src = imagecreatefromjpeg('http://www.website.com/media/dog.jpg');

imagealphablending($dest, false);
imagesavealpha($dest, true);

imagecopymerge($dest, $src, 10, 9, 0, 0, 181, 180, 100); 

header('Content-Type: image/jpg');
imagejpeg($dest);
?>
Moises answered 6/9, 2016 at 22:37 Comment(1)
Thanks a million for this I wish I could give you more points but as you can see I'm kinda running low. This method works great!Accepter
D
6

You could use base64

$dest = imagecreatefromjpeg('http://www.website.com/Some-images/'.$postID.'.jpg'); 
$src = imagecreatefromjpeg('http://www.website.com/media/dog.jpg');

imagealphablending($dest, false);
imagesavealpha($dest, true);

imagecopymerge($dest, $src, 10, 9, 0, 0, 181, 180, 100); 

$img = base64_encode($dest);

then use that string in the tag

<meta name="twitter:image" content="data:image/png;base64,<?php echo $img; ?>">
Distinct answered 6/9, 2016 at 22:59 Comment(1)
For some reason, I can't get the twitter card to work with base64 encoding but thank you anyway!Accepter
S
1

If you want to place the contents of a PHP variable into some HTML you need to echo the variable into the HTML attribute by placing it inside a PHP code block.

Something like this should achieve the aim:

<meta name="twitter:image" content="<?php echo $dest; ?>">
Sandstone answered 28/8, 2016 at 7:48 Comment(1)
Thank you for the suggestion but I tried your solution and still no dice :( I have also edited my question to give more informationAccepter

© 2022 - 2024 — McMap. All rights reserved.