How to embed your HTML5 presentation into a website or blog

Do you want to embed a PowerPoint presentation into your website? The best way is to convert it to HTML5 format. A great advantage of HTML5 slides is that they can be viewed on virtually any PC or mobile device, including iPads.

In this article, you'll learn how to turn a PPT presentation into HTML5 with iSpring Converter Pro and insert it in your website or blog. Follow this simple step-by-step guide:

  1. Publish an HTML5 presentation for uploading to the Web

  2. Get the presentation’s URL on the server

  3. Insert your HTML5 presentation in a website

Step 1: Publish a presentation for uploading to the Web

When your PowerPoint is ready to convert to HTML5, you can publish and put the presentation on a website using the Publish button on the iSpring toolbar. 

ribbon.pngChoose Publish to My Computer. You can select a local folder for the HTML5 presentation, where a new folder with the specified file name will be created. 

publish.pngYou can also customize a player, adjust the size and quality of your presentation, and set up protection parameters. After you finish with all the configurations, click Publish.

Once the publishing process is complete, you need to upload the entire folder of the specified file name to the server.

Step 2: Get the presentation’s URL

You need to find out the HTTP URL of the uploaded HTML5 presentation and copy the URL to the clipboard. The URL of the presentation depends on the specific settings of your server.

Tip: Make sure that the selected URL starts with ‘http://’ and not ‘ftp://’

Step 3: Insert your HTML5 presentation into a website

To have your PowerPoint presentation logically fit into a website, you can choose one of the following ways to play it:

  • play on a separate webpage;
  • open in a pop-up;
  • insert into an iframe.

a) Play HTML5 Presentation on a Separate Webpage

One of the easiest ways to share your presentation via a website is to provide a hyperlink to the presentation somewhere in a webpage. To insert a hyperlink, switch to the HTML editing mode and use the following code:

<a title="CUSTOM TITLE OF THE LINK" href=”ENTER YOUR URL” target=”_blank”> CUSTOM TEXT OF THE  HYPERLINK</a>  

You can choose to open the presentation in a new browser tab (target=”_blank”) or in the same tab (target=“_self”)

b) Open HTML5 Presentation as a pop-up

To open your presentation in a pop-up window, make sure that your website allows using JavaScript code.

You can use the following code to create an on-click pop-up:

<script>  function popup(url)  {
     window.open(url, 'new', 'width=800,height=600,scrollbars=no,menubar=no,status=no,toolbar=no');
 }
 </script>
 <a onClick="popup('http:// ENTER YOUR URL ')">CUSTOM TEXT OF THE HYPERLINK</a>  

You can customize the width and height and add different elements to your pop-up (learn more).

Alternatively, you can set the pop-up window to appear as soon as the webpage is loaded:

<script>  function popup(url)  {
     window.open(url, 'new', 'width=800,height=600,scrollbars=no,menubar=no,status=no,toolbar=no');
 }
 popup('http://ENTER YOUR URL');
 </script>
 

c) Insert HTML5 presentation into iframe

If you want to show your HTML5 presentation right within your webpage, you can insert it into an iframe using the following HTML code (learn more):

<iframe src="http://ENTER YOUR URL" width="800" height="600" scrolling=”no” />

Published on your website in one of the described ways, your HTML5 presentation can be delivered to much wider audiences using modern Web browsers, mobile devices and iPads. To make sure that your HTML5 presentation will be played back properly, check out iSpring Converter’s tech specs.


Was this article helpful?

Thanks for your feedback!

How can we help you?

EMAIL
MESSAGE

Your request to iSpring has been submitted.

Please check your email for support replies. We reply to every message asap. If you don't hear back from us, check your spam folder and add to your list of approved senders.

Oops! Something went wrong...

Please contact them at .