Blog Post
KarlisSprogis-d
6 years agoCommunity Member
We created a web based object similar to one of our previous challenges with interactive tabs in a FAQ page. Allowing user to use web objects in Storyline makes this process so much easier!
Take a look at the demo here - http://demo.fastercourse.com/storyline/FasterCourse_Pick_Your_Movie/story_html5.html
And here you can download the source file and see how to edit the web object - https://fastercourse.com/download/free-storyline-360-template-pick-your-movie/
In this example we used Rubik font that you can get for free here - https://fonts.google.com/specimen/Rubik
Hope you will enjoy it!
Take a look at the demo here - http://demo.fastercourse.com/storyline/FasterCourse_Pick_Your_Movie/story_html5.html
And here you can download the source file and see how to edit the web object - https://fastercourse.com/download/free-storyline-360-template-pick-your-movie/
In this example we used Rubik font that you can get for free here - https://fonts.google.com/specimen/Rubik
Hope you will enjoy it!
- JodiSansone6 years agoCommunity MemberLovely and seamless as usual. The transitions and scrolling panels just float. Thanks for sharing the source file!
- GavinHenry6 years agoCommunity MemberThis looks very nice @Karlis, love the design.
- JoannaKurpiewsk6 years agoCommunity MemberI like how this panels fold and unfold. Cool example, Karlis. Thanks for sharing source file - I'm just having a look at it.
- PrzemysławHubis6 years agoCommunity MemberWonderful. I am a huge fan of your design.
- KarlisSprogis-d6 years agoCommunity MemberThank you, so nice to hear. We try our best, this was a fun challenge, as I am sure you will agree!
- HeatherDykes4 years agoCommunity MemberHi Karlis - hoping you can assist on this. I tried editing the index file, but my computer would only let me do it with Libre Office Writer. Then it wouldn't save properly.
Here is what I ended up with:
file:///C:/Users/User/Documents/My%20Articulate%20Projects/Guide%20to%20Sci-Fi%20and%20Fantasy%20Movies%20-%20Storyline%20output/story.html
Do I need an html editor to make this work properly?- KarlisSprogis-d4 years agoCommunity MemberHi Heather! You can use Notepad to edit HTML files, it's enough to edit the texts for this example. Unfortunately, I can't see your example, because it's located on your computer, not on a server. You can try to publish it in Storyline and share the Review link with me, so I can see how does it look like on your end.
Here is the description of how to edit the example -
Inside the downloaded files you will find a folder called 'Web Object'. Inside this folder you will find an index.html file where you can see all the information that is shown on the right panel in the demo. Edit this information and you will see how easily the tabs adapt to it and make space for a larger amount of text or additional images.
Once you put the file on your computer you will have to change the location for the 'Web Object' folder. To do so - click with the right mouse click on the Web object and select Web Object/Edit. There you can select the small folder icon and locate the folder on your computer. Now everything should work perfectly!