We Keep Coding

Facebook Feed Dialog URL Picture Param is not overwriting og:image

I want to share an infographic featured in an article, but the &picture= param in a facebook share url is being ignored and instead the image in the og:image meta tag is being shown. Need help ensuring that the facebook dialog box honors the picture parameter in the url.
I've tried using the Facebook Sharing Debugger, or a random image from another source but no difference.
My url structure is like the following:
In code:
const example = `https://www.facebook.com/dialog/feed?app_id=1234567890&display=popup&link=${encodeURIComponent(url)}&description=${encodeURIComponent(text)}&picture=https:${encodeURIComponent(img)}`
So I get something like this:
https://www.facebook.com/dialog/feed?app_id=1234567890&display=popup&link=https%3A%2F%2Fwww.example.com%2Farticle%2Fslug&description=Test%20Infographic%20Text%20Click%20the%20link%20to%20read%20more%20info!&picture=https%3A%2F%2Fimages.example.net%2FexampleImage.jpg
I expect that when a user clicks on the Article share button that the image used in the dialog box is the same as in og:image but when I click on the share button on the infographic the image used in the dialog box is the same as in &picture= url param.

Custom pictures are not possible anymore, you can only share with the og:image specified in the source.

Preview image from URL - like Facebook

When you post a link on Facebook, it grabs an image from that page as a preview.
I'd like to be able to do the same! We're creating a link sharing website with Meteor, and want the user to be able to paste a link, and the image be rendered in the list.
Any ideas? Doesn't need to be Meteor specific at this stage!

To add an image when someone clicks on share/like etc, you can set the image for that page with
<meta property="og:image" content="http://yourdomain.com/link/to/image" />
When somebody shares it, it will use that image. You can also set titles and more:
https://developers.facebook.com/docs/opengraph/using-objects#selfhosted-creating

As indicated by Sarath in his comment you have to scrape the webpage and look for the information you need (title, META desc, an image) by using a regex for example.
I would suggest to look for META OG tags already used by many websites or, if not available, Schema.org micro data.
I think that some tools like PhantomJS could be helpful as it allows you to get the content of a webpage and even generate screen capture of this page.

Can I load an iframe when user clicks on the facebook share thumbnail?

I am trying to do something like this:
A user share the url to my page which has a small javascript based lets-say-a-game.
The shared content will display a static image and a play button inside the widget/thumbnail.
When the user clicks on the play button, I want to load the page within the shared widget inside an iframe
For example: When a souncloud page is shared, it shows the music thumbnail and a play button. When I click on the play button it displays a javascript based music player inside the share widget loaded inside an iframe. To my understanding, the trick is to use a video content as a wrapper of some sort i.e swf but couldnt figure it out exactly how to do it.
Any help towards the right direction is appreciated.
Thanks in advance!

I think Facebook will not allow you to post any script. Rather you can post links and if the user clicks on that link they will be redirected and there you can implement your code..

How to change src in iFrame on user clicks ??

I am a newbie with coding php or js.
So please advise me if I am asking the question the wrong way.
I would like to be able to pass and embed URL address from a link into the src="URL embedded here" of an iFrame. The page with the link has links with a company name displayed, the user will click the link and a new .php page will be displayed with an iFrame that displays the actual website of that company within our site. So... for example... on the index page, the user clicks "Goodyear" and it launches a .php page containing the Goodyear website displayed within the iFrame. Now... I have about 20+ vendor links and am trying to avoid 20+ individual html or php pages to display that data. Especially since the vendor list will change often. Any assistance would be greatly appreciated. The pages that I am referring to are http://seindl.com/index.php where you can see the appropriate URL's in the href elements; and the resulting linked to page http://seindl.com/vendor.php that currently displays a static Kuriyama.com website.

Well if you have list of links, you do not need jquery or javascript to change the iFrame src. For example, if you have iframe like this:
<iframe name="frame1" id="frame1" src="about:blank"></iframe>
Simply creating links like this:
LINK
will open the page in iFrame (based on target attribute of the link, which must match the iframe name).
If you really need to do it with jQuery, you can try something like:
$('#frame1').attr('src','http://something.com');
Or with javascript without libraries:
document.getElementById('frame1').src = 'http://something.com';
Which will also change the page open in the frame.

Appned id of vendor to the url like below on index.php page:
vendor.php?id=10
And then on vendor.php file, base on the id (use $_REQUEST['id'] to get id) you can put the url of the vendor.
$id = $_REQUEST['id'];
if($id == 10){
$vendorSiteUrl = "http://vendorsiteurl.com";
}
....
<iframe src="<?php echo $vendorSiteUrl;?>"/>
Hope this helps.

Photo gallery like picasa or facebook

I create a photo gallery like picasa or facebook have and already have done a server part. Now faced with an issue about displaying it. In other words, there's a page contains some small pictures (in fact, thumbnails). I'd like a "windows" contains a big picture to appear by clicking a picture instead of redirecting to other page.
For example. like here
So please recommend me something or give me an example of how to make it.

There are a lot of image galleries online. Here is example of one. Click on each of the rounded buttons (1-5) to see demos.