Tell your story with Spark Page and Video Embeds on Portfolio
Looking for more posts on creativity by Behance? We’ve moved our blog over to behance.net/blog.
A couple of embeds that we’ve recently added to our lineup are Adobe Spark Video and Adobe Spark Pages. Spark Videos allow you to quickly and easily create animated videos and Spark Pages let you create a beautiful “story” in the form of a simple, but dynamic, webpage. They’re both incredibly easy to use, but also amazingly effective creative tools. On top of that, they’re both completely free!
Sharing Adobe Spark Videos on Portfolio
We’ll start with Videos since it’s actually very, very simple. When you’re done creating a Spark Video log into Spark on a desktop computer. From the video’s share menu, there’s an option to copy an embed code.
When you’ve selected the dimensions you’d like, copy the embed code. Whether you’re creating or editing a new Page or Project in Adobe Portfolio, you should see in the Edit Remote an option to create an Embed Module. Once you see the embed module, paste the code you’ve copied. Save your project and you’re done!
Embedding Adobe Spark Pages
There are two options for Adobe Spark Pages depending on what version of the app you’re currently using:
- Embed the embed.html via an <iframe>
You can use the code snippet below as a guidline — just be sure to replace the ‘XXX’ with the the ID of your spark page. You can also adjust the width and height to fit your Behance/Portfolio page.
<iframe src="https://spark.adobe.com/page/XXX/embed.html" width="512" height="256" border="0" style="border:0;"></iframe>Benefits:
- Author, view, like information shown
- Clear call to action button to “Read More”
- Subtle hover effects when you mouse over the embed
Drawbacks:
- Only available in projects published (or re-published) with the latest version of Spark Page
- Doesn’t show the full title section (only the title text)
- Theme font is used, but other theme elements are not
2. Embed the embed.jpg as an image with a link
This approach is available to any published Spark Page, even the older ones. Here you download the embed.jpg image which represents the title section and insert that as a normal image which you then link.
To embed in this manner follow these directions:
1. Go to https://spark.adobe.com/page/XXX/embed.jpg
2. Download that image to your desktop
3. Click “Upload Files” in Adobe Portfolio and select that image
4. Click the Pencil icon on that image, then click Edit Link
5. Enter the URL to your Spark Page then check Open in New Window
(Be sure to replace the XXX with the id of your Spark Page)
Benefits:
- Works on all published Spark Pages (even old ones)
- Shows an exact screenshot of the full title section (including subtitle and theme)
- Improves the search engine visibility of the Spark Page
Drawbacks:
- Less immersive experience
- No author information shown
Adobe Portfolio is a great platform to bring together all of your creative work from around the web, wherever it is. If you’ve got embeddable content we don’t support yet, let us know at help.myportfolio.com.
See our latest updates and features on the new Behance blog.
