Heading References In Preview

1

I tried the following in a draft:

<a href="#test-heading-with-spaces-in">
<img src="http://www.google.com.au/images/nav_logo7.png">
</a>

...
### Test Heading With Spaces In

where there was enough other material between the </a> and the ### lines for jumping to the heading to be shown to work (or not).

I tried this Markdown/HTML in Drafts and also generated as HTML in Sublime Text.

In Drafts Preview on Mac If I click on the image I don’t get taken to the heading. If I throw the Sublime-Text-Generated HTML into a browser clicking on the image takes me to the heading.

Should I expect this to work in Drafts?

If I use the Markdown image format ![](http://www.google.com.au/images/nav_logo7.png) in the <a> bracket it gets rendered as a literal string and not treated as an image reference. This would, of course, be simpler for users to use than the <img> HTML element.

(I’m experimenting with this as a candidate protocol for clickable pictures in Powerpoint via md2pptx. I’m going to have enough trouble generating the href attributes, by the way.)

2

Using MultiMarkdown? It strips the spaces generating labels.

You can always use the “Copy HTML” option in a preview to get the generated HTML and take a look at what’s going on for reference. If I put that text in, the heading is generated as:

<h3 id="testheadingwithspacesin">Test Heading With Spaces In</h3>

(Also make sure you have “No Labels” turned off in Markdown settings). Also the cross-ref section of the MultiMarkdown guide might be useful. You can, for example, do # Heading [preferred-id] to force a specific label.

2 Likes
3

Thank you! I thought I’d tried that - but I’ll try again more carefully. :slight_smile:

This does, I think, illustrate the fragility of heading references in HTML/Markdown - as some renderers do indeed put in dashes in the referenced heading’s ID.

A routine that reliably generates references from strings of text would be handy. In my case Python but, more relevantly, here Javascript.

(My use case is in fact to generate references to slide titles. I’m going to have to write such a routine and I should probably allow a metadata switch to generate “squashed” or “with dashes”.)

4

Thinking some more, I think I can teach md2pptx two things - which I would think work in Drafts as well:

  1. Use [My Target Slide][] to create a hyperlink to the slide with title “My Target Slide”. Though I really want alternate words on the hyperlink such as “here”.
  2. Use ### Slide Title [my-slide-id] on the target slide - to mark its title.

One of the key aims is to keep md2pptx input syntax as close to MultiMarkdown as possible. I think this does that, particularly Option 2.

(Paging @Andreas_Haberle - who I’m sure is listening.)

1 Like