Change your password from time to time to keep your account secure
This takes longer than usual...
FineFriends for Developers
By using FineFriends, you agree to our cookie policy.

Embed posts

Show FineFriends posts on your own website

You can place posts from FineFriends on your own website. Embedding FineFriends posts is easy and a nice way to add content to the stories you want to tell on your articles or websites.

With Embed, you can only put the entire post on your website. For full control of embedding, we recommend the oEmbed method.

It is only possible to embed content from public profiles. If people change their privacy settings ar remove the post, an error will be shown instead of the actual post. If the user changes the post, the embedded post will also change.

1. Get the post ID

To embed the post, you will need the post ID. To get that, go to the post and click the date. This brings you to the post page. In the URL, you will see the FineFriends address, followed by /p/# or /post/#. The number on the place of the hash, is the ID of the post.

Enter an ID or URL in the textboz below to show the ID, show an example and generate the embedding code.


2. Create the embed code

To embed the post, you will need to place some code on your website. The basic code for this is simple.

HTML:
<iframe frameborder="0" type="text/html" src="https://finefriends.nl/api/embed?id=#" width=100%></iframe>

The problem with this method is that it does not adjust the height according to the embedded post, it has a fixed height. To fix this, you can use a simple Javascript.

<iframe id="FiFrEmbed#" frameborder="0" type="text/html" src="https://finefriends.nl/api/embed?id=#" onload="iframeLoaded()" width=100%></iframe>
<script type="text/javascript">
function iframeLoaded() {
var iFrameID = document.getElementById('FiFrEmbed#');
if(iFrameID) {
iFrameID.height = "";
iFrameID.height = iFrameID.contentWindow.document.body.scrollHeight + "px";
}
}
</script>

3. Copy and paste to your website

This is the code to embed the post with the ID you specified at step one.

<iframe id="FiFrEmbed73" frameborder="0" type="text/html" src="https://finefriends.nl/api/embed?id=73" onload="iframeLoaded()" width=100%></iframe><script type="text/javascript"> function iframeLoaded() { var iFrameID = document.getElementById('FiFrEmbed73'); if(iFrameID) { iFrameID.height = ""; iFrameID.height = iFrameID.contentWindow.document.body.scrollHeight + "px"; } } </script>