Open Graph image issue on linkedin - wordpress

Im having issues with my project right now regarding linkedin share. The image(thumbnail) doesnt showed up.
My question is, does the url change could also affect?
For example i added the og tags like this:
https://domain_name.com/wp-content/uploads/2016/10/2_About-Team-Photo_New-1.jpg
but when i open up the source code the url was change to:
https://d2gkdq5vdbd74s.cloudfront.net/wp-content/uploads/2016/10/2_About-Team-Photo_New-1.jpg
Does this change affect the Linkedin Share?
By the way the facebook share has no issues at all.
Please help me. Thank you.
Reggards,
gbl

My hunch is that your page doesn't have the Open Graph prefix on its or tag.
<html lang="en-US" prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# website: http://ogp.me/ns/website#">
I believe I've come across that as an issue with LinkedIn shares in the past. As for the URL change, that shouldn't impact it. I believe I've used images from different domains successfully in the past for Open Graph. Do you have a plugin enabled that might be syncing your assets to CloudFront or S3? That might be the cause of that.
I wrote a plugin a while back that might save you some hassle with all of this -- it comprehensively and intelligently adds all of OG tags needed, including the prefix, and allows you to customize that data as you need per page or globally (if you're a developer, you can do this all programmatically with some built-in filters. It also lacks the confusing configuration and bloat of other 'do it all' plugins, which is one of the main reasons I built it. You should check out:
https://wordpress.org/plugins/complete-open-graph/

Related

Had all relavant opengraph social meta (created by AIOS) but facebook debug failed to recognize

I know this is an old topic but I've digged dozens of related questions and solutions but neither of them works.
Some of questions I've read:
Can't fix: 'og:image' property should be explicitly provided, even if a value can be inferred from other tags
Wordpress All In One SEO plugin not sharing to Facebook wall
My test url for facebook debug:
https://trangthietbiytehcm.com
Also, I debuged via Facebook sharing debug and Facebook Object debug
Here is Facebook Object debug:
Here is Facebook Sharing debug:
here is the post's head tab:
I also add that sometimes this post could be displayed well (including image thumbnail) on my facebook page but most of time it did not.
I've cleared my wordpress caches.
Absolutely, I can read the social opengraph tab on my post but facebook failed to read them. I do not know the reason behind this problem. Please help me to be clear! thanks
EDIT:
This is a capture of the fact that sometimes Facebook receives my blog post well. And the post link is: https://trangthietbiytehcm.com/uncategorized/san-pham-test-lan-2/
And I wnat to add that the above test link (https://trangthietbiytehcm.com/uncategorized/bai-viet-mau/) also has the same fact as this
EDIT (UPDATE):
After months of be frustrated with this problem, I even tested on another new web on new host server. I've finally found that the reason of this problem is the page cache function of the W3 total cache
We've found this issue to be related to W3 Total Cache, too. Specifically, it's the Wordpress Dashboard > Performance > Minify > Eliminate render-blocking CSS by moving it to HTTP body feature. What this does is shove all the CSS right after the tag, moving all the other header tags down.
And it seems Facebook (and Twitter?) only parse a fixed amount of the page before deciding to try and render... and if your CSS is long, well, it never sees your og:image tag (or any others, like Title, etc).
We have yet to find a good fix which still allows this feature to be used.

Tracking Clicks [Outbound Links] with Autotrack.js

I am trying to find a clear method of tracking clicks to external sites from a site I have built, it appears a lot of information available on this is contradictory or incomplete. I have found autotrack.js on Github which looks like a simpler method, so my question is three-fold, I'll make the question super clear so there is a super clear answer for others in the same conundrum as me.
What snippet/script is added to the HTML and where? I currently have the standard GA snippet for tracking page loads before the </body> tag.
Should I amend / edit the <a> tags to make sense of the who clicked what? I.e. name them, can this be avoided or automated, what I mean is there a script smart enough to name it the same as the destination, like reallygoodlist.com or fb.com/reallygoodlist ?
Is there any GA work required? Set up Goals etc, ideally I would be looking to avoid this - I have a lot of links.
Here is my site (if it helps):
http://www.reallygoodlist.com
1) What snippet/script is added to the HTML and where? I currently have the standard GA snippet for tracking page loads before the tag.
The installation and usage section of the autotrack documentation shows how to install autotrack, so I'll just link to it rather than repeating.
If you're just using the default GA tag, you can probably copy/paste most of the code there, changing the parts relevant to you: e.g. if you only care about outbound link tracking, then only include the outboundLinkTracker plugin.
It also looks like you're installing code via npm, so in this case you can link autotrack's source file in the node_modules directory as you've done with the Babel polyfill.
<script src="node_modules/autotrack/autotrack.js"></script>
2) Should I amend / edit the tags to make sense of the who clicked what ? i.e. name them, can this be avoided or automated, what i mean is ether a script smart enough to name it the same as the destination, like reallygoodlist.com or fb.com/reallygoodlist ?
Autotrack's outboundLinkTracker plugin automatically sets the link's URL as the event label, so you probably don't need to do anything unless that's not enough.
If you want more control than that, setting one of the common options will allow you to custom any data that is sent to GA.
3) Is there any GA work required? Set up Goals etc, ideally I would be looking to avoid this - I have a lot of links.
Not for outbound link tracking. It's just tracking the data as events, so you'll be able to find them in your event reports in GA.

