Hey everyone! So basically i am a very lazy person, and i also make a lot of anki cards for economics which involves drawing on them using a market axis. Is there anyway i can permanently embed an image like this into a note type? Thank you!!!
It’s absolutely possible! I have done something similar together with a friend of mine for our Anki Deck about swiss mountains.
The basic idea is to store your picture in Anki2/User 1/media.collection/_yourpicture.fileextension
and then referencing it in your note type as in normal HTML:
<img src=_yourpicture.fileextension>
The underscore at the beginning of the file name is important iirc
Where exactly your Anki2 folder is is platform specific.
Edit: Or did I not quite understand your question correctly. Is it always the same image or differing ones?
3 Likes
Thank you so much!!! I’ll test this out right now thank you!!!
You’re welcome. Let me know if it works.
You might need to add some styling like width=100% and similar to your img tag for Anki to reliably render the picture.
1 Like
Yep that worked perfectly; thank you so much!!!
1 Like
Hey i tried that like you said but it didn´t work. When I learn those cards there is no image just the image icon even though i have stored the image in my media collection. Do you have any idea what I could have done wrong?
thank you
I see two problems here.
Invalid HTML
You forgot the opening quote for the src attribute.
Change
<img src=_testpicture.png">
to
<img src="_testpicture.png">
Wrong reference
In your HTML you reference _testpicture, but your file is called testpicture. Rename it to _testpicture.png to fix your issue.
3 Likes
thank you so much it worked
thank you so much and one last question. Do you know how I can manage it to get the image into the right position because now I got the image and directly after it comes the text but i want it to be on top of the text.
Here you see an example card with an example picture
This should do the trick:
<img src="_testpicture">
<div>{{cloze:Text}}</div>
If you want more space between the elements, you can do so with CSS in the styling section:
div {
margin-top: 1em;
}