Is there a way of adding images or image links into Drafts 5?
Niall
3 Likes
Yes, via Markdown:
or via a Direct Dropbox Link.
Hereās an example using Markdown
Some text
Some more text
When you use a preview action (the default preview action included in Drafts), it should pull in the image.
But Drafts is for plain text so you wonāt get any āwhat you see is what you getā inclusion of images in the editor itself.
6 Likes
You are explaining how to add text as a reference to an image via Markdown Frank. I think thatās not the same as showing a photo. I would like to use Drafts to make text + image annotations so I would like to see text + photos. If this happens I will sign up immediately because I really like the speed and the ability to share content, itās great!
3 Likes
Yes, this would be fantastic.
Drafts would start to be a real content engine!
1 Like
I have to disagree. Drafts is already a real content engine and one of its great features is not including images, which would introduce bloat. Drafts is a phenomenal text editor and fast because it focuses on text. I hope it remains a text editor focused on text like the macOS apps Sublime Text, VS Code, etc. None of them work with images, but they can reference images for outputting with other tools keeping them lean and mean.
10 Likes
The problem with images is they have file names. Which isnāt something native to Drafts.
But then weāve just crossed that bridge with the new double square brackets syntax. In a sense whatās in the brackets is close to a file name.
I think Iād do all my writing in Drafts if it had image support. And I think Iād use more images in my writing, too.
4 Likes
I second that, strongly! What Iām writing requires lots of small diagrams. I currently write bits in Drafts, but then add diagrams and formats in something like Pages.
4 Likes
I think this is the issue all great apps suffer from. We fall in love with an app, its features, and its user experienceā¦ then we visit it so often we start wishing it becomes one app to rule them all. Iāll hope Drafts focuses solely on text, and Iāll use other services focused on images.
I am hoping Apple would provide UUID style links of some sort to each asset in our Photos app (or Files app) because its library is awesome, and it handles photos better than most apps with its structure and metadata. Having my only copy of images and photos organized in the Photos app then linking to them in Drafts would avoid me file managing photos and images in multiple places.
4 Likes
I donāt mind what the Drafts support for images would be - so long as the friction in writing with images is reduced.
And maybe itās my practice that needs to change, not Drafts itself.
But right now my graphics arenāt in Photos. They would be in Dropbox.
Happy to have suggestions on image handling that helps where the text references them from Drafts.
Do folks here feel like the way Ulysses handles images created too much bloat? How about iA Writer?
I like iA Writerās method. Itās clean and creative without being a database app.
I like apps with a database or library for searching and organization, like Drafts, but Iām picky how the data is exported. If I choose to invest in a database app, one of the trials for me is it has to pass my needs with exporting, or I wonāt use it. I like to prepare in case the app will not be around forever and this is one reason Iāve switched to plain text workflows in recent years. Drafts exports are phenomenial with a nice CSV structure and metadata. After using Bear, Ulysses, and iA Writer, I like iA Writerās clean interface and implentation of images with /(insert filename) and how the files are available without exporting.
1 Like
Iām using Dropbox too for miscellaenous files, so Iāll create links to folders or files. A bit cumbersome at times. I also dabbled with a link workflow using DevonThink Pro 3. I canāt really find or settle on a seamless solution, but I like Dropbox being free from a database for futureproofing. Iām looking forward to seeing how Appleās Files or Photos evolves.
The last blog post I wrote I uploaded the graphic to my Wordpress blog and then proceeded to point to it from my Markdown. (This is not ideal but I donāt suppose anyone would stumble across the graphic before the blog post was published.)
(2022: Fixed typo)
I would love to use either Ulysses or Drafts exclusively. Ulysses support of embedded images is fantastic for my needs with reports. Drafts allows tables. I remain torn.
2 Likes
I assume data: URIās donāt appeal.
Iām solving my image needs in Drafts by inserting a link pointing to the image in Dropbox.
BTW: This is MultiMarkdown and Iām normally rendering with āMarked 2ā and/or DevonThink
E.g.
This is the simplest example of an  embedded in a paragraph.
----
This is an image example with a title attribute ![Alternate Message](https://www.dropbox.com/s/xxxxxxxxxxx/Screenshot.png?dl=1"This is a title") embedded in a paragraph.
-----
This is the same image ![image3][] but with the attributes placed later on in the document.
[image3]: https://www.dropbox.com/s/xxxxxxxxxxx/Screenshot.png?dl=1 "This is where the title goes" height=22px width=60px
----
When an image is placed in a paragraph by itself, it is wrapped in a <figure> tag.
![This is the figure caption][fig_id]
[fig_id]: https://www.dropbox.com/s/xxxxxxxxxxx/Screenshot.png?dl=1 "This is where the title goes" height=45px width=120px
Iām mostly using the height/width attributes to ensure the layout
Steps:
- āCopy Dropbox Linkā from Finder (mouse right-click)
- paste to Drafts and change dl=0 to dl=1 (!Important)
The paste to Drafts can easily be handled by e.g. TextExpander
For me, this workflow brings extra benefits.
- The images can easily be edited. Embedding the images in Ulysses/Bear makes it very complicated to make changes to the images.
- I use the same workflow on Mac, iPad, iPhone (and Win with another markdown editor)
/jens
5 Likes
This is my workflow as well. I generally create an āAssetsā folder for each project and put the images there, and link them as Multimarkdown image links.
I am very much in the āsmall powerful tools, loosely joinedā camp, and having Drafts being able to be part of a fast and flexible Markdown workflow is a big part of its value for me. Iād be concerned if it added a database for images (or any other asset) outside the file system - that way lies madness, despair, and Evernote.
EDIT: I note that beta 24 has added support for relative paths for assets, including sub folders, which will make this approach more independent of your actual file system - youāll be able to move the ā¦project/assets folder to your final production location, version control repository etc. There are probably some clever things that can be done using external Locations in Files - have to give this some thought. (I use the excellent Working Copy app to make my GitLab version control system show up in the Files app for example.)
It would be great if the default directory for preview assets could be a setting.
Note that in Drafts 24 (released today), the Mac version has support for locally hosting images in a Previews folder for previewing purposes. It also wonāt work with Marked2, but including a pre-processor script could address that shortcoming.
The Previews folder utilisation doesnāt look to be available on iPhone/iPad (yet?), but the exploded Markdown preview approach does still allow you to host locally on any of the platforms (excluding Apple Watch of course).
Edit: I was mistaken, the new Previews folder support is cross platform.
1 Like
It should be. Or what am I missing?
I tested it with Java Script and CSS and it worked.
Maybe I am missing the point what is really missing.
I am planning on a Example Action Group for that new feature.
1 Like