Skip to main content
All CollectionsCustomizing Your Website with the Novi CMSWebsite Content Ideas
How To Embed a Facebook Photo Album in a Novi Website
How To Embed a Facebook Photo Album in a Novi Website

Best practice and how-to's for embedding an album (or post) from Facebook into your Novi website.

Melisa Smith avatar
Written by Melisa Smith
Updated over 6 months ago

Novi AMS gives you the opportunity to embed iframes into your content. One of the most popular embeds we see clients use is a Facebook photo album. You can do this one of two ways, depending on if Facebook gives you the option to embed or not. 

If Facebook gives you the option to embed your photo album:

Occasionally, Facebook will give you the option to embed your photo album or post. If so, follow these steps:

  1. Click on the arrow in the top-right corner of your post and in the drop-down, you will see an Embed option (see below).

  2. Click Embed. You will now see a code.

  3. Copy this code and paste it into your Source Code in Novi. (Tools > Source Code)

  4. Click OK.

  5. Save the page and you're done!

If Facebook does not give you the option to embed your photo album:

On certain posts, Facebook will not give you this embed option. This most likely has to do with if people are tagged in the photos. Even if the album is public, if there are people tagged in pictures with certain privacy settings, then Facebook may not offer you the embed link. If this happens, take this approach:

  1. Go to your photo album on Facebook. (Go to your page > click photos on the side menu > click on your album) 

  2. In the address bar, copy the numbers at the end of your URL.

  3. Paste those numbers into the marked section of the code below.

  4. Copy this code and paste it into your Source Code in Novi. (Tools > Source Code)

  5. Click OK.

  6. Save the page and you're done!

Code:

<iframe width="540" height="700" style="border: none; overflow: hidden;" src="https://www.facebook.com/plugins/post.php?href=https://www.facebook.com/media/set/?set=a.PASTEYOURURLNUMBERSHERE&amp;type=1&amp;width=540" frameborder="0" scrolling="no"></iframe>

Frequently Asked Questions:

Why is my embed "falling out" of my static page content area?

Sometimes your Facebook embed will appear larger than the content area because the iframe is "taller" than the div where you enter your content. Since the iframe isn't traditional "content" like text and photos, the div does not automatically expand to fit. To correct this, you'll need to increase the length of your div with the code below.

Enter this code in your Source Code before everything else:
​<div style="min-height: 1000px;"> (you can adjust the px to what you need it to be)

After everything else, enter:
​</div>

Where can I put my Facebook iframe?

A good rule of thumb is that the Facebook photo album embed will always look best on a regular static page or event page because there is enough space for the entire album. As of right now, these iframes are not responsive, meaning they do not shrink down with screen size or to the size of the container it is in.

That being said, we do not recommend attempting to add an iframe to one of the editable content regions on your homepage or anywhere else on the site with a fixed size. The album may be partially cut off or disappear on mobile, due to the non-responsiveness.
​

Did this answer your question?