Cross Domain iFrame auto height resizing

I've been googling and looking at various options but could not seem to be able to find a perfect solution that works in what I'm attempting...so needing some help here.
The situation/environment that I have is the following:
Parent page (which has the iframe) - is on a different domain, and the only control I have is a portion of the body tag, where it is updated via an admin console using html/WYSIWG editor. No access to head tag or even hosting jscript in their domain.
Child page (iframe) - is hosted in our domain, and we have full control.
The parent site is actually 3rd party online stores where we have products there, and we want to put in common information that we can control on our end without having to edit each individual product listing one by one.
I've tried alot of options found but it does not seem to work as either they need to include in js file or access to the head tag in the parent page.
So wondering if there are any other options that can help us on this?
I'm afraid you need access to JavaScript on both domains to do this.
Could you get the 3rd online store to host a small JS library that all their clients could then use to solve this problem? I work on a project that allows third parties to add in iFrames and produced this little project for just this reason. When any one say they want to be able have their iFrame resize to content, we point to the iFrame js file and say include this on your page.
https://github.com/davidjbradshaw/iframe-resizer
Sorry, that's not quite the answer your after, but trying asking the store to support this and they might be open to the idea, as I expect others have the same issue with their site.

Can I track who is linking or manipulating my site's data?

Is it possible to track if someone links to data on my site? Specifically if my data is used in a site dynamically generated by a developer program? I would like to know if someone is blatantly passing off my site's data as their own. There are obviously ways around directly linking to content, such as content manipulation or even manual manipulation. But if someone where to link(or directly add word for word or manipulate) my content into their website, is there a way to track it?
Can I avoid someone being able to scrape my website at all, or is everything just up for grabs?
the best answer and the easy one is called GOOGLE - WEBMASTER TOOLS!
HERE
actually doing that is very hard and you would need to crawl the web to discover those links that address to your pages... dynamic content as well is linked so it would be find by google as well.
this tool will allow you to see outer links that address to your site.. and you can check them.
for extra - you can monitor requests and traffic to your site and find ip's that are using the same page over and over again. that can tell u that an outer page is dynamically loading content from your web page.
EDIT:
here is a good article in this subject: link - scroll down and you can see the use of google
webmaster tool with some other progrmas and method.
here is a good start guide to the google webmaster: link
ENJOY!

Which image shows up when a link is "attached" on Linkedin?

When I try to share a "discussion" (which is merely a link from our website) at linkedin through the "Attach a link", it used to pull a nice image earlier, but it ceased to do so now.
Is there a meta property="og: we should specifically use for linkedin shares to have an image shown?
The LinkedIn share functionality supports a small subset of open graph tags as documented here:
https://developer.linkedin.com/documents/setting-display-tags-shares
Note that at least until recently (and possibly still) re-scraping of existing shared pages is broken, so if you've already shared a page and it got the wrong image you're stuck unless you share it with a different URL.
Add these meta to your webpage head tag.
<meta property='og:title' content='title'/>
<meta property='og:image' content='image/path'/>
<meta property='og:description' content='description'/>
<meta property='og:url' content='your url'/>
While posting on the Linkedin, there is a linkedin cache so if you are going to re-post the same url again, probably the meta will not be picked up. To fix that you can add a parameter at the end of the url while posting on linkedin
e.g original url www.example.com then you can repost this with www.example.com?1
LinkedIn posts can also be designed from scratch using the jssdk. I created a tool that allows me to select what image is displayed, and what caption gets set, when I share a link.
If you want to develop your own, fork my repo:
https://github.com/kaburkett/LinkedIn-Advanced-Share

Resources