Embedded Power Point?

Is there a way to put a power point presentation on my Sparkle site so that it works?

Hi, You can export the PPT file as a .gif and than you can put it in an image box on the Sparkle canvas.

Thanks, but won’t that just be a picture? I would like for a teacher to be able to show the whole presentation, with the animations and clicking to advance the slides. Would your idea allow that?

Yes, it can be put into a picture box like jpg or png. But than it runs like a video. Sorry, do not know how to control it like a PPT Präsentation.

I’m not familiar with powerpoint. Keynote can export as html, and it produces a standalone micro-site. You can conceivably place that on your web host, and then enter its address in a Sparkle embed box.

3 Likes

@duncan Never thought about exporting a keynote file as a html and putting it in a box. Does it work with its animations and fonts too?

That’s up to keynote. I have never used the feature beyond the basics.

1 Like

I exported ppt’s to html5 with the iSpring Powerpoint plugin. Worked fine.
https://www.ispringsolutions.com/

As stated before the output can be placed as iframe content.

Yes, it works fine. Like a normal presentation.

Yep, I use keynote and it works just fine embedded in a web page - also responsive. You can see an example HERE - about half way down the page - online presentations section. If you already have the presentation in powerpoint, just import it into keynote and then export as HTML from there.

1 Like

@francbrowne
Works great. :+1:
But one question: Which font did you use for the presentation?
The display of the font does not seem to be correct on my Mac … some letters are a bit cut off?
Tested with:
Safari 13.1.1
Firefox 77.0.1

Screenshot 3

When used in its native format, the HTML file generated from keynote does have font dependency. If the viewer isn’t likely to have the font installed, you will see the problem you are encountering. The way to eliminate the problem is to use only common system fonts that most users have. An alternative (assuming you can live without animated text) is to create your text in the slide and then use the Mac screenshot facility to grab an image of the text (Command-shift-F4). You can then drag that into the slide and delete the original text. The font I used was Gill Sans.

A little tip: when you create your slideshow, make a note of the aspect ratio. You can then use a handy online aspect ratio calculator to determine the exact size of your iframe for different breakpoints. The one I use can be found HERE.

The embed code will be something like this:

<iframe src="demo_iframe.htm" height="200" width="300"></iframe>

Just change the source to the URL of your online presentation (usually in a separate folder) and change the height and width accordingly. Upload the presentation first so you can see the result in Sparkle while you are developing the site.

@francbrowne

Thank you for your detailed answer. :+1:
That’s odd, the font Gill Sans is installed on my Mac and it is activated. I wonder why it doesn’t display correctly though. A mystery …

I did some tests today and exported Keynote presentations as HTML. It worked well, but I realised it creates rather big JavaScript files for the “player”. So for me that seems to be a bit of a drawback.

But it’s an interesting possibility to publish presentations on the web.

The size of the files are quite large, but certainly not much larger than most video files. In this day and age, broadband isn’t capped so heavily as it once was, so I don’t think the file size is so important as it once was. Anyway, it’s a good medium to use if presentations are what you need.

WOW!!! That was a fantastic slideshow. Loved it AND the great information in it, too. So do you know if sound will work, too? One last dumb question. When you say, “export as HTML from keynote” can you tell me what that means? Like how to get it into Sparkle?

If your slideshow has sound attached, it too will export as part of the presentation. To get it working in a website, you simple export it as HTML into its own folder. You then upload the folder to your web hosting (usually the same folder where your website files reside). In Sparkle, you add a code widget and enter an iframe that links to your presentation folder (see previous post regarding the code to use). That’s about it.

If you want to try my presentation in your own sparkle site, just create an embed widget box and enter the following code:

<iframe src="https://triselcommunications.com/presentations/index.html" height="540" width="960"></iframe>