[Discontinued] Advanced Slides - Create markdown-based reveal.js presentations in Obsidian

Hi there! Awesome plugin, I’ve been following its development over the last few months. I have a future request (maybe one and a half) but I wasn’t sure if it was possible to achieve it already.

I’ve created this grid component and I wanted to put 2 images inside it. This is working fine. But I realized that the images are going a little bit outside the boundaries of the grid. Is there a way to auto-resize the images (even add gaps) to guarantee that they stay within the grid boundaries? As you can see I tried to nest the split tag in case this is helping. It only helped orient the images from Top to bottom as I thought it would be better but this is also a bit random. Could we control the direction of the tiling as well maybe by adding an optional extra parameter?


<grid drag="40 67" drop="-2 20" bg="gray">
<split no-margin>
Here you can add text or even images. I nested the split evenly to check if it works and if I can arrange images in a nicer way.
</split>
</grid>

thank you!

I read that autofit text was added to 1.6 - but i haven’t been able to figure out how to implement it and it doesnt seem to have reached the documentation yet.
Can anyone explain how it’s done? Thank you.

1 Like

Hmm … Seems I’m missing something here. Nothing special/animated happens when I try this. Neither in the Obsidian preview pane, nor in the browser view. Does it rely on any special plugin settings maybe?
(Obsidian 0.14.2, Advanced Slides 1.6.0, macOS 12.3)

1 Like

Such an awesome plugin!! Thanks so much for all your work, @MSzturc / Matt!! :star_struck:

I have a quick question. I wanted to include a chart that’s made with the “Obsidian Charts” plugin – so it’s inside a code block – into a slide. This doesn’t work because the Advanced Slides plugin renders the code block (nicely) which is, of course, intended.

Is there a way (besides creating an image out of the charts code block) to include those kinds of charts into slides? :flushed:

Hello everyone :wink:

The last few weeks have been very exciting for me.
I had the opportunity to develop a complete training program in my daily job, based on advanced slides.
In concrete terms, it means that I have created over 400 slides in the last 2 months and have gained a lot of experience in daily use with advanced slides.

The workflow feels good but there’s still a lot to do.

I am currently looking for people who have already created a few presentations with advanced slides and would like to share their experiences with me. I would be interested to know where you have stomach ache and what frustrates you about working with advanced slides

3 Likes

Hi @MSzturc ! Thank you for making Advanced Slides, it’s a big improvement over the built-in slide support. I had the opportunity to use AS to make slides for a few Python training sessions last month, and it was a great experience. I especially love the synchronized scrolling between the text and the preview; it makes editing the presentation so much easier.

Great job, and thank you for sharing your plugin with the Obsidian community!


(…since you asked for stomachaches, I’ll share a couple… :slight_smile: )

  1. Code blocks have some odd behavior with certain characters. For example, the underscores in the following code block don’t render correctly in a preview slide:

    ```python
    >>> len.__doc__
    
    >>> len.\_\_doc\_\_
    ```
    

    image

  2. It would be nice if Advanced Slides supported Excalidraw drawings and Dataview tables. Right now I have to export drawings or tables to images, and then embed the images.

4 Likes

I recently discovered Advanced Slides, very cool tool, love it. I would be curious to know if there is a way to make admonitions i.e. call outs as described here work: Use callouts - Obsidian Help

Can i some how change the vertical separator from 2 dashes to 4 dashes or something else. I can’t find any setting for that.

Hey @MSzturc,

I just did a presentation this morning, it went surprisingly well! One thing I noticed was that I had to copy-paste the template I created for each slide. Not sure what is the best workflow and if there is a way to define a “master” slide somehow and then define what goes where? A problem with this method is that in order to be precise you will have to be as verbose as copy-pasting the template all the time which will defeat the point, but on the other hand you will be able to amend the master slide and have all your slides update at the same time…

Would be great if you share your workflow for those 400 slides!

Thats awesome :wink:

Im missing a templating feature as well, but it’s not that easy to implement since there a multiple use cases ( i have ) that really doesn’t fit a simple workflow. Currently i’ve created an own css for my presentations, but this requires at least basic css understanding.

My workflow is pretty straight forward. My Vision for every bit of information in my vault is that it could stand for it’s own, that means that the core essence of the information has to be extracted. therefore there is a 1:1 relationship between a slide and a note. Everything that doesn’t feel right on a slide will be refactored until it fits. Which means that a slide has only markup description for the layouting and for images that fit to the message the slide should transport. The text is embeded out of a note of my pkm.

Hope that helps

I wonder if you could leverage the “paragraphs” in markdown for putting the right element at each right place? So first paragraph goes to the first “rectangle” of the layout the second on the second etc…

