Как изменить настройки слайда show.js в ноутбуке ipython/jupyter

Я пишу слайды reveal.js с помощью ноутбука jupyter/iPython. Я бы хотел изменить некоторые настройки по умолчанию, это простой способ. Вещи, которые я уже успел (в случае, если это кому-то помогает)

1. Измените тему

Измените тему, добавив исходную ячейку, содержащую

<link rel="stylesheet" href="reveal.js/css/theme/sky.css" id="theme">

2. Изменение конфигурации reveal.js

Проблема с nbconvert заключается в том, что он загружает reveal.js после синтаксиса ячейки, поэтому просто добавление <script>Reveal.configure(...)</script> таким же образом не работает (Reveal все еще будет неизвестно). Решение состоит в том, чтобы убедиться, что код выполняется после загрузки документа:

<script type="text/javascript">

$(document).ready(function(){

    Reveal.configure({
        transition: 'convex' // none/fade/slide/convex/concave/zoom
    })
});    
</script>

3. Изменение других вещей

Здесь я терпит неудачу:

Как установить поведение фрагментов или фона определенного слайда?

Ответ 1

Возможно, это немного поздно:

Хотя некоторые из них не работают, но я нашел еще одну запись из одного и того же блога: Настройка слайдов IPython, может быть, что вы просите.

custom.css все еще работает для меня (с Jupyter 4 и Revealjs 3.0.0). просто поместите файл custom.css в тот же каталог, где находится ваш .html.

для изменения шрифта (помните ".reveal" ):

.reveal p {
font-family: 'Raleway', sans-serif;
color: #2d28cc;
}

чтобы добавить фон (но цвета фона из темы исчезнут, возможно, потребуется больше css-настройки):

body {
  background: url(logo.png)
  no-repeat
  left center;
padding: 5px 0 5px 25px;
}

чтобы добавить вещи к определенным слайдам, я бы использовал пользовательский div, например:

div.footer {
font-size:14pt;
font-style: italic;
color: #4aaeee;
text-align: center
}

затем добавьте это в ячейку jupyter:

<div id="footer">...</div>

надеюсь, что это поможет ~

Ответ 2

Вы можете изменить общую тему или переходы в соответствии с этим сообщением в блоге: http://www.damian.oquanta.info/posts/change-the-ipython-slides-defaults-with-an-ipython-config-file.html

Основная идея - создать конфигурационный файл slides_config.py где-нибудь (т.е. в той же папке, что и ваши слайды):

c = get_config()
c.Exporter.template_file = 'default_transition'

Затем вы создаете еще один файл шаблона default_transition.tpl:

{%- extends 'slides_reveal.tpl' -%}


{% block body %}

{{ super() }}

<script>

Reveal.initialize({

    // Display controls in the bottom right corner
    //controls: true,

    // Display a presentation progress bar
    //progress: true,

    // Push each slide change to the browser history
    //history: false,

    // Enable keyboard shortcuts for navigation
    //keyboard: true,

    // Enable touch events for navigation
    //touch: true,

    // Enable the slide overview mode
    //overview: true,

    // Vertical centering of slides
    //center: true,

    // Loop the presentation
    //loop: false,

    // Change the presentation direction to be RTL
    //rtl: false,

    // Number of milliseconds between automatically proceeding to the
    // next slide, disabled when set to 0, this value can be overwritten
    // by using a data-autoslide attribute on your slides
    //autoSlide: 0,

    // Enable slide navigation via mouse wheel
    //mouseWheel: false,

    // Transition style
    transition: 'concave', // default/cube/page/concave/zoom/linear/fade/none

    // Transition speed
    //transitionSpeed: 'default', // default/fast/slow

    // Transition style for full page backgrounds
    //backgroundTransition: 'default', // default/linear/none

    // Theme
    theme: 'sky' // available themes are in /css/theme

});

</script>

{% endblock body %}

Кроме того, если вы хотите изменить некоторые детали CSS, вы можете создать собственный CSS файл custom.css и добавить туда нужный контент.

Пользовательский файл CSS загружается автоматически.