Option auto: true
Simplemenu can simplify HTML editing by letting authors just set a name to the sections, and autogenerate a menu from that.
Set the auto-option to true.
…
Reveal.initialize({
simplemenu: {
auto: true
},
plugins: [ Simplemenu ]
Optionally, choose data-name
instead of name
.
…
Reveal.initialize({
simplemenu: {
auto: true,
selectby: 'data-name'
},
plugins: [ Simplemenu ]
Give your sections a name
, and add an empty menu.
<div class="menubar">
<ul class="menu"></ul>
</div>
<div class="slides">
<section name="Start">
//...
</section>
<section name="What it does">
//...
</section>
<section name="Setup">
//...
</section>
</div>
When having set the 'select-by' option to data-name
, you should also use that in the markup.
<div class="menubar">
<ul class="menu"></ul>
</div>
<div class="slides">
<section data-name="Start">
//...
</section>
<section data-name="What it does">
//...
</section>
<section data-name="Setup">
//...
</section>
</div>