This extension let you display a reveal js presentation directly from an opened markdown document.
This extension IS IN DEVELOPMENT and can have many bugs.
Sample of markdown :
---
theme : "white"
transition: "zoom"
customTheme: "myCSS"
---
Foo
Note: test note
---
Bar
\```csharp
public void AwesomeFunc(){
Show.Me.Your.Best();
}
\```
----
Sub Bar
---
The End.
Call the command Revealjs: Show presentation by side
to see your presentation next to your file.
Call the command Revealjs: Open presentation in browser
to see it in default browser.
On save the current editing slide will be show !
If your markdown file has more that one slide, status bar will display the slide count on right. If you now click on it it will directly on RevealJS presentation next to the file.
Once you have at least show the presentation once, it will also display the http address that you can use directly in your browser. When you click on it, browser will open.
Note : First time windows will ask you about firewall. If you open the port for the application, you can see your prensentation remotly.
You can change settings directly in your markdown file using front matter style. You can change all extention settings like this :
---
theme : "white"
transition: "zoom"
---
You can add custom style in a css file in same folder that your markdown.
exemple :
if your file name is my-theme.css
just add this in the front header :
---
customTheme : "my-theme"
---
Note that you can use both theme and custom theme as same time. Your custom theme will be loaded after to override default revealJS theme.
- Create PDF from presentation
You can customise many setting on for your revealjs presentation.
Name | Description | Default |
---|---|---|
revealjs.notesSeparator | Revealjs markdown note delimiter | note: |
revealjs.separator | Revealjs markdown slide separator | ^(
?|
)---(
?|
)$ |
revealjs.verticalSeparator | Revealjs markdown vertical separator | ^(
?|
)--(
?|
)$ |
revealjs.theme | Revealjs Theme (black, white, league, beige, sky, night, serif, simple, solarized | black |
revealjs.highlightTheme | Highlight Theme | Zenburn |
revealjs.controls | Display controls in the bottom right corner | true |
revealjs.progress | Display a presentation progress bar | true |
revealjs.slideNumber | Display the page number of the current slide |
|
revealjs.history | Push each slide change to the browser history |
|
revealjs.keyboard | Enable keyboard shortcuts for navigation | true |
revealjs.overview | Enable the slide overview mode | true |
revealjs.center | Vertical centering of slides | true |
revealjs.touch | Enables touch navigation on devices with touch input | true |
revealjs.loop | Loop the presentation |
|
revealjs.rtl | Change the presentation direction to be RTL |
|
revealjs.shuffle | Randomizes the order of slides each time the presentation loads |
|
revealjs.fragments | Turns fragments on and off globally | true |
revealjs.embedded | Flags if the presentation is running in an embedded mode, i.e. contained within a limited portion of the screen |
|
revealjs.help | Flags if we should show a help overlay when the questionmark key is pressed | true |
revealjs.showNotes | Flags if speaker notes should be visible to all viewers |
|
revealjs.autoSlide | Number of milliseconds between automatically proceeding to the next slide, disabled when set to 0, this value can be overwritten by using a data-autoslide attribute on your slides |
|
revealjs.autoSlideStoppable | Stop auto-sliding after user input | true |
revealjs.mouseWheel | Enable slide navigation via mouse wheel |
|
revealjs.hideAddressBar | Hides the address bar on mobile devices | true |
revealjs.previewLinks | Opens links in an iframe preview overlay |
|
revealjs.transition | Transition style (none/fade/slide/convex/concave/zoom) | default |
revealjs.transitionSpeed | Transition speed (default/fast/slow) | default |
revealjs.backgroundTransition | Transition style for full page slide backgrounds (none/fade/slide/convex/concave/zoom) | default |
revealjs.viewDistance | Number of slides away from the current that are visible | 3 |
revealjs.parallaxBackgroundImage | Parallax background image |
|
revealjs.parallaxBackgroundSize | Parallax background size (CSS syntax, e.g. 2100px 900px) |
|
revealjs.parallaxBackgroundHorizontal | Number of pixels to move the parallax background per slide |
|
revealjs.parallaxBackgroundVertical | Number of pixels to move the parallax background per slide |
|
Please add issues on github.