Markdown is a text-to-HTML conversion tool for web writers. Markdown allows you to write using an easy-to-read, easy-to-write plain text format, then convert it to structurally valid HTML.
Sketchfab supports Markdown in model descriptions and Annotations.
Primary Markdown Syntax
These are the features most relevant to Sketchfab models.
Images
Will produce
Optionally, you can add alt text and a title (important for SEO and accessibility), like this:
Links
This is [an example](http://example.com/ "Title") inline link.
[This link](http://example.net/) has no title attribute.
This is [an example][id] reference-style link.
Other stuff goes here...
[id]: http://example.com/ "Optional Title Here"
Will produce an example link.
You can make an image that is a link by combining the link code with the image code. Use the image code instead of text:
[](http://example.com)Will produce
Videos
While you can link to a video hosted elsewhere (as described above), you cannot produce a video within your model's description or Annotations by using Markdown.
If you'd like to build a more customized experience with features like embedded videos, it's possible to do on your own website using the Viewer API.
Emphasis
*single asterisks*
_single underscores_
Will produce italic text
**double asterisks**
__double underscores__
Will produce bold text
Titles
This is an H1
=============
This is an H2
-------------
# This is an H1
## This is an H2
###### This is an H6
Lists
Unordered
* Red
* Green
+ Blue
- Yellow
Will produce
- Red
- Green
- Blue
- Yellow
Ordered
1. First item
2. Second item
1. Third item
(The number before the period has no effect on the actual order, it just needs to be a number)
Will produce
- First item
- Second item
- Third item
Other Markdown Syntax
A lot of other Markdown features are supported, but they may not be very useful in the context of Sketchfab models. See this documentation for details:
It's also supported in Help Center comments, although the implementation may not be identical.
Comments
68 comments
@yshaya - Not at the moment, images will fill with width.
Is there any way to adjust the size of images shown in annotations? As I read through the documentation of Markdown I couldn't find such options, but would be happy to know any tricks.
If you put a backslash (`\`) in front of the hash, it should "escape" it and put a literal hash instead of turning it into a markdown header.
Thanks! It's working on my end:
I don't think it has anything to do with the Markdown from what I can see. This model is quite heavy, over 3 million polygons. I suspect it's just too much for your device/browser, especially a mobile device.
Also, you uploaded a 16k texture, but the maximum we render is 8k (8192 x 8192), so your full resolution texture is never used. You can read more about performance here:
https://help.sketchfab.com/hc/en-us/articles/201766675-Viewer-Performance
By the way, it's against our Terms of Service to hide the Sketchfab logo/watermark/link in your embed like that. The Business account allows you to remove the external link from the logo, and the Enterprise account allows you to remove the logo completely.
https://sketchfab.com/plans
I guess markdown is not working on Collection description? OR am I missing something?
In my annotation, if I wanted to type out #4 Rebar to be Used. How do I get the "#" to show up?
Hello,
I'm afraid that changing the size of images in annotations is not planned.
If you need that level of customization, I would recommend looking into the Viewer API instead. You could hide the "default" annotation tooltips and display whatever content you like on top of the viewer.
https://sketchfab.com/developers/viewer/examples?sample=User%20Annotation
Hi toppan_equator - I'm afraid that Markdown is not supported in annotation titles, only descriptions.
MANiacos - I've done it where the image itself links to a large view in its own tab using the following syntax:
[ ! [ ] (image url) ] (image url)
@bematrix - Yep! Glad you figured it out :)
You can also combine the different markdown items together, for example, an image that is a link:
[](link/to/page)
Nope ;)
I've thought it would be cool to have one click “Zoom out / Zoom in” function for the images shown in annotations.
Not at the moment, but it's something we're thinking about adding.
Hi. Are they still working? I can create them and visualize them in edition but they are not displayed.
Hi @jwillow
Sorry, that's correct. JavaScript is not permitted in our Markdown implementation. It would represent to great a security risk.
Hi, a +1 for controlling the size of the displayed images relative to the viewer. In most of my cases they need to be bigger. Cheers!
Hello,
All links in annotations have the target="_blank" attribute set. That means they will open in a new tab or a new window, but as far as I know, it depends on on your browser settings.
If you want more robust control over the experience. I recommend looking into the Viewer API: https://sketchfab.com/developers/viewer
Here's an example of opening popups on top of the 3D viewer (go through a few steps of the tour, click a furniture item, or click a "Play" object: https://www.sandlerseating.com/neocon
No worries! This is more about Markdown syntax in general, not really something specific to Sketchfab.
You make a link in markdown like this:
And you embed an image like this:
So, you can combine these two things to make an image that is a link. Just insert the image instead of Text:
I have just learned how to get images visable in an annotation.
Then I tried to make it clickable by using the syntax [](https://.../../imagename.jpg). The link to the image is still there but the image in the annotation frame is exchange by a boring thumbnail symbol. How to avoid this result?
@James Google Pixel 2 XL and Samsung Note 9.
Hey James, is it possible through a URL parameter or utilizing Markdown to force a link in an annotation to open in the same tab in the browser?
Is it Possible to add a annotation with an image as the title to a link?
Hi, we're trying to call a functions on the page when the user clicks on an embedded image, like the second notation here: https://sketchfab.com/models/f73caed4328e4af7b5411001ca1a5de5
Normally markdown allows javascript code, like this:
[markdown link](javascript:alert("foo");)
I'm guessing this is not permitted in your markdown? Thanks.
Yep, that's exactly what I was going to recommend.
Hi, I am new to sketchfab and it has been great to work with thus far. I have been able to upload my virtual model to stetchfab and add the simple text annotations easily but what I would like to do is add images, like that shown in the markdown or annotate my model similar to https://labs.sketchfab.com/experiments/annotations-sync/.
I can usually find my way around a computer, and programs, easily but I am not familiar/novice with coding, etc on computers. I acknowledge that the codes have been provided but I don't know how to add them to my sketchfab model. I am trying to work it out, and find where and how I have to add the codes, but I am getting lost and unable to add these so that I can provide annotations with images & diagrams.
I was hoping you could provide a step by step explanation/instruction of how I can achieve either of these forms of annotations. Thanks.
Hey,
I'm afraid it's not possible at the moment. All links in annotation will have target="_blank"
What is the use case for opening in the same tab?
I'm afraid tables are not supported in descriptions or annotations at the moment. What's the use case?
I found the solution by reading Imendelson´s recipe. Thanks!
Is it possible to make a target="_self" instead of blank ?
Sorry I'm not sure I understand the question. You want the image to link somewhere? You want an image in the title of the annotation?
Please sign in to leave a comment.