Regarding the css, if that is the only immediate way I would be interested to learn more if you can share a bit more. Not everyone wants to set up this by themselves but maybe in the future, there can be something like excalidraw’s store where people can share their own layouts?

Hi Craig,

this bug should be fixed with 1.7.2

Currently there is an easy way to use excalidraw Images inside advanced slides. I’ve described the workflow here

Wonderful, thanks! I’m looking forward to trying it out.

Hello everyone,

In the last few days I was able to video chat with many of you to find out how you use advanced slides, what you are currently missing and which features you would like to see in a future version.

Most of you are big fans of the grid component. It offers the possibility to layout slides the way you want. At the same time you told me that the learning curve was very steep and that you keep looking at the documentation even after you had used it for a long time. The component is not intuitive enough.

I want to change that with version 2.0. I would like to develop an UI that gives you the possibility to edit slides via drag & drop.

That’s why I want to start a call here. I am looking for a developer with frontend know-how who would like to join the development team and develop this UI together with me. Please send me a private message and we can meet for coffee to talk about everything else.

Thank you for all the support in the past and also for the further support in the future. Advanced Slides would not have been possible without you.

8 Likes

Hi MSzturc - first of all thank you for Advanced Slides - am looking forward to moving my lecture slides to Obsidian over the next few months.

I just wanted to report a problem I am having - “Show Slide Preview” works fine, but when I press the “Open in Browser” button in the preview pane a browser window opens with the correct URL (localhost:PORT) but no content is loaded.

Looking at the Obsidian console I see the following -

Uncaught (in promise) TypeError: Cannot read properties of null (reading 'path')
    at ObsidianUtils.findFile (eval at <anonymous> (app.js:1:1), <anonymous>:72947:58)
    at ImageProcessor.transformImageString (eval at <anonymous> (app.js:1:1), <anonymous>:72356:33)
    at eval (eval at <anonymous> (app.js:1:1), <anonymous>:72343:21)
    at Array.map (<anonymous>)
    at ImageProcessor.process (eval at <anonymous> (app.js:1:1), <anonymous>:72341:33)
    at ObsidianMarkdownPreprocessor.process (eval at <anonymous> (app.js:1:1), <anonymous>:72682:53)
    at RevealRenderer.render (eval at <anonymous> (app.js:1:1), <anonymous>:72762:46)
    at RevealRenderer.renderFile (eval at <anonymous> (app.js:1:1), <anonymous>:72747:33)
    at async eval (eval at <anonymous> (app.js:1:1), <anonymous>:72874:22)

which points at these lines of code (line with error marked)…

  findFile(imagePath) {
    let base = "";
    if (!ImageCollector.getInstance().shouldCollect()) {
      base = "/";
    }
    const activeFile = this.app.workspace.getActiveFile().path; !ERROR HERE!
    const allLinks = this.app.metadataCache.resolvedLinks;
    const fileLinks = allLinks[activeFile];
    for (const key in fileLinks) {
      if (key.contains(imagePath)) {
        return base + key;
      }
    }
    return imagePath;
  }

I am using Obsidian 0.14.5 and Adv.Slides 1.7.2 (manual install) on MacOS 12.3.1

Thanks in advance for any advice you (or anyone else!) might be able offer as to how to resolve this. Cheers!

2 Likes

I have the same issue!!

Here the same on MacOS 12.2. Sometimes it helps to close the tab, close Obsidian and open everyhting again. But I wouldn’t call this a solution. :slight_smile:

=> "Open in Browser" does not work reliable (Browser remains blank) · Issue #65 · MSzturc/obsidian-advanced-slides · GitHub

Same here. The browser view does not work reliably and I cannot print-pdf or export to html either. Running on macOS 12.3.1, obsidian v0.14.5 and advanced slides 1.7.2.

Don’t know if this helps but the issue is reproducible if one tries to print the presentation.

  1. start obsidian and load the presentation
  2. open the presentation view and click open in browser
  3. everything loads up correctly
  4. press print presentation
  5. the console presents an uncaught exception and both the print-pdf tab and the original browser view (localhost:port and localhost:port/?print-pdf) don’t load anymore.

The exception is as reported above.

By the way I am using iCloud synching… meaning my vault is in the “iCloud Drive” folder… not sure if relevant.

I have the same issue on macOS 12.3.1 (21E258) with Chrome Version 100.0.4896.88 (Official Build) (arm64), Obsidian v0.14.5 (latest) Advanced slides 1.7.2 My vault is local.

Presentations are currently not possible, content does not show in the browser.
Creating new slides with text only sometimes works, it does need a few seconds, the slides do not appear immediately in the browser as they used to.
None of the slides that contain a background annotation or contain images work. Local host 3000 hangs and no slide content is shown in the browser. This issue came up 3 days ago.
Advanced slides is such a great application and my favourite plugin. Any input on how to resolve this issue is very welcome.