<h1>Some options</h1>
<ul>
<li>just put the PDFs on the site.</li>
<li><code>runestone</code> — allows you to create interactive webpages, with programming code.</li>
<li><code>sozi</code> — for creating animated slideshows from SVGs.</li>
<li>You can generate SVGs from <span class="math-container">$LaTex$</span>. First use a <span class="math-container">$Tex$</span> engine that creates DVIs, then convert the DVIs to SVGs.</li>
</ul>

CC BY-SA 4.0
2019-05-21T08:33:07.693Z
2019-05-21T08:33:07.693Z
2020-06-18T08:36:57.023Z
ctrl-alt-delor
<p>Create a Beamer presentation using RMarkdown, with Rstudio or any other tool.
Prepare your slide content using Markdown.
Click on the 'Knit' to format and view as HTML or PDF of the slides. Renders beautifully.
<a href="https://i.sstatic.net/32ZmD.png" rel="nofollow noreferrer"><img src="https://i.sstatic.net/32ZmD.png" alt="enter image description here" /></a></p>

CC BY-SA 4.0
2019-06-06T17:15:49.330Z
Hi Manoov, welcome to [cseducators.se]! This is currently a stub answer.  Could you edit the answer to add more information?  You will not find much in the way of upvotes for one-sentence responses.
Ben I.
CC BY-SA 4.0
2019-06-10T18:41:14.593Z
Added reference to more clarity.
Manoov
CC BY-SA 4.0
2019-06-06T11:52:14.950Z
2023-01-31T11:48:17.593Z
2023-01-31T11:48:17.593Z
Manoov
<p>If you can get the slide deck into Google Slides you can publish to the web from there. </p>

<p>With your slides open, select Publish to Web on the File menu. From there click on Embed and then the Publish button.  You'll get an HTML snippet that uses an iframe. Copy and paste that into your HTML and it'll look just like it does in the presentation. </p>

CC BY-SA 4.0
2019-05-17T01:32:21.890Z
Does it work with PDFs?
Drimades Boy
CC BY-SA 4.0
2019-05-17T12:39:44.940Z
Slides doesn't, but if you have the PDF online somewhere it's pretty easy to embed a PDF into a web page.
Ryan Nutt
CC BY-SA 4.0
2019-05-16T17:06:48.820Z
2019-05-16T17:06:48.820Z
Ryan Nutt
<p>One of our instructors at CSU does his entire course web site using 
<a href="https://www.pmwiki.org" rel="nofollow noreferrer">Pmwiki</a>, which uses a markup language. If you follow certain conventions, it can be converted to a slide show in the browser. For an example how this works, see  <a href="https://www.cs.colostate.edu/~cs253/Spring19/" rel="nofollow noreferrer">https://www.cs.colostate.edu/~cs253/Spring19/</a> This is a C++ course for students in the second year. On the home page is a link to the slide technology used. I believe it is java script that takes the HTML file and renders it in a slide format. If you look at the Schedule page and click any of the links to lecture material, you will see a straight web page. At the top left corner is a link that will render the page as a slide show. You can advance through the slide show using the arrow keys.</p>

<p>One of the other instructors takes screen shots of the PowerPoint slides and embed them in the HTML page. For an example of this style, see <a href="http://www.cs.colostate.edu/~cs410/yr2018fa/more_progress/show01/all_slides.php" rel="nofollow noreferrer">here</a>.</p>

<p>If either of these interest you, I can put you in touch with the specific instructors.</p>

CC BY-SA 4.0
2019-05-17T16:56:21.900Z
2019-06-19T11:06:59.487Z
2019-06-19T11:06:59.487Z
Fritz Sieker
<p>Creating appealing slides using markdown and publishing them online using github or netlify is another exciting way to create slides. My Slides hosted at GitHub Pages: <a href="https://manoov.github.io/slides/moodle_fop-2022/" rel="nofollow noreferrer">https://manoov.github.io/slides/moodle_fop-2022/</a></p>

CC BY-SA 4.0
2023-01-06T19:46:46.837Z
2023-01-06T19:46:46.837Z
Manoov
<p><a href="https://pandoc.org/" rel="nofollow noreferrer">pandoc</a> can convert slides written in markdown to a html presentation using <a href="https://github.com/hakimel/reveal.js/" rel="nofollow noreferrer">reveal.js</a>. pandoc can go markdown->latex (beamer) too. Not sure about going latex->reveal.js but it could be possible.</p>

CC BY-SA 4.0
2019-05-17T10:04:56.953Z
2019-05-17T10:04:56.953Z
john french
<p>I have PDF slides prepared in Latex.  I would like to have all of my slides in a website where students can find all learning materials, animations, examples, etc. Do you have any experience with creating HTML/CSS/other from slides? Is there any framework you would recommend?</p>

<p>Edit: I would like to write everything in HTML/CSS so I can add links and animations of algorithms in the future.</p>

