I have an image gallery composed of individual albums. All files and images are loaded to the site via single function which just loops through the files passed from the form via a standard html , so every file is loaded in the same way but just put in an appropriate folder.
The gallery was working fine until last night when 4 images loaded to one album would not display. This was traced to file permissions where the server suddenly assigned 600 rather than 644 (no permission assignments are made in the load function or anywhere else). Correcting the permissions resulted in the images displaying. However it was then found that a number of images in other albums were not displaying, whereas they had before. There were no issues with permissions.
Gallery page from Edge Chromium
So in the album page, the first album has a broken link and the second and third are OK, the forth is broken. The display is generated from a loop going through a table of the album metadata and picking up an image at random to display for each album. For the first two albums on the page the html from looking at the page source is,
<div >
<a href="media.php?mode=grid&album=18&activity_id=17">
<img src="media/A18-uke.JPG" width="210px" height="140px">
</a>
Altered Images - Cheryll Yeowell
</div>
<div >
<a href="media.php?mode=grid&album=17&activity_id=17">
<img src="media/A17-IMG_0322_edited-1a.jpg" width="210px" height="140px">
</a>
Chihuly at Kew - Liz Strange
</div>
If I look at the files in the media folder, both the image files are in there and from Filezilla I can view them, so the images are valid. The Filezilla folder listing shows both files the same as in the html above.
Filezilla listing of image files
The file names are the same as in the html above and both have permissions of 644; one is displaying and one not.
Out of interest I then looked at the page in Firefox and Chrome. None of the images displayed in those browsers.
Everything was working fine 3 days ago. No changes to scripts. Today, in Edge, some albums are fine, some only partially work, some not at all. Move to Chrome and Firefox and nothing now works. It's not involved html and, since it is all done in loops, every image is subject to the same code. One user has said that if there are some images showing and then the page is refreshed, all the image links display as broken, but I have not been able to replicate that.
I would welcome another set of eyes to either tell me what the silly mistake is or some inspiration as to what might be causing this apparent illogical behaviour.
Many thanks.
This is totally crazy - I am on my laptop and went to try the gallery on Edge, Firefox and Chrome and it all works perfectly. I haven't had any updates on close down over the past two days on my laptop or desktop and I've just checked the update logs and that doesn't show any. Since originally posting this I've had some more reports of problems from users. How can a facility be so apparently random in its working?
Just to make it more bizarre, today everything is back to normal. I haven't touched the code and all is back to how it should be. What would cause a set of image links to be broken (no other links on the site were broken to my knowledge) in a random fashion for 24 hours and then revert to being OK?
Related
Ok, so I have an HTML email with several inline images (charts and such). The images are embedded using CID. The email works perfectly fine on all desktop platforms. My issue is that the images are no longer inline when you try to open the email on iPhone (IOS mail app or IOS Outlook).
This is what they look like on IOS mail:
And this is what happens when you tap one of those boxes:
(contents of the image are irrelevant)
So, they load fine if you tap them individually, but I really need them to appear inline. Any idea whats going on? I thought maybe the images were too large, but one of the images is only 12kb and it still doesn't appear. In total the email is only about 850kb, which really shouldn't be too big either.
A few things to note:
It is definitely sending properly as an HTML email, as all of the CSS in the titles and the HTML tables (not shown) are working perfectly.
There is no "Download all images" link at the bottom of the email, as many of the suggestions I have found online seem to say.
I have "Download remote images" enabled in my settings.
All of the images are .png
Any ideas are appreciated.
I found the issue. For whatever reason this happens when I am making an absolute reference i.e. (C:\ReportEmail\Data\Logo.png) to the file path in my code. If I put the images in the same folder as the script and make a relative reference to the working directory i.e.(.\Logo.png) it works fine. I have no idea why this is the case, as the two types of references should be pretty much identical in usage. Oh well.
I uploaded a website online, and some of the images on of the pages does not display.
I have checked the path multiple times and I copied and pasted the src link, then just changed the name of the file, which was a number. eg: product1.jpg then product2.jpg, but the image of product 1 would display and not the image of product 2.
Is there anything else I can do to try fix it? Or find where the problem is?
Here is the product page of the current website.
Try using the debugger of the browser
On Chrome you can press F12, then go to the Sources section and check (and preview) the files the browser has recieved. If you see both pictures and you can preview them, then it is the HTML/CSS code of the page which, creates the problem. If you don't see them, the problem must be in the paths(check if you're using relative or absolute paths)
On Firefox you can press F12 and go to the Debugger section, and from there is is the same process.
My image thumbnail links to the full size image. Now only the image is showing up as some sort of code. I have been using the same HTML editor for years, all the pages are the same. It is only this group of 5 pages that have thumbnails. Take this link for example:
ÿØÿáExifII*ÿìDucky2ÿáyhttp://ns.adobe.com/xap/1.0/ ÿíHPhotoshop 3.08BIMZ%G8BIM%üá‰È·Éx/4b4XwëÿîAdobedÀÿÛ
I also discovered that if I get this code an then go up to the history and click on the name of the photo it pops right up as it should have been. I have no idea how to fix this. I have uploaded the photos several times with two file managers, used other photo software aswell. My editor shows that these pages are fine, but IE shows that the pages have no style and all browsers show the linked image problem.
I know this doesn't make much sense to you professionals, but this is my business website and a customer told me about the problem. After 8 hours of trying to fix this I am hoping you could help.
The problem:
This problem occurs when an IMG changes or got touched (by adobe, in your case) AFTER it was uploaded to the server and the name of the new (or modified) IMG remained the same. The image shown does not get refreshed. The old image is still shown, even though the database holds the right image. I have narrowed it down to the fact that the IMAGE IS CACHED in the web browser. If we hit the RELOAD button in Firefox/Explorer/Safari, everything gets refreshed fine and the correct image just appears.
I verified that on your site running the following:
function is_cached(img_url){
var imgEle = document.createElement("img");
imgEle.src = img_url;
return imgEle.complete || (imgEle.width+imgEle.height) > 0;
}
And then I called this function which returns true or false depending on cached or not:
is_cached("photos/back_to_school_pr5_tn.jpg");
And the result came back as:
<- true
Remember: When uploading an image, its filename is not kept in the database. It is renamed as Image.jpg (to simply things out when using it). When replacing the existing image with a new one, the name doesn't change either. Just the content of the image file changes.
Solution one - No code required:
Since you are not in the coding business (as you claim), all you need to do is to rename the IMG after it's been touched by adobe.
Whenever you modify a photo in adobe or you upload a new IMG you should give it a new name since the older version of the IMG IS STILL IN CACHE.
Solution two - Coding required:
If touching the IMG with adobe is a constant thing that you do after you upload the original picture, then the above solution can be an hassle, so you might want to look into ways to force the web browser to NOT cache images from this page.
NOTE: This solution is only good for the future. In your case, the IMG is already cached.
Besides, this will only work if the actual IMG is inside your HTML, but on your site the link takes you to the actual IMG.
Solution three - Coding required:
An important addition to the above solution is that you can never force a browser to do anything. All you can do is make friendly suggestions. It's up to the browser and the user to actually follow those suggestions. A browser is free to ignore this, or a user could override the defaults.
So the best long-term solution will be to save the filename with the database. This way, if the image is changed, the src of the IMG tag will also change.
For example:
<img src="picture.jpg?1222259157.415" alt="">
where "1222259157.415" is the current time on the server. (Note: I used python's time.time() to generate that)
I have a question about Font Awesome. I'm working on a school project, using the codes from codrops Split Layout. Until this point, I have replaced the code's broken font types with "Font Awesome". On my local computer, I've managed to make it work. Here are pictures of how it looks in 2 frames.
This first picture is without hoving over anything. All objects are fine and visible:
In my second picture, it shows how it looks when I hover on any button:
These pictures are taken on my computer. Until I uploaded them, it was all good. Whenever I have uploaded my files to web, I've seen these two pictures. One with no hover ( http://tinypic.com/m/i6ijix/4 ) and with hover on ( http://tinypic.com/m/i6ijj6/4 ).
On second set of pictures there are some shapes that appeared after uploading the files to web host and when I hover on them, the buttons misplace but not on the first two pictures. Can anyone explain why is this happening?
I think the problem is based within the files, try to reupload them. What's your html markup?
I had this problem with Glyphs over 10 times, file uploader was corrupting them and I had to use other FTP client.
I am having trouble getting the proper image to show up when I a link to my website in a status update. It is either grabbing an image from the front page which I don't want it to use (links to the front page) or no image at all (links to specific pages).
I found several tutorials that all gave the same advice about using a meta tag to specify which image to use, which I have done. Example Tutorial. Example:
<link rel="image_src" href="http://URL-TO-IMAGE" />
This had no effect. The article mentions that Facebook caches these lookups and provided a link to a URL Debugger, which was supposed to scrub that cache for me. I used it to verify that my meta tag was inserted properly (it was), but it had no effect on new status updates. Am I missing something? The way the tutorials talk gives me the indication that using this debugger will clear the Facebook cache for the page so that the next lookup will load and re-cache the proper image. Instead it seems that all this does is bypass the cache this one time for the purposes of testing.
Is there a way to actually force clear this cache, or do I just need to wait? It's been several days. How long does this cache take to expire?
Steps to Reproduce:
Visit Facebook News Feed or Timeline
Enter URL of my website in status update (can provide if neeeded)
Expected Outcome
The Favicon of my website is loaded as the icon for the status update
Actual Outcome
An image of a person (appears in the sidebar of our site) is used as the icon (for links to the front page. Links to the inner pages of the website load no icon at all.)
Further:
Visit the URL Debugger
Enter URL for website
Verify proper icon is loading
Post link in new status update.
Expected Outcome
FB's cache will be updated and the Favicon will now be used.
Actual Outcome
Nope... still the person from the sidebar on front page links and no icon at all for inner page links.
UPDATE 2/22/2013:
The image that loads when I post my URL to Facebook has changed! But it's still wrong :(.
I went to test it this morning and I now have an additional image as an option, which means Facebook did update what it's loading from the site, but it's still not the image that I specified in my tag. It's just grabbing another image from one of my other side bars, and I'm still not getting an image at all for my inner page.
It's weird.... the URL Debugger tool grabs the correct image, so I don't think the problem is my Meta tags. That's what the URL Debugger is supposed to help me identify. I think there's some disconnect between the lookup and what Facebook actually posts. I think this is a problem with Facebook, unless I'm missing something huge, but I don't see it....
UPDATE 2/25/2013:
I've made progress, but there's still something weird going on. Martey set me straight on the using the og: meta tags rather than just the tag. The tutorial I had been following said to ignore the Open Graph warnings, but once I started paying attention to them, I got some good information. Like, it actually said that my image is too small and that it will use another image instead. Guess I should have paid attention :)
Anyway, so the issue was that the favicon is too small. According to the Open Graph warning, it needs to be 200 pixels in both directions. So I grabbed the actual header logo and tried to use that. It's 340 pixels wide. Oops, it was only 164 pixels tall.
So I used The GIMP to set it onto a transparent background that was 200 pixels tall and tried again, but it's still telling me it's too small. It's no longer telling me that it needs to be 200 pixels. It just says that it's too small.
I'm stumped again...
Update 2/25/2013: Issue Resolved
The problem was transparency. I filled the background in white and tried again and now it's loading fine.
Thanks for your help, Martey!
Instead of using a third party tutorial, you should refer to Facebook's official OpenGraph documentation. They recommend using an og:image metatag to refer to document images.
As I noted in my comment, issues with data not updating on Facebook is likely to be the result of misformatted or wrong OpenGraph metatags. Without the URL of the troublesome page, or information on the URL Debugger's warnings, it is difficult to recommend solutions.