Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
June 7, 2022 04:51 pm GMT

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

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To