Learn how to create customizable HTML presentations using Pinegrow’s AI Assistant and extend the tool with your own custom features.
Download the project files
Download the project ZIP or open the project on Pinegrow Online.
Watch the video
This tutorial is available in both video and text format. The video covers more details.
Getting Started with the AI Presentation Maker
The following transcript is an overview of the topics covered in the video. Watch the video tutorial if you want to follow the tutorial.
In this chapter, we’ll explore how to use the AI Assistant to create a simple HTML presentation and customize it for your needs.
Setting up the Project in Pinegrow Web Editor
After downloading and unpacking the project, open it in Pinegrow Web Editor and arrange the panels to suit your needs.
Using the Info Panel
The project comes with an info panel that explains a bit about the tool and how to use it, as well as providing quick tools like buttons that run AI Assistant commands.
Creating a Presentation
In this chapter, we’ll walk through the process of creating a presentation using the AI Assistant, either by providing a topic or by providing the content for the presentation.
Creating a Presentation by Providing a Topic
- Select the body element of the page where you want the presentation.
- Click “Create a Presentation” in the info panel.
- Provide a topic for the presentation using a voice command or by typing it in.
- Review the generated presentation created by the AI Assistant.
Creating a Presentation by Providing Content
- Undo the previous presentation to start fresh.
- Run the “Create a Presentation” command again.
- Paste in the entire content of the presentation and click “Chat” to keep the context of the create a presentation task.
- Review the generated presentation based on the provided content.
Customizing the Presentation
In this chapter, we’ll explore some additional commands and features available in the AI Assistant to further customize and enhance your presentation.
Splitting a Slide into Multiple Slides
Select a slide with a lot of information and ask the AI to split the slide into multiple slides.
Changing the Slide Layout
Ask the AI to change the slide layout to a different template, such as “Slide with Chapter Title”.
Adding Images to Slides
Select a slide and ask the AI to add a suitable image. PineGrow will search for an appropriate image on Unsplash.
Customizing the Design and Extending the Tool
In this chapter, we’ll learn how to modify the overall design of the presentation and extend the tool by adding new templates or changing existing ones.
Modifying the Presentation Design
Use the design panel in Pinegrow Web Editor to modify the overall design of the presentation, such as changing colors or using the “Surprise Me” option for a new design.
Adding New Templates and Commands
Extend the tool by adding new templates or changing existing ones, making sure to give them a name so they can be referenced. Add new commands to the underscore info page to appear in the info panel.
Using Pinegrow Online
In this chapter, we’ll explore how to use the AI Presentation Maker on Pinegrow Online without installing Pinegrow Web Editor.
Accessing the AI Presentation Maker on Pinegrow Online
Visit Pinegrow Online, find the AI Presentation Maker under Featured Projects, and click “Edit” to start creating presentations right away. Or use the direct link to the Presentation Maker.
Downloading and Previewing Presentations
You can download the presentations created on Pinegrow Online, but you won’t be able to preview them without an account.
