Right, so this is a really simple - and likely somewhat stupid one. Apologies in advance.
I've got a site that has three URLs that go to the same site. Web server is apache, virtual host is done proper with StieAlias(es) so that if someone visits the site via URL1.com, the browser just sees URL1.com and then URL2.com, URL3.com - you get the idea.
Now the issue is the user wants to display a certain logo based on the base URL. So if they do:
www.URL1.com --> logo1.gif
www.URL2.com --> logo2.gif
www.URL3.com --> logo3.gif
Totally elementary, but I've never done it before. Site is PHP and I'm decent enough with PHP I suppose but I've got no idea even where to start on this one.
TIA.
You could do that with some javascript code:
<script type="text/javascript">;
var host = location.host;
// here we use the location to build the image name
// for example, for stackoverflow the image name would be: `stackoverflow.com.jpg`
document.getElementById('myImage').src = host+'.jpg';
</script>
and then in your html use:
<img id="myImage" src="" />
Check this JSFiddle that I've created for you. You can inspect the image element and check its source.
Assuming your logo file is located in the images folder with the file name URL1-logo.png.
PHP
$mylogotoload = $_SERVER['SERVER_NAME'];
echo '<img src="images/'.$mylogotoload.'-logo.png" />';
Related
I have a website that I am designing and I want to use a folder in a google drive to store the images. The issue is that I can't seem to find how to get the URL for these images. The actual use of this needs to be that anyone with permissions for the google folder can drop in an image and it will show up when you load the page.
I have the php looping figured out and I am just short the path for the <img src="" >.
At the moment even just getting one image statically from google drive would be a start.
If I understand what you are aiming for, it's pretty much hosting the images from the Google Drive. Looked around the community and found some stuff that I think is what you're looking for or at the very least, can help you have an idea on how to do it.
First, is from this answer. You just have to use this URL format:
https://drive.google.com/uc?export=view&id=<fileId>
-- providing the file ID. There is a note though, Note: this link seems to be subject to quotas. So not ideal for public/massive sharing. But this proves that you can retrieve the files (in your case, images) from the file drive.
Second, is the top answer from the same post as above. Simply states that it is very much possible, provided that you put the files in a public folder, then retrieve it using the following URL:
https://googledrive.com/host/<folderID>/<filename>
Lastly, is to follow the tutorial video. It's similar to the second answer where the image should also be shared publicly (haven't really tried to tweak around, try it out maybe it can also work if it's only shared selected users), get the shared link and use gdurl.com which will turn the shared link and turn it into a hosted link which will be a direct link to the image.
Here is a simple example:
Problem: The image url that you get from sharing a google drive image will be something like this
Simple Solution:
(**a) https://drive.google.com/file/d/{this part will contain the image ID that we need}/view?usp=sharing
But to use image we need url something like this
(**b) https://drive.google.com/uc?id={this part will contain the image ID that we need}
So the simple thing we can do is manually copying that part of the image ID from (**a) url and pasting in the (**b) url.
Automating using JavaScript:
let sharableLink = (**a); //paste the google drive image sharing link here
let baseUrl = "https://drive.google.com/uc?id=";
let imageId = sharableLink.substr(32, 33); //this will extract the image ID from the shared image link
let url = baseUrl.concat(imageId); //this will put the extracted image id to end of base Url
Here 32 and 33 are the starting and ending position of the image ID to be extracted from the shared image link.
AddOn:
You can create a simple HTML to get the converted image Url from the sharable link.
HTML:
sample.html
<!DOCTYPE html>
<html>
<head>
<body>
</div>
<!-- container for url and button to load it -->
<div class="thumbnail-container">
<input
type="text"
id="edt-thumbnail-url"
name="thumbnail-url"
placeholder="Thumbnail Url">
<div>
<button class="btn btn-load-thumbnail" id="btn-load-thumbnail">Upload Thumbnail</button>
</div>
</div>
<!-- script that runs the code for conversion -->
<script src="/sample.js"></script>
</body>
<head>
</html>
now create a javascript file and paste this
sample.js
const productThumbnailUrl = document.getElementById("edt-thumbnail-url");
const btnUploadThumbnail = document.getElementById("btn-load-thumbnail");
btnUploadThumbnail.addEventListener("click", (e) => {
e.preventDefault();
let str = productThumbnailUrl.value;
let baseUrl = "https://drive.google.com/uc?id=";
let imageId = str.substr(32, 33);
let url = baseUrl.concat(imageId);
productThumbnailUrl.value = url; //this will put the converted url in the edit text box
console.log(url);
});
On my html page, I make use of images which are housed in a local folder. The paths are coming directly from the database field. How can I do this? I know it wont work if the images are not in the web root directory. Can symlinks work?
For example,
The physical path to the images is c:/Images and the database field will contain the path like this, photo/image1.jpg
I will fetch the image source path from php as shown below,
<img id="image1" src="<?php echo $this->object->imagePath; ?>" class="img-polaroid">
$this->object->imagePath here will be the string concatenation of c:/Images and photo/image1.jpg. So, putting it together t will be c:/Images/photo/image1.jpg
The problem is it does not show up. I have tried this as well to test,
<img id="image1" src="file:///C:/Images/photo/image1.jpg" class="img-polaroid">
But no luck.
first let me know if putting just C:/Images/photo/image1.jpg in a browser address bar brings an image or not. If not then that's mean you are giving wrong path. Let me know so i can edit this answer. But for now this is the answer i hope.
Symlink to the folder worked like a charm.
We're trying to create a trackback system where an outside web publisher can put some html on a page on their website that links back to a specific product page on our site. Let's call it a 'badge' for purposes of this question.
Once they've inserted the badge, we want to identify this, then grab the < h1 > and first < p > as a teaser to comprise a link from our site back to theirs and write all this stuff to our database. Then, our users can see the title and first bit of their page, then decide if they want to see more.
Here's what we've done (not much I'm afraid):
<a href="http://www.mysite.com/abc.html">
<img alt="abc" src="http://www.mysite.com/logo.gif" style="width:200px;height:100px" />
</a>
We're planning to build an admin page to do the last part of grabbing the < h1> and < p> and posting it to the live database, etc. and we'll figure this out later.
However, the middle step (identifying that this piece of html has been used) we're at a loss.
Is this something we should be doing through a log file....I have no clue even how to begin thinking about it.
A little direction of where to begin working on this problem would be very helpful.
Thanks in advance!!
This is one approach.
You give them HTML which looks something like:
<a href="http://www.mysite.com/abc.html">
<img alt="abc" src="http://www.mysite.com/logo.php" style="width:200px;height:100px" />
</a>
Notice that says logo.php, not logo.gif.
logo.php will live on your server. Its purpose is twofold:
Gather information about the page holding the <img> tag
Load and output logo.gif so the users see the image as expected.
If you embed that html on a webpage somewhere, logo.php will have information about where the request for the image originated. Specifically, $_SERVER['HTTP_REFERER'] will give you the complete URL to the page where the img tag resides. It is then up to you to decide how to process and store that information.
I don't know exactly what you want to do, but a very simplified logo.php would look something like this:
<?php
$url = $_SERVER['HTTP_REFERER'];
// do something with $url...
// it will be something like "http://theirsite.com/wherever/they/pasted/the.html"
// now output the logo image...
header("Content-Type: image/gif");
echo file_get_contents("/path/to/logo.gif");
Keep in mind that every time anyone hits their page with the image tag, logo.php will be run. So don't accidentally create 10000 links back to their site on your site :)
I am trying to do the following; dynamically pick a server with the image on it, and then show said image in img src="". Yeah I know, I am horrible at explaining stuff like this but this should clear it up:
dl-main.php (on server0.domain.com)
$url = 'http://server2.domain.com/offerimage.php?f='.$_GET["f"];
header( 'Location: '.$url ) ;
offerimage.php (on server2.domain.com)
//Lots of link-protection stuff here
$f = "/".$_GET["f"];
$url = 'http://server2.domain.com'.$uri_prefix.$m.'/'.$t_hex.$f;
echo' <img src="'.$url.'"></img> ';
dl.php (on many other servers)
img src="http://server0.domain.com/dl-main.php?f=lalala.gif"
So it pretty much goes like this: Random person adds img src directing to dl-main.php?f=filename on server0. server0 then decides which server will provide the image. In the above example I am using only one server; server2
Now I simply want dl.php to show the photo hosted on server2.domain.com .
As it stands when I directly visit dl-main.php it succesfully redirects me to dl.php, which then succesfully shows me the image I requested. But when I use dl-main.php in a img src it doesn't show the image. I didn't expect it to work but it was worth a shot, but now I don't know what to do anymore :o
I hope this failed attempt is a good example of what I'm trying to accomplish here.
Thanks!
Here's the problem. You call image from server0 using:
<img src="http://server0.whatever/dl-main.php?f=thatimage.something" />
Where the dl-main.php code redirects to server2. Here, you do:
echo' <img src="'.$url.'"></img> ';
So basically the original img tag would get another img tag instead of the image data. That's why the browser can't render the image. You should echo the content of the image instead of an img tag.
Try using your browser's developer tools and check the request to server2 to verify my guess.
It can't work, your second script (offerimage) is producing text/plain, you should produce image/...in order to use img
I have some thumbnail images with its larger version.I placed the thumbnail images in a page.Now for link I just gave a link
<img src="thumbnail1.jpg>
but for this I have to make different pages for showing larger one.I want to give a link to show them in a single page.means whenever I will click the thumbnail it will open the larger one in a page with the same url but with its name like
imagegallery.php?news=images/largerimage1/13.jpg
imagegallery.php?news=images/largerimage1/14.jpg
so how to do that?
Pretty basic stuff, I suggest you get to read some PHP tutorials on the internet to get some knowledge on one thing and another.
The ?news= part in your URL is a parameter that can be read by PHP. This type is known as $_GET. To get this part you would need $_GET['news'] so if we'd use your first link and place this inside a script: echo $_GET['news']; the page would say images/largerimages1/13.jpg.
In order to get the image loaded on your website we need some simple steps, I'm changing the news parameter into image, that suits better for your script since it ain't news items:
<?php
// Define the path (used to see if an image exists)
$path = 'your/absolute/path/to/public_html/'; # or wwwroot or www folder
// First check if the parameter is not empty
if($_GET['image'] != "") {
// Then check if the file is valid
if(file_exists($path . $_GET['image'])) {
// If an image exists then display image
echo '<img src="'. $_GET['image'] . '" />;
}
}
?>
Below this script you can put all your thumbnails the way you want. Ofcourse, also for these thumbnails there are some automated options. But I strongly suggest you get a good look at the script above and some beginner PHP tutorials so you completely understand the example given. This still isn't the best method, but it's kicking you in the right direction.
if your imagegallery.php is in root of your domain, you can just add slash as a first char to links like this:
<img src="thumbnail1.jpg>
else you will have to write some php function which it returns BaseUrl of your web. Then it should looks like this:
<img src="thumbnail1.jpg>
maybe you can something like this,
Techincally, there is no thumbnail image, just a stretch version of the regular image
I don't understand which part you don't know how to do:
- the link part?
it should look like
<img src="thumbnail1.jpg>
- or the PHP part (the file called imagegallery.php)?