Embedding a Spark Page in another web site

There has been some confusion on what exactly the “new embed” feature is in Spark Page and where it is capable of running. This page serves to demonstrate how the new embed works and how it compares to the old embed code.

The New Embed Code

Only Spark Pages published with 1.6 will have the ability to use the new embed code. If people want to use the new embed code with an older publication it will need to be re-published with a 1.6 build.

This is what the new embed code looks like:

<script id="asp-embed-script" data-zindex="1000000" type="text/javascript" charset="utf-8" src="https://spark.adobe.com/page-embed.js"></script>
<a class="asp-embed-link" target="_blank" href="https://spark.adobe.com/page/XXX/">
<img src="https://qa.adobeprojectm.com/page/XXX/embed.jpg?buster=YYY" alt="Adobe Spark Page" style="width:100%" border="0" />

Where XXX is the id of the Page and YYY is some random number.

In a perfect world that code will result in something like this:

Adobe Spark Page

Notice the new features of this “new embed” style:

  • Hovering over the embed has a slick animation
  • Clicking on the embed opens the Spark Page in a viewer embedded into the host page
  • The likes and views are shown

Customers were asking for an embed system like this so that they could keep visitors on their host page without just opening a new tab whenever someone clicked on a Spark Page.

Huge Caveat #1

However, many blog systems do not support this style of embed. Anything hosted on WordPress.com will not support that format. Even some WordPress.org installations that are self-hosted/self-managed also won’t support it depending on their settings. Adobe’s Blog system (what Spark Blog is based on) is an example of this WordPress.org installation that doesn’t support this by default.

When that happens the script tag gets stripped out and all of our cool effects will be lost. In that case it will look like the old embed code we used to have which acts like this:

Adobe Spark Page

Huge Caveat #2

The new embed code will only work with Pages published with 1.6 or later. If you want that new embed style to work with older publications then those users will need to re-publish their Pages.

This is what happens when you try to use the new embed code with an old publication:

Adobe Spark Page

Notice that it will show an error. This is because it is trying to load an <iframe> pointing to a embed.html file, but older builds of Spark Page don’t create an embed.html file so the iframe just points to a 404 page.