I am trying to insert an image from database to twitter card (link) but the links appearing in the tweet without an image
example of the tweet card (link)
tried to make a default image for the tweet card and it work perfectly
but when i try to retrieve the name of the image from the database and put it in the <meta> it shows up as an empty image in twitter
tried also echoing $picture and the path shows up as its in the database : /image.png
<head>
<?php
//identify the user
$un = $_SESSION['active_user'];
//query to get that specific users information
$query = "SELECT * FROM users WHERE username='$un'";
//save the query in result variable
$result = $db->prepare($query);
//excecute the variable result
$result->execute();
//if the result has records in the database save the users info in the variables below
if ($row = $result->fetch())
{
//validation variables
$emptyFields = false;
$error = false;
$success = false;
$n = $row['name'];
$usn = $row['username'];
$picture=$row['picture'];
}
echo "<meta property='twitter:card' content='summary'>";
echo "<meta property='twitter:site' content=''>";
echo "<meta property='twitter:title' content=''>";
echo "<meta property='twitter:description' content=''>";
echo "<meta property='twitter:image' content='https://website.com/".$picture."'>";
echo "<meta name='twitter:creator' content='#abc'>";
echo "<meta name='twitter:text:title' content='website'>";
?>
what am i missing here ? is the way i am retrieving data ? please i would try any suggestion
i do not know how you saved the image to the location or to the database, but based on your question,
Read this and see if you missed something
twitter:image is a url to a unique image representing the content of the page. You should not use a generic image such as your website logo, author photo, or other image that spans multiple pages. Images for this Card support an aspect ratio of 1:1 with minimum dimensions of 144x144 or maximum of 4096x4096 pixels. Images must be less than 5MB in size. The image will be cropped to a square on all platforms. JPG, PNG, WEBP and GIF formats are supported. Only the first frame of an animated GIF will be used. SVG is not supported.
and also one more thing, it seems like you saved the entire or part of the image directory on the database, based on database : /image.png in your question. Note that this is not good practice since you might have to access the image from different pages of your website, and even though its not impossible, it's not worth it, just sve the image name only like image.png
Related
I'm still new on php. I'm currently building a website which a user can upload an image to change their profile picture.
The file of image will we insert into table user, row image location on database and directory "upload". The formatting is like abc.jpeg
My code for the <img> tag, which is where I display the profile image. But the image does not appear. Only the thumbnail image is displayed and not the exact image.
<img src=<?php
$current = $fgmembersite->UserEmail();
if ($handle = opendir('upload/')) {
$sql = "SELECT image_location FROM user WHERE email='$current'";
//$file = mysql_real_escape_string($sql);
if ((file_exists('upload/'.$sql) == $sql)) {
echo 'upload/'.$sql.'.png';
} else if (file_exists('upload/'.$sql)) {
echo 'upload/'.$sql.'.jpg';
}
}
closedir($handle);
?> alt="">
If you don't mind, can you check my code and see where I went wrong? Thank you for your helping.
Image is successfully fetching from database but it not be shown by the PHP. In place of image it shows a iamge thumbnail.
If I use header('Content-type:image/jpg'); it will show the only thumbnail all page contents disappear.
include 'functions/connect.php';
$user = $_SESSION['email'];
$sql = "SELECT photo FROM user WHERE email='$user'";
$run_sql = mysqli_query($conn,$sql);
$row = mysqli_fetch_array($run_sql);
$user_photo =$row['photo'];
echo"<p><img src='$user_photo'></p>";`
You can try something like this:
<img alt="<?php echo $user_photo; ?>" src="uploads/<?php echo $user_photo; ?>" /> // Upload is folder where image was uploaded
It depends on what the field "photo" contains. If the photo field contains the location of the picture on your system, then the way you have done it should work. However, if the field contains the actual photo in binary format (having field data type as 'blob') then you'll need to do the following:
file_put_contents("image.jpg", $user_photo);
echo "<p><img src='image.jpg' ></p>";
I don't know if I'm doing it right, but I have a bunch of images I'm retrieving from the page and since I don't wan a page to have too many images of big sizes, I have displayed them with a much smaller size but I have attached each of them to a link so that when a user click on a picture it opens that image with its original size. The problem is that those images are really big and my client wants the ability to zoom in and out which I don't know how to do. The client thought about resizing the size of the window (in the browser) but sadly it resizes all other windows (for the application) and this is not ok because he needs to see the image and compare it with some information on the app. SO Below is the code of the images displayed and after the user have clicked on the image.
small images
$count = 0;
echo " <div class=\"row\">";
while($row = $result->fetch_assoc()) {
$ext = $row['Extension'];
$ImageID=$row['ImageID'];
if(($count%3) ==0){
echo "</div>";
echo " <div class=\"row\">";
echo " <div class=\"col-sm-2\">";
echo " <a href=\"viewimage.php?ImageID=$ImageID\" class=\"thumbnail\">";
echo '<img id=\"myImg\" src="data:image/$ext;base64,'.base64_encode( $row['Image'] ).'" style=\"width:130px;height:130px\"/>';
echo"</a></div>";
++$count;
}else{
echo " <div class=\"col-sm-2\">";
echo " <a href=\"viewimage.php?ImageID=$ImageID\" class=\"thumbnail\">";
echo '<img id=\"myImg\" src="data:image/$ext;base64,'.base64_encode( $row['Image'] ).'" style=\"width:130px;height:130px\"/>';
echo"</a></div>";
++$count;
}
}
echo "</div>" ;
Image after link is clicked
<?php
$ImageID = $_GET['ImageID'];
$query = "Select * from $dbname.Images where ImageID = $ImageID";
$result = mysqli_query($conn,$query);
$row = $result->fetch_assoc();
$ext = $row['Extension'];
echo '<img src="data:image/$ext;base64,'.base64_encode( $row['Image'] ).'"/>';
?>
I don't know what to do at this point, how can I provide that zoom in/out functionality?
First things first: Generally don't add base64 encoded images directly into your html. Link to them, and host them on your server. It is quite an expensive way of making images appear, both for the server, database, and for the client. It also makes it impossible for the client to cache the images, and it means that each repeated page visit causes the entire data to be sent.
Make two folders on your webservers:
images/
thumbnails/
Put your small images in "thumbnails" and large images in "images"
And if you need to, store the image-names in your database, so you can do something more like this:
echo '<img src="images/'+$imageName+'">'
If you want to, you can do an on-demand resizing of your images, using gd-lib.
The basic idea being, in pseudocode:
//Before the echo command, but after fetching the filename from database
if thumbnails/$imageName exists
then use gdlib to read images/$imageName and save a small version to thumbnails/$imageName
This approach is also applicable if you want to use client-side javascript to show larger versions on the same page. See my page finalkey.net for an example http://finalkey.net/gallery
Consider I have an image named "car.jpg".
I have multi-language stores in my site and client wants to show the same image in various languages. Like car is called voiture in French so the image name should be "voiture.jpg", but it will show the same image i.e. car.jpg.
Also while saving / downloading the image it should get saved as voiture.jpg from the French store and car.jpg from the English store.
I have plans to input the names of the images from the client via a back-end panel, but can’t get ideas about how to implement this in front-end.
Note:- The image is not on my server
I have copied the image on fly and can use it as below, using class upload, but need a better option than coping image as there are above 4000 images.
<img src='./media/scene7/car.jpg' alt='car'>
<?php
include('class.upload.php');
$img = new Upload('media/scene7/car.jpg');
if ($img->uploaded) {
$img->file_new_name_body = 'voiture';
$img->file_auto_rename = false;
$img->file_overwrite = true;
$img->Process('./media/scene7/translated/');
}else{
}
echo "<br /><br />Car is called voiture in French, you are seeing the image of voiture.<br />";
?>
<img src='./media/scene7/translated/voiture.jpg' alt='car'>
<?php
if ($img->uploaded) {
$img->file_new_name_body = 'auto';
$img->file_auto_rename = false;
$img->file_overwrite = true;
$img->Process('./media/scene7/translated/');
}else{
echo "not uploaded";
}
echo "<br /><br />Car is called auto in German, you are seeing the image of auto.<br />";
?>
<img src='./media/scene7/translated/auto.jpg' alt='car'>
<?php
if ($img->uploaded) {
$img->file_new_name_body = 'coche';
$img->file_auto_rename = false;
$img->file_overwrite = true;
$img->Process('./media/scene7/translated/');
}else{
echo "not uploaded";
}
echo "<br /><br />Car is called coche in Spanish, you are seeing the image of coche.<br />";
?>
<img src='./media/scene7/translated/coche.jpg' alt='car'>
<?php
$img = new Upload('http://s7d7.scene7.com/is/image/zeon/Stack_Mouse');
if ($img->uploaded) {
echo 'uploaded image from url';
}else{
echo $img->error;
}
?>
you can have images as blobs in your database and give names as you like it.
pros and cons for storing images as blobs can be find out from the below link
php:Store image into Mysql blob, Good or bad?
Have a database table that lists all the image filenames that you want to display to the user, along with their real URLs. For example, the table might have
+-------------+--------------------------+
|FILENAME |URL |
+-------------+--------------------------+
|car.jpg |./media/scene7/car.jpg |
|voiture.jpg |./media/scene7/car.jpg |
|auto.jpg |./media/scene7/car.jpg |
|truck.jpg |./media/scene7/truck.jpg |
|camion.jpg |./media/scene7/truck.jpg |
|lastwagen.jpg|./media/scene7/truck.jpg |
+-------------+--------------------------+
Now write a page image.php, which expects a filename as a query parameter. It should take the query parameter and look it up in the database table, then do a redirect to the URL that it finds.
You can then include your image in the page as something like
<img src="image.php?file=voiture.jpg" alt="voiture.jpg"/>
When the browser requests this image, your page will be called, and the image will end up coming from .media/scene7/car.jpg.
You can make a hash table like 'car' => 'car.jpg' and 'voiture' => 'car.jpg'. when every time the clients visits voiture.jpg you can return car.jpg.
You can achive this by implemetlnting one cofig file for each language. Here is explanation:-
Suppose you have some images like user.jpg, profile.jpg etc.
Now create one french.php file.
Structure of french.php file:-
<?php
$lang=array();
$lang['user']='french_transalation_of_user';
$lang['profile']='french_transalation_of_profile';
?>
In same way add all your image names which you want to display in french. Now call these names dynamically in webpage. You can also create as many as language.php as you want.
I hope you understand the logic. Sorry for bad english.
I have two separate files, one is to display the html/php document image, and the other is a php file that renders the image using the header function content-type:image/jpeg.
I tried using it with one image and it works well. However, I need to display multiple images. How could I do this?
The html/php doc has an img tag that points out to the php file that renders the image
echo "<image src=Image.php>";
The image.php
$selectimage = mysql_query("SELECT Image from ImageTbl", $con);
if($selectimage)
{
header("Content-type:image/jpeg");
while($row = mysql_fetch_array($selectimage))
{
echo $row["Image"];
}
}
make two files one for image another for fetching the row like this
image.php
$image_id = $_GET["id"];
header("Content-type:image/jpeg");
//query database to get only one image from id
echo $row["Image"];
another file
getimages.php
//query for image data
while($row = mysql_fetch_array())
{
echo "<img src='image.php?id=$row[id]' />";
}
You can't output all the images together, because to the browser, it will look like the data of multiple images mushed together, which is nonsensical. Also, each image tag can only display one image. To solve this, give the image table an ID field to identify the image.
Then in the file that outputs HTML, do something like this (passing the ID for the image you need):
echo "<image src='Image.php?id=1>";
echo "<image src='Image.php?id=2>";
echo "<image src='Image.php?id=3>";
And then in the file that outputs the image, do:
$id = intval($_REQUEST['id']); // intval will validate the ID to be an int
$selectimage = mysql_query("SELECT Image from ImageTbl WHERE id=$id LIMIT 1", $con);
if ($selectimage) {
$row = mysql_fetch_array($selectimage);
if ($row) { // check if the image really exists
header("Content-type:image/jpeg");
echo $row["Image"];
}
}
Use a foreach loop to loop through the requested records and echo them out independently to the img tags which your using.
That would be the best way in my opinion.
If you want to display number of different images using one script, try to add some unique hash to the script name ( for e.g. md5( microtime() ) )
$seed = md5( microtime() );
echo '<image src="Image.php' . $seed . '">';