An Interest In:
Web News this Week
- March 20, 2024
- March 19, 2024
- March 18, 2024
- March 17, 2024
- March 16, 2024
- March 15, 2024
- March 14, 2024
Stunning Presentations with Asciidoctor and RevealJS
In the previous post, we quickly saw the power of Asciidoctor, how it could enhance the documentation, writing and many other features.
One of the other great features is its ability to create stunning HTML presentations along with another utility called RevealJS
Below is the sample presentation that is an asciidoctor markup file.
= Stunning PresentationsPrabhu R:imagesdir: images:title-slide-background-image: sea.jpg:title-slide-transition: fade:title-slide-transition-speed: fast:experimental: true== A Great Storyimage::galaxy.jpg[background, size='cover']Press kbd:[s] for Speaker View that displays notes [.notes]--* tell anecdote* make a point--[transition='convex']== Transition ConvexThis slide has a `convex` effect[background-color="gray"][transition='zoom']== Transition ZoomThis slide has a `zoom` effect,[background-color="teal"][transition='zoom']== Vertical SlidesThis is a Vertical slide, click kbd:[↓] to see vertical slides[background-color="crimson"][transition='slide']=== Vertical Slide 1Vertical slide 1[background-color="brown"][transition='slide']=== Vertical Slide 2Vertical slide 2[background-video="orca.mp4",options="loop,muted"][transition='concave']== Background VideoBackground looping video[%notitle][transition='concave']== THE ENDimage::end.jpg[background, size=cover]
To see how this stunning it gets rendered, visit here
Pressing Esc shows the thumbnail view of all the slides. Clicking on any of the slides jumps to that slide
The complete source is available in GitHub, and can be used as a starter template for your presentations
With a little of CSS knowledge more amazing effects can be brought it to the presentations. For more details look at the asciidoctor-revealjs site
Benjamin Schmid has an even more amazing presentation, a nice example of what asciidoctor and revealjs combination could produce.
Original Link: https://dev.to/rprabhu/stunning-presentations-with-asciidoctor-and-revealjs-1d1m
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To