Does this command pay attention to the active display mode? Would it be a more coherent experience if it output the template based on the active display?
You raise an interesting point. In fact, the sample display template does not reflect the active display mode. I can see that it would be nice if it did, but the intent of the sample display template is just to give the user a starting point. Replicating the display mode (which has become pretty complex over the years) would be just too hard to build and maintain using a parallel construction technique. The display mode you see within the app is just built using Swift. It doesn’t use the Notenik Merge Template “language” at all.
That being said, it might be possible to at least supply a more tailored Merge Template as part of a Starter Pack.
Let me work on this a bit and see what I can come up with.
Thanks for the question!
Well, I did just work on this a bit and… it gets pretty complicated pretty quickly, considering different layouts for title slides, plus the variations in image layout.
Is there some effect in particular you’re trying to modify? Just wondering if there’s another way to get what you’re looking for.
I wanted to modify the template for a presentation. I’m presenting at a conference in May. We have been issued templates for Keynote, which is essentially a footer with the company logo and the conference date. So not especially difficult to replicate.
I have output the sample template previously so I should have known that it was a pro-forma document. However, I thought that as Notenik was presenting me a webpage that looked “just so” it must have a process that says something like, “merge the current page with template X”. I had hoped that it would be simple to say, “instead of merging content, output the display instructions with template X”.
This may be a good opportunity to introduce a “hack” in Notenik that makes it easy to view the source code of the active Display mode in Notenik for comparing with your own styling/templating.
Activate “Enable Local Image References” in your Collection Settings (Command-;).
This should generate a temp_display.html file in the collection directory that replicates the active Display mode. It shows the most recently displayed note according to the selected Display mode.
You can then use a text editor or your browser’s web inspector to look through the source to get a feel for where your desired changes would go according to the default layout that corresponds to the Display mode.
If I’m understanding the objective correctly then this should help. It’s something I frequently rely on for my own customizations.
2 Likes
If I’m understanding you correctly, there’s already such a hack. You just use the Note → Share w/Options action to bring up the Share window. You then select a content setting of “Entire Note,” and then a Format setting of “HTML Document.” If you choose a Destination of “Copy to Clipboard,” then you can switch to a text editor and perform a paste to see all of the generated HTML and CSS. Or you can select “Open in Browser” to open the generated page in your web browser, and can then inspect source (and use other dev tools) from there.
Does this help?
1 Like
@ThePrinter . My presentation is using images, so temp_display.html was present and marked up with the current note layout.
I ran a diff on the output of temp_display.html with the output of Share w/Options suggested by @hbowie and they are mostly identical. So two ways to skin the cat.
The Share w/Options didn’t include the HTML code for the images.
thanks.
@hbowie. I can see why your first response wasn’t “Yes - Notenik does that.” The page content is dynamic, however, my template should be able to handle that within the loop. Is there a complicating factor that I should be aware of?
1 Like
Hopefully it will not be so much of a problem for a single user trying to customize the display for a single use case. The issue I ran into was in trying to completely generalize it. So no, I can’t think of a complicating factor that you’re not aware of. If you run into any, then please let me know!
Happy to know that it was useful.
Another additional benefit I found to having Enable Local Image References activated: Javascript/CSS in your add-ins folder will run in Display mode. I don’t know why. But I appreciate it. And would only recommend it for minor alterations (e.g., auto-expanding and styling the Backlinks summary element).
Edit: This technique isn’t always necessary to run add-in Javascript and CSS in Display mode. Of course you could explicitly refer to either sort of code in a custom Display template (e.g., display.html). My experience with this technique is when using only a display.css file to style displays.
2 Likes