Sharing your PowerPoint presentation on your website is not as straight forward. Usually you have to use third-party sites such as SlideShare to share and embed your presentation. What if we told you that you can create and share presentations in WordPress? In this article, we will show you how to create HTML presentations in WordPress and leave PowerPoint behind.
Why Create Presentations in WordPress and not Powerpoint?
PowerPoint is the most popular software to create presentations. You can easily create your slides and then upload your slideshow to a third-party website for sharing. However by doing this you lose control over your content.
By using WordPress to create presentations, you bring visitors to your website. You can use this opportunity to convert visitors into subscribers.
An HTML5 Slideshow on your own website is better SEO. All your slides can be indexed by search engines and users can land directly on your site.
How to Create an HTML5 Presentation in WordPress
First thing you need to do is install and activate the HTML5 SlideShow Presentations plugin. Upon activation, go to HTML5 Presentations » Add New to create your first presentation.
The slide editor has the default WordPress title and post editor box. You will see HTML5 Slide Formatting meta box below the post editor.
There are three formatting options for you to configure. First you need to choose the Slide Type. Since this is the first slide in your presentation, it will automatically become the Title Slide.
The next option is to choose a Slide Style. This option controls the visual appearance of your slide.
The last option, is to choose a Presentation Type. You can choose from Standard Presentation, Faux Widescreen, or Widescreen presentation type.
In the title area, you can enter your presentation title or the title of this particular slide.
The editor area is just like WordPress post editor area, and you can add anything you want here. You can add bulleted lists, images, videos, etc. You can even leave the edit area blank if you just want to add a title only slide.
Once you feel satisfied with your slide, you can save or publish it.
To add more slides into your presentation, you need to repeat the process. However, this time you can choose a parent slide as the presentation. On the HTML5 Slide Editing screen, you will see HTML5 Slide Attributes metabox. Select the first slide as your presentation from the drop down menu.
How to Display Your Slideshow in WordPress?
Now that you have created your slides, let’s display them on your website. Start by creating a new page in WordPress. You will notice a new metabox on the page edit screen titled HTML5 Presentations. Choose the presentation you want to display from the drop down menu and save your changes.
How to Use Custom Styles for Your Slideshow
You need to create a new stylesheet to completely override the plugin’s stylesheet with your own CSS. Use the file name html5slide-replace.css for your stylesheet and upload it to your theme or child theme‘s directory.
To make minor changes and add extra style rules, you need to name your stylesheet html5slide-style.css. Upload this stylesheet to your theme or child theme’s directory.
Presenting Your Slideshow
If you’re using your slide to present at a conference, then you need to open the page containing your presentation. You can launch your browser (preferably Google Chrome) in full-screen mode.
You can use arrow keys to move forward and backward between slides. If your slides get stuck, then simply click on an empty area on the screen, and you would be able to move forward and backward again.
We hope this article helped you create presentations in WordPress. Experiment with different slide types and styles to improve your slideshow.
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Google+.
Thanks – nice tips. I am doing something about powerpoint on my WordPress website
You’re welcome
How does WP handle a Ppresentation that contains a quiz and generates a certificate of completion [only if the quiz is passed].
All I see in the HTML5 attributes is the option to manually order slides when I create a second slide for my presentation. I also got a 404 when I tried to preview what I thought was a 2 slide presentation.
How can I add a second slide if there’s no drop down to tell WP what the parent slide is?
Can the WP editor not incorporate presentations that have been exported from PPT or Keynote as HTML? Or – can you just embed the presentation in a HTML field?
My presentations are somewhat larger than usual ones. So I prefer to use PowerPoint and then upload the exported html to a folder on my hosting and in WordPress, I use the iframe tag to embed it in my post.
No, the HTML Slide attribute meta box will not appear on posts.
I’d better export from PowerPoint as a PDF (or even as HTML) and host them in a subdomain. I think it’s more easier than re-writing in the wordpress editor.
Thanks a lot! This will definitely help me as I am revamping my website
Hope that this plugin will be compatible with WordPress 4.0 which will be released in a few days!!!!
I notice that you said to create a page. Is it also possible to use a post instead of a page?
We checked it with the latest version of WordPress and it worked fine.
You can find a link to the demo presentation on the plugin’s page at WordPress.org
I would like to use it, but I see that it has not been updated since last year and is compatible with WP 3.6., Will it work with the latest ver. of WP?
Where have I been? I thought I knew a lot about wordpress but despite this, every new idea you provide outdistances my knowledge. Thank you sooo much for this wonderful tip! This method is HUGE!
Is there an example link? I didn’t see one.