How to Get Embed Code From PowerPoint: Simple Copy-Paste Method for Slides

I still remember my first PowerPoint presentation back in 1998. Back then, sharing slides meant passing around floppy disks.

Today, embedding slides in a web page is as simple as copying and pasting a bit of code. The process works the same across PowerPoint 2016, 2019, and 365, with just a few clicks to generate the embed code.

You’ll need to publish your slides to the web first, but don’t worry—it’s a one-time setup that takes less than 5 minutes. Once published, the embed code is ready to drop into any webpage.

This method preserves animations, transitions, and speaker notes. It’s the cleanest way to share interactive slides online without uploading files manually.

What Youll Need

Instructions

Here’s the straightforward approach I use to grab shareable code for any presentation.

Open your PowerPoint file and click File in the top-left corner. Select Save As from the menu. In the dialog that appears, choose Web Page (.htm, .html) as the file type. This option generates a folder containing all the necessary assets for web display.

Navigate to your desired save location and click Save. PowerPoint will create a folder with the same name as your presentation. Wait until the process completes and you see the confirmation message at the bottom of the window.

Open the folder you just created. Inside, you’ll find several files, including an index.htm file. This is the main HTML file that contains the structure of your presentation. Right-click this file and select Open with, then choose a text editor like Notepad or VS Code.

Scroll through the code until you find the <div> or <iframe> section that contains your slides. This is typically near the middle of the file and will include references to the slide images and any embedded media. The code you need is within this section.

Identify the section of code that starts with <div id=”slideContainer”> or similar. This div usually contains all the elements of your slideshow. Copy the entire block from the opening <div> tag to the closing </div> tag.

If you prefer using an iframe, look for or create an <iframe> tag that points to your index.htm file. The src attribute should be the path to your saved HTML file. For example: <iframe src=”presentationFolder/index.htm” width=”800″ height=”600″></iframe>.

Paste the copied code into a new HTML file or a web platform that supports custom HTML, like a blog or CMS. Save the changes and open the page in a browser. Verify that all slides appear correctly and that any animations or transitions work as expected.

If something doesn’t display properly, double-check that all associated files (images, scripts) are in the same directory as your HTML file. The paths in the code should be relative, so ensure the folder structure remains intact when you move the files.

Adjust the width and height attributes in your embed code to fit your webpage layout. For standard presentations, start with width=”960″ height=”540″ (16:9 aspect ratio). Test different sizes to ensure the slides remain readable and visually appealing on all devices.

If you’re embedding in a responsive design, consider wrapping the iframe in a container div with CSS that maintains the aspect ratio. This prevents distortion on mobile screens while keeping the presentation accessible to all viewers.

Tips and Common Mistakes

Here are the practical insights I’ve gathered from years of working with presentations and embed codes.

File Type Precision: In Step 1, ensure you select Web Page (.htm, .html) and not just HTML—this option generates the critical folder structure with all supporting assets. The single-file HTML option won’t include your images or embedded media, which defeats the purpose of a complete embed.

Code Location Tip: When scanning through the index.htm file in Step 2, don’t just look for any div container. The slideContainer div mentioned in Step 3 typically sits between comments like and . This is PowerPoint’s way of marking the essential code block for your slides.

Testing Shortcut: For Step 4, I always test the embed code in a simple HTML file first before adding it to my main site. Create a blank HTML document with just the embed code and open it directly in your browser. This isolates any issues to the embed code itself rather than your site’s CSS or JavaScript.

Responsive Design Hack: The standard dimensions in Step 5 (960×540) work for most layouts, but for true responsiveness, wrap your iframe in a container with this CSS: position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; Then make the iframe position: absolute; top: 0; left: 0; width: 100%; height: 100%; This maintains the 16:9 ratio perfectly on any screen.

Frequently Asked Questions

Getting an embed code from PowerPoint is simpler than you think! Just save your slides as a web page, extract the code, and paste it into your site. Now it’s your turn—try embedding a presentation today and watch your content come to life! 🚀