Rise iFrame: removing grey border; reducing interior padding of frame

Jun 19, 2017

I am working on embedding some storyline2 content into a Rise course using an iframe withing the embed option. I'm able to do so and have gotten my course content to load fine. 

Within the attached image, you'll see two areas called out i'm looking for possible solutions on. 

1) Is there a way to remove the border around the embedded iframe? This grey bar is within the attached image using a red box. I've tried adding the following options minus the parentheses with no luck.(frameborder="0")

(frameBorder="0")

(seamless="seamless").

2) I can't seem to figure out how to remove the white spacing around the embedded .story file. This space is identified within the attached image using s long squiggly line. Is that are able to be removed?

Background info: I want to use very narrow storyline files, maybe 100 pixels tall, but Rise seems to be adding several inches of space to the top and bottom when I do. So what might act as a custom graphical divider or other custom interactive element, will now "float" in the course between those spaces.

Here is the embed iframe code I am using if you want to play with it. 

<iframe src="https://s3-us-west-2.amazonaws.com/mfrm-learning-development/Course+Files/CoryTest/story.html"></iframe>

33 Replies
Alyssa Gomez

Hi there Cory,

The thin gray border and interior padding you see in the Embed block is there by design, but a feature that would allow you to toggle it on and off isn't a bad idea! I'll definitely pass that on to the product team for you. 

We always appreciate hearing what folks want to see in future Rise releases, so thanks for the feedback!

Cory Warshawsky

Thanks Alyssa!

As we begin to embed Storyline (or other) content into our Rise courses, there will be times when I don't want that content to appear to be in its own section. Also, when I create something with a small height, Rise leave BIG gaps between content due to the iframe spacing.

 

Thank you for passing it along to the team!

Ashley Terwilliger-Pollard

Hi Erica, 

No update on this yet, but I'd love if you could share another example so that I could pass that along to my team? Seeing real world examples and how this impacts your design will really help us understand the need and importance of this change. 

If you wanted to drop the Share link in here, that would be enough for us to look at! 

Ashley Terwilliger-Pollard

Hi Joe and Craig,

The modern player for Storyline 360 is now available (read more about it here).  If you use the Modern player, look to set Menus & Controls to Off and choose the Light player theme, then you shouldn't see a border in Rise. 

Here's a quick, one slide example I did in Storyline with those settings. The image below the puppy is just a regular Rise image block. 

Cory Warshawsky

Ashely, I love the new modern player. I attempted to use your directions above to remove the iframe border - and it kind of worked. : )

I still see a light colored line above and below my recreated flash card element that I recreated in storyline. Any thoughts on why this is showing?

Alyssa Gomez

Hey Cory,

Thanks for including that example. We're seeing the same thing you're seeing--so sorry for the trouble! Our team is working through this issue, and we'll keep you posted as we know more.

In the meantime, do you see an improvement if you change the width to Medium or Full Width? You can make that change by clicking Edit >> Settings in the Storyline block.

Rachel Clark

Hi Alyssa,

Chiming in to say I'm experiencing similar issues to the ones Cory Craig and Jen describe upthread.  Any word on progress and updates?  It's particularly noticeable when the storyline block is full color and I use a HEX color for the block background, but honestly, it's equally obnoxious to have such a large amount of white space between the text block and the storyline block. 

I'm using Storyline 360 and Rise. 

  • The Storyline project size is 16:9 (720x405), Player Menus & Controls are set to Off and using the Light player. Like others have tried, I've extended objects offslide in hopes of removing the white line, with no change.
  • In Rise, the block is set to 0 padding before and after. I've tried both small and medium sizes with the same display results.

Help? :)

Crystal Horn

Hey everybody. I'm excited to let you know that we just released update 29 for Storyline 360! Here are all the details.

One of the fixes addresses an issue where a white border was showing around Storyline blocks that had a custom background color in Rise 360.

Here’s how you can update Storyline 360. After updating Storyline, please republish your Storyline interaction for Review 360 and insert the new version into Rise 360. Let me know how you make out!