Reveal Hugo newbie question: adding Reveal plugins?

support
1

I’m an absolute hugo newbie trying to do a seven page static presentation-style website usable by nontechnical nonpresenters.

After an extensive 30 second search, Reveal Hugo seems perfect for the job.

Kudos - it was extremely easy to get working, despite understanding nothing of how it’s written.

After 15 minutes of reading the doc, I saw how to pass parameters to Reveal, and verified I could turn e.g. controls_tutorial on and off.

It’s not quite clear, however, how to install and use Reveal plugins like Menu. Does one have to edit themes/reveal-hugo/layouts/_default/baseof.reveal.html to add them to window.revealHugoDependencies, or is there a way to contort them into config.toml as one does for simple config flags like controls_tutorial?

2

Looks like they are using the static folder:

You should be able to manually add plugins to the plugins folder.

Personally, I wouldn’t have done it that way. I’d use the package.json file in the root and install both RevealJS and the plugins using npm which would make them easy to update later. But each to their own.

3

hey @dankegel
have you found a solution to this?
especially how to include something to the reveal.initialize block (wherever that might be) using something conditional
i’m trying to add https://github.com/marcins/revealjs-simple-gallery
any tips?

Edit: calling @dzello here just for the sake of informing the developer about a possible necessary documentation update

1 Like
4

for everybody, who is/was as lost as me, here is a workaround i figured out trial and error over the last hours:

in javascript.html there is:

var options = Object.assign(},
camelize(revealHugoDefaults),
camelize(revealHugoSiteParams),
camelize(revealHugoPageParams));
Reveal.initialize(options);

if you change the variable ‘options’ like so or whatever your plugin configuration might be like:

var options = Object.assign({
    dependencies: [
      { src: 'reveal-js/plugin/gallery/gallery.plugin.js', async: true, condition: function() { return !!document.querySelector('.gallery'); } }
    ]
  },
camelize(revealHugoDefaults),
camelize(revealHugoSiteParams),
camelize(revealHugoPageParams));
Reveal.initialize(options);

it should more or less work.

i don’t know why the .js doesn’t need to be included in the section above that part like all the other plugins but maybe thats a secret i don’t need to know and this is not pretty and i doubt, that its entirely correct but thats what a workaround is all about, isn’t it?

happy coding and despair

5

Hello, plugin author here. Plugins should definitely be easy to add, so I’ve gone ahead and made some functionality and documentation for that. If you can give it a try and let me know it works, that’d be really appreciated.

Here’s a new plugin-example presentation that uses that image gallery plugin. Here’s the source code for that presentation so you can see how the plugin is added.

There’s now a list item in the README for the reveal_hugo.plugins configuration setting as well. Let me know if that makes sense. Thanks!

6

yes! seems to work! thank you very much!

1 Like
7

Good to hear it!