CC BY-SA 4.0
2019-05-16T16:42:14.930Z
I'm not sure I understand the question.  You have... a powerpoint?  And you're trying to convert it to HTML/CSS?
Ben I.
CC BY-SA 4.0
2019-05-17T01:31:50.577Z
There are no power points here. I have PDF slides prepared in Latex.
Drimades Boy
CC BY-SA 4.0
2019-05-17T10:25:09.173Z
I edited your question to include that information. In the future, if a clarification is requested, please also do this.  Comments are considered transient on SE.  Questions are meant to be high-quality and self contained.
Ben I.
CC BY-SA 4.0
2023-02-08T11:57:15.033Z
Can you explain why your current workflow $\LaTeX \to \text{PDF}$ isn't good enough? Links and animations are easy enough to do with that.
Kai
<resource-request><lecture-tools>
How to create webpage slides for teaching?
# How to create webpage slides for teaching?

(Asked by: username_0 on 2019-05-16)

I have PDF slides prepared in Latex. I would like to have all of my slides in a website where students can find all learning materials, animations, examples, etc. Do you have any experience with creating HTML/CSS/other from slides? Is there any framework you would recommend?

Edit: I would like to write everything in HTML/CSS so I can add links and animations of algorithms in the future.

**Tags:** resource-request, lecture-tools

> **Comments:**
> **username_1**: I'm not sure I understand the question.  You have... a powerpoint?  And you're trying to convert it to HTML/CSS?  
> **username_0**: There are no power points here. I have PDF slides prepared in Latex.  
> **username_1**: I edited your question to include that information. In the future, if a clarification is requested, please also do this.  Comments are considered transient on SE.  Questions are meant to be high-quality and self contained.  
> **username_2**: Can you explain why your current workflow $\LaTeX \to \text{PDF}$ isn't good enough? Links and animations are easy enough to do with that.  

---

## 6 answers

### Answer by username_6 on 2019-05-17. Score: 2

One of our instructors at CSU does his entire course web site using
[Pmwiki](https://www.pmwiki.org), which uses a markup language. If you follow certain conventions, it can be converted to a slide show in the browser. For an example how this works, see <https://www.cs.colostate.edu/~cs253/Spring19/> This is a C++ course for students in the second year. On the home page is a link to the slide technology used. I believe it is java script that takes the HTML file and renders it in a slide format. If you look at the Schedule page and click any of the links to lecture material, you will see a straight web page. At the top left corner is a link that will render the page as a slide show. You can advance through the slide show using the arrow keys.

One of the other instructors takes screen shots of the PowerPoint slides and embed them in the HTML page. For an example of this style, see [here](http://www.cs.colostate.edu/~cs410/yr2018fa/more_progress/show01/all_slides.php).

If either of these interest you, I can put you in touch with the specific instructors.


---

### Answer by username_4 on 2023-01-06. Score: 2

Creating appealing slides using markdown and publishing them online using github or netlify is another exciting way to create slides. My Slides hosted at GitHub Pages: <https://manoov.github.io/slides/moodle_fop-2022/>


---

### Answer by username_7 on 2019-05-17. Score: 2

[pandoc](https://pandoc.org/) can convert slides written in markdown to a html presentation using [reveal.js](https://github.com/hakimel/reveal.js/). pandoc can go markdown->latex (beamer) too. Not sure about going latex->reveal.js but it could be possible.


---

### Answer by username_3 on 2019-05-21. Score: 1

# Some options

* just put the PDFs on the site.
* `runestone` — allows you to create interactive webpages, with programming code.
* `sozi` — for creating animated slideshows from SVGs.
* You can generate SVGs from $LaTex$. First use a $Tex$ engine that creates DVIs, then convert the DVIs to SVGs.


---

### Answer by username_4 on 2019-06-06. Score: 0

Create a Beamer presentation using RMarkdown, with Rstudio or any other tool.
Prepare your slide content using Markdown.
Click on the 'Knit' to format and view as HTML or PDF of the slides. Renders beautifully.
[![enter image description here](https://i.sstatic.net/32ZmD.png)](https://i.sstatic.net/32ZmD.png)

> **Comments:**
> **username_1**: Hi username_4, welcome to [cseducators.se]! This is currently a stub answer.  Could you edit the answer to add more information?  You will not find much in the way of upvotes for one-sentence responses.  
> **username_4**: Added reference to more clarity.  

---

### Answer by username_5 on 2019-05-16. Score: 0

If you can get the slide deck into Google Slides you can publish to the web from there.

With your slides open, select Publish to Web on the File menu. From there click on Embed and then the Publish button. You'll get an HTML snippet that uses an iframe. Copy and paste that into your HTML and it'll look just like it does in the presentation.

> **Comments:**
> **username_0**: Does it work with PDFs?  
> **username_5**: Slides doesn't, but if you have the PDF online somewhere it's pretty easy to embed a PDF into a web page.  

---

