Presentations can add their own HTML to the layout
This will be the recommended way to add custom CSS and JS on a per-presentation basis. Global layout extensions remain the same.
This commit is contained in:
parent
1f99371394
commit
216135e004
3 changed files with 41 additions and 7 deletions
9
exampleSite/layouts/partials/home/reveal-hugo/body.html
Normal file
9
exampleSite/layouts/partials/home/reveal-hugo/body.html
Normal file
|
@ -0,0 +1,9 @@
|
|||
<!-- This partial is included before the end of the body tag for only the 'example' presentation -->
|
||||
<!-- A common use would be to add JavaScript to the page to customize interactions -->
|
||||
<!-- The Reveal.js JavaScript API is located at https://github.com/hakimel/reveal.js/#api -->
|
||||
<script type="text/javascript">
|
||||
// Log the current slide to the console when it changes
|
||||
Reveal.addEventListener('slidechanged', function(event) {
|
||||
console.log("🎞️ Slide is now " + event.indexh);
|
||||
});
|
||||
</script>
|
18
exampleSite/layouts/partials/home/reveal-hugo/head.html
Normal file
18
exampleSite/layouts/partials/home/reveal-hugo/head.html
Normal file
|
@ -0,0 +1,18 @@
|
|||
<!-- This partial is included before the end of the head tag for only the 'example' presentation -->
|
||||
<!-- A common use would be to add CSS to the page to customize the theme -->
|
||||
<style>
|
||||
/* Add padding, margin and a hover effect on code samples */
|
||||
.reveal section pre {
|
||||
box-shadow: none;
|
||||
margin-top: 25px;
|
||||
margin-bottom: 25px;
|
||||
border: 1px solid lightgrey;
|
||||
}
|
||||
.reveal section pre:hover {
|
||||
border: 1px solid grey;
|
||||
transition: border 0.3s ease;
|
||||
}
|
||||
.reveal section pre > code {
|
||||
padding: 10px;
|
||||
}
|
||||
</style>
|
|
@ -30,17 +30,19 @@
|
|||
link.href = window.location.search.match( /print-pdf/gi ) ? '{{ $reveal_cdn}}/css/print/pdf.css' : '{{ $reveal_cdn }}/css/print/paper.css';
|
||||
document.getElementsByTagName( 'head' )[0].appendChild( link );
|
||||
</script>
|
||||
<!-- To insert markup before the closing head tag, create layouts/partials/reveal-hugo/head.html -->
|
||||
<!-- To insert markup before the closing head tag for all presentations,
|
||||
create layouts/partials/reveal-hugo/head.html -->
|
||||
{{- partial "reveal-hugo/head" . -}}
|
||||
<!-- To insert markup at the end of the head tag for a specific presentation,
|
||||
create layouts/partials/{section}/reveal-hugo/head.html -->
|
||||
{{- $sectionHeadPartial := printf "%s/reveal-hugo/head" (.Page.Section | default "home") -}}
|
||||
{{- if fileExists (printf "layouts/partials/%s.html" $sectionHeadPartial) -}}{{ partial $sectionHeadPartial . }}{{- end }}
|
||||
</head>
|
||||
<body>
|
||||
{{- block "main" . -}}{{- end -}}
|
||||
<script type="application/json" id="reveal-hugo-site-params">{{ jsonify .Site.Params.reveal_hugo | safeJS }}</script>
|
||||
<script type="application/json" id="reveal-hugo-page-params">{{ jsonify .Page.Params.reveal_hugo | safeJS }}</script>
|
||||
<script type="text/javascript">
|
||||
window.revealHugoDependencies = {
|
||||
dependencies: [
|
||||
{ src: '{{ $reveal_cdn }}/lib/js/classList.js', condition: function() { return !document.body.classList; } },
|
||||
<script type="text/javascript"> window.revealHugoDependencies = { dependencies: [ { src: '{{ $reveal_cdn }}/lib/js/classList.js', condition: function() { return !document.body.classList; } },
|
||||
{ src: '{{ $reveal_cdn }}/plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
||||
{ src: '{{ $reveal_cdn }}/plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
||||
{ src: '{{ $reveal_cdn }}/plugin/highlight/highlight.js', async: true, callback: function() { hljs.initHighlightingOnLoad(); } },
|
||||
|
@ -78,7 +80,12 @@
|
|||
revealHugoDependencies);
|
||||
Reveal.initialize(options);
|
||||
</script>
|
||||
<!-- To insert markup before the closing body tag, create layouts/partials/reveal-hugo/body.html -->
|
||||
{{ partial "reveal-hugo/body" . }}
|
||||
<!-- To insert markup before the closing body tag for all presentations,
|
||||
create layouts/partials/reveal-hugo/body.html -->
|
||||
{{- partial "reveal-hugo/body" . }}
|
||||
<!-- To insert markup at the end of the head tag for a specific presentation,
|
||||
create layouts/partials/{section}/reveal-hugo/body.html -->
|
||||
{{- $sectionBodyPartial := printf "%s/reveal-hugo/body" (.Page.Section | default "home") -}}
|
||||
{{- if fileExists (printf "layouts/partials/%s.html" $sectionBodyPartial) -}}{{ partial $sectionBodyPartial . }}{{- end }}
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in a new issue