Answers.Body: <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>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-05-21T08:33:07.693Z
Answers.LastActivityDate: 2019-05-21T08:33:07.693Z
Answers.LastEditDate: 2020-06-18T08:36:57.023Z
Answers.UserDisplayName: ctrl-alt-delor
Answers.Body: <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>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-06-06T17:15:49.330Z
Answers.Text: 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.
Answers.UserDisplayName: Ben I.
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-06-10T18:41:14.593Z
Answers.Text: Added reference to more clarity.
Answers.UserDisplayName: Manoov
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-06-06T11:52:14.950Z
Answers.LastActivityDate: 2023-01-31T11:48:17.593Z
Answers.LastEditDate: 2023-01-31T11:48:17.593Z
Answers.UserDisplayName: Manoov
Answers.Body: <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>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-05-17T01:32:21.890Z
Answers.Text: Does it work with PDFs?
Answers.UserDisplayName: Drimades Boy
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-05-17T12:39:44.940Z
Answers.Text: Slides doesn't, but if you have the PDF online somewhere it's pretty easy to embed a PDF into a web page.
Answers.UserDisplayName: Ryan Nutt
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-05-16T17:06:48.820Z
Answers.LastActivityDate: 2019-05-16T17:06:48.820Z
Answers.UserDisplayName: Ryan Nutt
Answers.Body: <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>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-05-17T16:56:21.900Z
Answers.LastActivityDate: 2019-06-19T11:06:59.487Z
Answers.LastEditDate: 2019-06-19T11:06:59.487Z
Answers.UserDisplayName: Fritz Sieker
Answers.Body: <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>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2023-01-06T19:46:46.837Z
Answers.LastActivityDate: 2023-01-06T19:46:46.837Z
Answers.UserDisplayName: Manoov
Answers.Body: <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>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2019-05-17T10:04:56.953Z
Answers.LastActivityDate: 2019-05-17T10:04:56.953Z
Answers.UserDisplayName: john french
Body: <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>
  
Comments.ContentLicense: CC BY-SA 4.0
Comments.CreationDate: 2019-05-16T16:42:14.930Z
Comments.Text: I'm not sure I understand the question.  You have... a powerpoint?  And you're trying to convert it to HTML/CSS?
Comments.UserDisplayName: Ben I.
Comments.ContentLicense: CC BY-SA 4.0
Comments.CreationDate: 2019-05-17T01:31:50.577Z
Comments.Text: There are no power points here. I have PDF slides prepared in Latex.
Comments.UserDisplayName: Drimades Boy
Comments.ContentLicense: CC BY-SA 4.0
Comments.CreationDate: 2019-05-17T10:25:09.173Z
Comments.Text: 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.
Comments.UserDisplayName: Ben I.
Comments.ContentLicense: CC BY-SA 4.0
Comments.CreationDate: 2023-02-08T11:57:15.033Z
Comments.Text: 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.
Comments.UserDisplayName: Kai
Tags: <resource-request><lecture-tools>
Title: How to create webpage slides for teaching?
ThreadText: # 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://username_4.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.  
  
  ---
  
  