reveal / revealjs.com

The official reveal.js website and documentation

revealjs.com

The official reveal.js website and docs. Contributions are welcome!

Installation

1. Clone the repo

   $ git clone https://github.com/reveal/revealjs.com.git && cd revealjs.com

2. Install dependencies

   $ yarn

3. Start the development server

   $ yarn start

The development server will automatically reload as you make changes.

Spell Check

There's a built-in task for spell checking.

$ yarn test

Formatting

We use Prettier to ensure consistent code formatting. The rules are as follows:

• Single quotes for strings.
• 2-space indentation.

Make sure your code adheres to these rules before committing. You can format your code manually with:

$ yarn prettier --write .

GitHub Actions Check

Our repository includes a GitHub Actions workflow that automatically checks code formatting on each push and pull request. This ensures all code merged into the repository follows the defined formatting rules.

Translation

We welcome contributions to help translate the site into different languages. If you would like to help with translations, please follow our Translation Guide. This guide provides detailed instructions on how to contribute translations.

Technologies

This site is built using Eleventy — a powerful but easy to use static site generator. It's styled with tailwindcss and the docs are written in Markdown.

Deploy

The site is hosted on Netlify and automatically deploys the master branch when there are new commits.

We automatically generate our production build at deploy-time but it's also possible to do it manually with:

yarn run production

Note

reveal.js is installed from the master branch. If it gets stuck on an old version, remove the reveal.js entry from package.lock.json and rerun yarn.

---

This updated README.md now includes a section about helping with translations, directing users to follow the translation-guide.md for detailed instructions.

revealjs.com's Issues

Ordered lists not obeying start attribute

When using ordered lists and wanting the list to start on a specific number, it persists the count to begin with one instead of the number specified in the start attribute. Example:

<ol start="21">
   <li></li>
</ol>

r-fit-text is not working

The library that we use to fit text (fitty) is never executed in the reveal.js docs. My best guess is there's a build error but I haven't been able to track it down yet. The error doesn't happen when running the site locally (even if you run the production build).

Here's a direct link showing fit-text not working: https://revealjs.com/demo/#/12

Reported by @cfjedimaster

Google Analytics

Remove Google Analytics

If you must have an analytics system, might I suggest either:

• Plausible: https://plausible.io (offers a 50% discount for FOSS projects)
• Goatcounter: https://goatcounter.com
• Matomo: https://matomo.org
• Fathom: https://usefathom.org

These solutions are all well-tested and open-source. This, of course, means they
can be independently audited for privacy and security. Instead of using a proprietary
nonfree system such as Google Analytics, perhaps we could work together to replace
it with something slightly more ethical?

Furthermore, the majority of privacy features in evergreen browsers block Google
Analytics from being run. I can not say the same for solutions such as Plausible,
which suggests they are trusted for their privacy by independent persons.

If you need any more information, please contact me!

Leadership Concept Analysis: Recruitment and Selection

One of the essential strategies for improving healthcare delivery within any clinical settings is assigning duties to the most appropriate and competent healthcare providers who can deliver high-quality care. Leaders within the healthcare settings must ensure that they assign responsibilities correctly so that they can achieve the desired results that relate to the mission and values of the organization according to the specified order in quality custom essay. This process begins by recruiting and selecting the qualified candidates to fill vacancies in the healthcare settings. The administration of health facilities must take time to examine the organization’s values and mission before choosing the required persons who can deliver health services. This process is significant as it can enhance healthcare delivery, and literature has demonstrated that it is useful in improving patient care, especially when implemented by nurse leaders.
Significance of the Topic
The recruitment and selection of qualified health professionals is a significant approach to improving patient care. According to Ekwoaba, Ikeije, and Ufoma, the recruitment process involves attracting a competent workforce. For instance, in a setting where patients with acute illnesses seek care, human resource management must advertise vacant positions for health professionals who can assess patients, diagnose their illnesses appropriately, and prescribe treatment. Then, professionals who attended healthcare training institutions and have the required skills can apply to implement such duties. The human resource management can then identify the best candidates and then request them to attend the health facility for interviews. Eventually, qualified candidates who can meet the needs of the patients and those of the organization can be selected. Kossivi, Xu, and Kalgora argue that choosing the most appropriate employees can enhance retention rates. Therefore, health professionals whose personal values and missions align with those of the organization are the ones who can be selected as they can be retained in the organization for long. This process can prevent the health organization from undergoing unnecessary costs due to turnover or substandard care. Considerably, recruitment and selection are helpful to both patients and the health organizations.

The markdown section sample slidedeck not rendered

There is just a blank screen in this section:

Microsoft Edge Version 107.0.1418.62 (Official build) (64-bit) @ Windows 11 22h2

Auto-Animate text is incorrect

On the Auto-Animate page (https://revealjs.com/auto-animate/) there are two problems.

First, the second paragraph refers to the word "Magic" which isn't in the demo.

Secondly, I don't believe (but could be wrong) the demo code is correctly being used in the demo itself. So the demo code shows two H1s with text, "Auto" and "Animate", while the demo itself shows "Auto-Animate". Also, the changes in style don't seem to match the source code.

Cannot spell check cotnent, mdspell is not installed

I just cloned. the repo and installed the Node dependencies as instructed in the README.

When I run npm run test I get an error about mdspell not being found:

> [email protected] test
> mdspell -r -n -a --en-us 'src/*.md' 'src/**/*.md'

sh: mdspell: command not found

It appears that the markdown-spellcheck package wasn't included in package.json

License for the docs site

Hi, I am interested in using your site as a template for the documentation of another open source project (MIT license), wondering if it's possible for you to add a permissive license to this repo.

Offer to Help with Chinese Translation of Documentation

Hi @hakimel ,

I'm a big fan of reveal.js and have been using it extensively for my presentations. I truly appreciate all the hard work and dedication that has gone into developing such an amazing tool.

As a native Chinese speaker and a passionate user of reveal.js, I would love to contribute to this project by helping with the Chinese translation of the documentation. I believe this will make the tool more accessible to Chinese-speaking users and help grow the community even further.

Please let me know how I can assist with this effort. I'm eager to get started and contribute in any way possible.

Thank you for considering my offer, and thank you once again for creating reveal.js!

Best regards,
Elvis Mao

Markdown page is misleading (incorrect?)

Hi, the page https://revealjs.com/markdown/ contains example code like this:

<section data-markdown>
  <textarea data-template>
    ## Slide 1
    A paragraph with some text and a [link](http://hakim.se).
    ---
    ## Slide 2
    ---
    ## Slide 3
  </textarea>
</section>

implying it's possible to separate slides with ---. However pasting this into the sample presentation leads to a single slide with horizontal rules on it.

I also notice that you don't need the inner textarea element - I don't know if this is supposed to work?

Thanks for your time