![]() ![]() See the () of slide properties.Īny occurences of one or more dotted CSS class names followed by square brackets are replaced with the contents of the brackets with the specified classes applied: * Expansion of `` expressions to property values * Using slides as templates using properties `template` and `layout` * Naming and styling slides using properties `name` and `class` Slide properties serve multiple purposes: Initial lines containing key-value pairs are extracted as slide properties: Content classes, for styling specific content Slide properties, for naming, styling and templating slides To help out with slide layout and formatting, a few Markdown extensions have been included: # Of course, Markdown can only go so far. You may download remark to have your slideshow not depend on any online resources, or reference the () online directly. Have a look at the () if you're not familiar with Markdown formatting.Ī simple HTML document is needed for hosting the styles, Markdown and the generated slides themselves: A line containing three dashes constitutes a new slide Regular Markdown rules apply with only a single exception: Easily collaborate with others, keeping track of changes using your favourite SCM tool, like Git or MercurialĪ Markdown-formatted chunk of text is transformed into individual slides by JavaScript running in the browser: Store it wherever you like on your computer, hosted from your Dropbox, hosted on Github Pages alongside the stuff you're presenting. Style it using regular CSS, just like any other HTML contentĪs the slideshow is contained in a plain file, you may: Focus on the content, expressing yourself in next to plain text not worrying what flashy graphics and disturbing effects to put whereĪs the slideshow is actually an HTML document, you may: footnote You probably want to convert existing slideshows as well]Īs the slideshow is expressed using Markdown, you may: Then remark might be perfect for your next.red slideshow! If your ideal slideshow creation workflow contains any of the following steps: footnote At least browsers try their best] Touch support for smart phones and pads, i.e. Slide scaling, thus similar appearance on all devices / resolutions. Syntax highlighting, supporting a range of languages Presenter mode, with cloned slideshow view Markdown formatting, with smart extensions # What is it and why should I be using it?Ī simple, in-browser, Markdown-driven slideshow tool targeted at people who know their way around HTML and CSS, featuring: "description": "Description of My Deck.footnote()] If you specify content as a string of HTML or Markdown, it will all be grouped into one element and edited as a text box. The benefit of using content blocks is that the elements you define are separately editable inside of the Slides editor. Note that there are three different ways to define slide content, blocks, HTML and Markdown. The following JSON demonstrates most of the available options. If you want to group multiple slides into one vertical stack you can nest them in an array: Here's the bare minimum JSON you'll need to describe a deck. Here's where you can access the CSS editor from inside of the Style panel: Add a red border to all vertical stacks of slides Add a blue border to all slides (each slide is a ) Larger slide numbers (if slide numbers are enabled for the deck) Turn text white if the slide has a dark background This is a convenient way to easily apply your CSS to specific elements.Įxamples // Change presentation progress bar color If you turn on the developer mode you can also add custom classes to any focused element. You can load custom fonts from Typekit and Google fonts and apply them using custom CSS. Note that when your styles are saved they will be automatically wrapped in a ".reveal " selector to avoid conflicts with other page styles. We apply the styles in real-time as you type so there's no need to leave the editor or even press a refresh button to see what you're getting. The editor preprocesses styles using LESS, though you're free to write plain CSS as well. It's available as an option inside of the Style panel of the presentation editor. The CSS editor lets you author custom styles for your presentation with a real-time preview of the result. There are a few limitations with exporting this way but it should provide a good starting point. This provides a way of exporting your deck markup and the core Slides styles to reveal.js. You can access the complete HTML for all slides in your deck inside of the export panel, under "Export to reveal.js". ![]()
0 Comments
Leave a Reply. |
Details
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |