In order to publish an image in a secure SmartFrame format on your website, you need to paste the embed code into the HTML code.

To find out whether your website is compatible with SmartFrame please visit the compatibility chart.

Copying embed code from the Control Panel:

You can find the unique embed code of an image directly from the Image Manager in your online Admin Panel.

  • Select Copy embed code to directly copy the embed code to the clipboard. You can then paste this embed code on the website where you want to publish the SmartFrame. The SmartFrame will use the default theme and will take 100% width of the container.
  • Select View embed code to open the Embed page where you can select a preferred size of the SmartFrame (in px or %) as well as customize which Theme should it use. Once you’re happy with your settings, copy the embed code and paste it on the website.

Copying embed code from the SmartFrame:

You can also find it in the SmartFrame itself, by clicking on the Share icon and selecting the Embed button </>. Please note, the Share icon is not always there, because the owner can disable it to prevent embedding.

How to place the embed code on your website:

First of all, make sure you are editing the HTML source code of your web page, not the preview. It’s very common for any web editing programs to offer a “source code view” which is often indicated by an icon which looks like this “<>” or “Source“. In WordPress it’s called “Text” view as opposed to “Visual” view.

Once you are sure that you are editing the source code, navigate to the position on the page where you would like SmartFrame to appear and paste your code. When you preview the page in your browser, you should see the SmartFrame image. If it doesn’t work, please check the support articles or contact us.

Embedding larger number of images

This embedding method is simple and suitable for smaller amount of images. If you have a large collection, you either should use our WordPress plugin or consider a SF Web Component integration.