tl;dr I'm wanting to specify NO image by default in my og:image tag.
I've been googling like a madman to figure this one out, but everything I find are questions from people who can't get their images to show up instead of preventing their images from showing up.
So, here's the deal. On my personal website in my master page is a picture of my face. Now, it's a nice picture (because, hey, it's a nice face) and I'd like to keep it, but I don't like that it's picked up by social media scrapers whenever my links are shared - that just seems a little too egotistical.
I DO like that it picks up other images, like the ones I occasionally include in my blog posts, but if there aren't any other images on a page then I want the scrapers to ignore my face.
I've experimented with commenting out the code that generates the og:image tag in my Yoast plugin, then hard coding the tag with an empty content attribute into my header.php:
<meta property="og:image" content="" />
This partially achieved the desired effect - Facebook's scraper detects that no image url is specified, but is still seems to be defaulting to whatever other image it can find.
The Open Graph protocol doesn't appear to include behavior for specifying no images, either.
Any thoughts on how I could do this?
EDIT: I just found some workarounds in this question that will probably do the trick, but if anyone has any other ideas, I would appreciate hearing them as well.
Upload a blank or 100% transparent image with at least 200x200px and use it in the og:image tag.
Related
My WordPress website takes a lot of time to load pages, a problem that many of us face. I used GT metrix to check my WordPress page and then checked my website waterfall.
One thing I saw taking more than half time of my page is an image which is not uploaded in my website.
check this image of gt metrix waterfall:
I checked it, and I found this is an image which I have not used in my entire webpage. Also I could not find where is this image used.
Same thing happens in different pages that has different images to it.
I deleted one image from my media but now when I check the GT metrix waterfall I get a 404 error code which means its still trying to load that image and I cannot find it.
This is a theme which I had purchased and its not a popular theme like divi or ocean and hence could not contact the support.
How to check where a particular image is used in my webpage using
the media library (can I do that?)
How to find out and remove this image? Or at least is there a way where I can delete the image from the library and hence my webpage should not look for this image wasting its time instead of getting a 404 code
Your problem is quite common indeed, for your specific case i can suggest by starting to search the image name in both code + DB, it MUST be somewhere.
If you cannot find it inside your stuff there's only one answer left: there's some JS third party script that is loading that for you, but in this case i seriously dubt it would be in the same domain as your site.
Using the media library there's not much you can understand, if you are VERY lucky it will have a message like "attached to" but that thing cover like 10% of the cases, most of the time the image ARE used but are not attached to anything like a post, so the media library won't tell you anything
I've had this happen before a few times, too. Isn't it frustrating!? If you could provide a URL, I (and others, I'm sure) would be happy to take a look and try to figure out what's going on. :)
We have the ability current to share current articles on our site by clicking on the sharing icon. This loads up a URL like:
https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fwww.mydomain.com%2Fbuild-to-suit-leases-0419%2F
What's odd, is that the image that is loaded up from the OG:Image sometimes is very large while other times it's displayed as a small icon/banner layout. But in either case, the image is the exact same size and format which is used. The browser we use doesn't make a difference. I've also found that if I wait for the linked cache to clear and try to share the link again, it can give me a different layout.
Is there something else I can provide in that URL to specify the desired layout?
I think this was already answered here:
LinkedIn share requirements (BIG image)
But
Take a look at this link
https://www.linkedin.com/help/linkedin/answer/46687/making-your-website-shareable-on-linkedin?lang=en
So the recommended ratio of your image should be 1.91:1.
Do you have a working link for the URL you want to share?
I had problems before with it because we had something generating dynamic images and that was causing linkedin to display them little.
You can also add more meta tags to it like:
og:image:width - The number of pixels wide.
og:image:height - The number of pixels high.
More info about extra meta tags can be found here
http://ogp.me/
I made a post on WordPress, then shared it on a Facebook page. In the past, the shared image would be the large "post" image. But now, for some reason, it's using the thumbnail. Running the url through fb's debugger shows that Open Graph recognizes both og:images, but that neither of them are being used in the share preview. Once posted, it uses the thumbnail.
I checked the meta content in the page head just to double check and sure enough, it looks fine:
<meta property="og:image" content="##">
What's causing this? It's recognized, but not used. What?
I currently facing the same issue, after contacting facebook, it turns out there is an issue in Open Graph in facebook that affects some users.
The Bug has been reported and assigned as "high priority" in Facebook support center - https://developers.facebook.com/bugs/978421888869140/
Be sure to have a look at
https://developers.facebook.com/docs/sharing/best-practices#images
You need at least images of 1200x630 pixels size to be able to get a large preview image.
Furthermore, you should put the larger image first IMHO.
See
https://developers.facebook.com/docs/sharing/webmasters/optimizing#cachingimages
https://developers.facebook.com/docs/sharing/webmasters#images
Here is the site that I am working on.
http://afinderskeeper.com/
Here is an example of the logo image that I want at the top
http://afinderskeeper.com/?attachment_id=64
The theme is mayashop, and I am having issues with the images loading. In the media library I am able to see all the images. In the theme options menu in the backend, it asks me to enter the url of the logo image/ favicon/ etc. into the text field. So for the logo, I am simply pasting that second url from above, save, but I still get the placeholder box, not even the correct size.
I was having a redirect issue earlier and couldn't even view any of the images.
It just kept taking a while to load and coming up with a redirect loop. I found online someone had switched the permalink, so I switched mine from "month and name" to "default" and now I can at least see the images on the second link, but I still cannot figure out why they don't show up in the proper places. I hope this makes sense.
I will also mention that I don't really know any php so if this is what it takes, please be very specific for me, thanks!
You're using the wrong urls for the header image and, possibly, the other images that are giving you trouble as well. Instead of referencing http://afinderskeeper.com/?attachment_id=64, you want to edit that image from the media library and get the file url. It will be something like http://afinderskeeper.com/wp-content/uploads/2014/02/afk_header_logo.jpg
I am just a random stranger on the internet, but I have to thank you guys! Your solution fixed a problem on my site that has bugged me for ages!
All:
I'm trying to configure a website I administer to be pinnable in Windows 8.1/IE11 with a live tile. The first time I went through http://www.buildmypinnedsite.com and it's documentation and provided the RSS feed, I noticed with some surprise that one of the articles in the RSS feed (the only one which had images in the content) actually used one of the images as a background for the live tile (when that article was displayed), with smaller text at the bottom of the tile, over a translucent dark background.
Check the last image at http://blog.laptopmag.com/how-to-create-a-windows-8-1-live-tile-for-your-website for an example. That article mentions, "as long as your RSS feed has images in it, the tile will rotate through your most recent five articles with images".
I really liked the look of using images instead of a solid color and plain text, so since all my articles have a banner image associated with them in our CMS (though not necessarily actually in the content), I updated the RSS feed to include an <img> tag at the top of the content (<description>) embedding the banner right at the top of the content. I also added the banner as an <enclosure> on each <item>. I added some padding characters to the GUIDs so that it would see the content as "new", but the live tile continued showing four articles with just text and a colored background, and the single article with the same background image.
Several weeks have now passed, lots of new articles posted, and yet still the live tile continues to cycle through the articles just showing text.
Windows 8 prepare site for pinning has lots of good information and links to documentation, which I've gone through, but I can't find any more information about how the images should be "included" in the feed in order for them to be pulled in as backgrounds. Am I missing it somewhere?
Thanks for your time and help!
P.S. The <description> field in my XML contains the full article HTML (just the article, no sidebars, headers, etc of course), wrapped in a <![CDATA[]]> tag, in case you're wondering.
I'm looking into this exact problem too (the main difference: I've a partial feed, not a full-content one).
The only reference I could find is msapplication-TileImage http://msdn.microsoft.com/en-us/library/ie/dn255024%28v=vs.85%29.aspx#msapplication-TileImage :
<meta name="msapplication-TileImage" content="images\tileimage.jpg">
This, of course, is just a suboptimal "one image for all" solution.
Ok, I finally got it right.
The key (thanks #james3mg ) was to drop the RSS-based approach completely and go for IE11 specific XML of the tiles feature.
So I used this:
<meta name="msapplication-notification"
content="frequency=60;
polling-uri={$SiteURL}tiles/1;id=1;
polling-uri2={$SiteURL}tiles/2;id=2;
polling-uri3={$SiteURL}tiles/3;id=3;
polling-uri4={$SiteURL}tiles/4;id=4;
polling-uri5={$SiteURL}tiles/5;id=5;
cycle=1"/>
You can see those XML here :
turbolab.it/tiles/1
turbolab.it/tiles/2
turbolab.it/tiles/3
turbolab.it/tiles/4
turbolab.it/tiles/5
The complete list of the available template is here: The tile template catalog (Windows Store apps)