Unsplash prefers that users of their API hotlink images from urls that they provide.
Seems almost silly to be asking this, but for some reason this simple piece of code is not working when trying to hotlink an image, whose url I grab from the Unsplash API:
<img src="https://images.unsplash.com/photo-1484995342839-a9eb42974616?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&s=3c7ad78ab40416cdfae002147d8b8003">
This url comes is found in their GET photo response under: photo.urls.small
It is probably a minor oversight on my part, anyone see my mistake?
Problem was an extension called Privacy badger on Chrome that is blacklisting the link.
When I test the code it works. Possibly a cache issue?
<img src="//images.unsplash.com/photo-1484995342839-a9eb42974616?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&s=3c7ad78ab40416cdfae002147d8b8003">
It is because of the parameter in that image URL. Do try by eliminating the parameters after "?" and just pass the remaining URL as below:
https://images.unsplash.com/photo-1484995342839-a9eb42974616
Related
I developed some html pages with social sharing functionalities like Facebook, Twitter and LinkedIn etc.
But now, I have some problem to change LinkedIn image.
To share on LinkedIn I use platform.linkedin.com/in.js plugin:
When I change image from image6.jpg to another JPG file in metatag og:image, changed image couldn't be shared.
Please help me to solve this.
Thank you.
I post this answer for the developers touch Linkedin first.
The other social sites have no problem like this.
But facebook and Linkedin have this problem, because these sites have cache and save the first scraping data in cache (especially images).
Facebook cache can be removed by manually, but Linkedin cache can not be.
Linkedin cache restore scraping data for a week, and Linkedin clean cache after a week.
During this period (one week) the page you want to change image wouldn't be shared.
Because as I write, Linkedin show old data in cache , and save it again, so you have to wait for a week.
Only way to change image immediately is to change page url also.
Thank you.
So, let's think about this. Here is your what I think is the kernel of your problem:
...When I change image from image6.jpg to another JPG file in metatag og:image, changed image couldn't be shared....
At first, when you said When I change image, I thought you meant changing it in the HTML, but now I think what you mean is you are changing it through JavaScript: i.e. $(metaelement).content(newimage);.
If this is what you mean, it will not work. LinkedIn is doing a blind, simple, non-JS activated scrape/parse/cURL of your webpage. If you try to change <title> or <meta> tags with JS, the scrape will not see it. This is true with almost every type of scraped URL, in every single search engine, for instance, like google and bing (changing your <title> via JS will not be reflected in the search result). This is just how the Internet currently works!
Source: Microsoft LinkedIn Share URL Documentation.
For example, this works for me:
https://www.linkedin.com/sharing/share-offsite/?url=http://www.wikipedia.org/
See, it works fine:
If you are interested in a regularly maintained GitHub project that keeps track of this so you don't have to, check it out! Social Share URLs
my question is about a weird cache issue with facebook open graph. My server provides an html document with the properly meta tags for facebook share utility.
Provided meta tags are: og:url, og:type, og:title, og:image, og:image, og:description, og:site_name, og:updated_time.
Now the facebook url debugger brings the correct data, all fields have the correct data, but when i lanch the popup, with the url containing the html mentioned above, the image is wrong, it shows me an old image or the site logo... i thinks it is a cache trouble, and i don´t know how to solve.
I have tried some solutions but are bad solutions, like adding a timestamp at the end of querystring. This is bad because it reset the shared count.
Thanks a lot!
I'm using email tracking services of some email sender company. It is achieved through requesting img resource when opening email. Here is the code inserted into HTML message:
<img src="https://ci4.googleusercontent.com/proxy/TObr7aARe70s=s0-d-e1-ft#http://www.mywebsite.com/TrackEmail?j=eyJ1IjoiMQ4In0%3D&r=0.614693022798747.gif" width="2" height="1">
I'm interested in how eventually the request will come to my website and what exactly will be requested from my website - image or simple request? Can anyone please explain me? I think the magic is somewhere in this part ...d-e1-ft#htt....
You can add a tag with an src pointing to a script on your website that handles te request, get the information you wanna track and returns an invisible image (1x1 transparent pixel for example).
Be careful with the googleusercontent cache servers, they can break your tracking, take a look at this:
http://www.emailmarketingtipps.de/2013/12/07/gmails-image-caching-affects-email-marketing-heal-opens-tracking/
This explains how to avoid caching using P3P headers and returning a Content-Type different to image/*
I have an image :
<img id="img1" src="http://igyaan.in/wp-content/uploads/2013/03/Nvidia-580x362.jpg" />
The image from the url is getting cached, but image is not getting displayed.
I analysed it using firebug, where I could see a GET request to the image, and image is returned. And in addition, there is a request to some facebook pic which I never requested (firebug: Bad request):
http://a1.sphotos.ak.fbcdn.net/hphotos-ak-snc7/424831_319096764809781_1948053300_n.jpg
jsFiddle: http://jsfiddle.net/Qb6YX/5/
Any idea why this is happening? And how do i solve this issue?
MoreInfo : iam working on a Rss feed reader , it displays images of posts . I had trouble with this specific website.
It is likely that the image is hotlink-protected. That's why it gets redirected when you try to load it on your page. In this case you should use a server-side proxy to retrieve the image and load it from there.
Using an external service from Images.weserv.nl:
<img src="http://images.weserv.nl/?url=igyaan.in/wp-content/uploads/2013/03/Nvidia-580x362.jpg" />
See jsFiddle
It would be better if you host the proxy script on your server for this purpose so that you have fewer dependencies for your RSS feed reader.
However, there are times when we should respect the site owner's decision of hotlink protection. One way to go about it is to replace an image that cannot be loaded with a default one.
Im editing the html of a myspace page to insert a form. For the 'action' attribute of the form I have a web address (naturally). It works fine on a real website, but what happens with myspace is that any links you enter are routed through the server (I believe) are replaced with an msplinks link instead. This royally effs up my form and I'm not sure how to get around it.
Any ideas?
EDIT: I know this is in flash but here http://www.myspace.com/brokensocialscene if you click on free download you get a box where you can enter your email.
Maybe it's a little late. But here is what I did:
Go to tinyurl.com or another website which shortens urls.
Shorten the url and
use the new short url in stead of the original (long url) for myspace and you'll see, it works!
Well actually it is not a workaround for msplinks, but the result is the same, since you can now direct to any url.
Actually what you're doing is the same thing myspace did. Making the url redirect. You can use this for any kind of url you like. Skype Urls, itunes urls etc..
I used it for the url to launch iTunes and subscribe to my podcast. As you can see in the link below, it even allows url's other then http://
original url: itpc://dl.dropbox.com/u/14194526/itunes_podcast_feed.rng
the short url I used is: http://tinyurl.com/2uh3m23
Hope you can still use it.