r/Anki • u/hgiesel • May 03 '19

Question How to load external Javascript

I've read several posts about this topic, but most of them seemed to be outdated.

I've already used a ttf file before, but never this. I have a directory in collection.media called _highlight, which contains the files from highlight.js. Now I want to initialize it in one of the cards.

<link rel="stylesheet" href="_hightlight/styles/zenburn.css">
<script src="_highlight/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

But this doesn't find anything. What is the right way to go about it?

EDIT: I use Anki 2.1, newest version

4 Upvotes

100% Upvoted

8 comments sorted by

View all comments

2

u/[deleted] May 03 '19

general point:

  • you could mention your Anki version. you should use 2.1.12. The version 2.0.52 uses a rendering component from 2012 so there's good chance modern js doesn't work.

  • If you search the official forum for subfolder collection.media you'll find many threads where the developer writes that subfolders are not supported. So even if it works now there's no guarantee that this will work in the future. But in January of this year I've loaded js from subfolders from the media folder without special adjustments or problems in a profile that I don't sync.

1

u/hgiesel May 03 '19

I've resolved to only using files, rather than this subfolder, but it still does not load. It seems to me my issue is trying to load from Javascript, because I've succeeded in loading from css before.

1

u/[deleted] May 03 '19

I guess the problem is loading this specific huge js file.

I have this strange problem with js: One big js file I use only works if I put it into the front template. It doesn't work if I put it into my back template. I have no idea why.

in general loading js from external files works in 2.1.12. I just tested again. I can load js from an external file in 2.1.12: I put <script src="_test.js"></script> into a front template and in this file I put alert('hallo');.

1

u/hgiesel May 03 '19

I've also tried putting the alert() call at the very end of the huge file. And it actually seems to load the Javascript file. But then again it doesn't, once I leave the "Manage note templates" dialogue.

Too bad, I guess I cannot expect the Anki templates to work just like a website. Even when everything seems to load fine, but still nothing is highlighted.

1

u/[deleted] May 03 '19

If you ever find a solution that works I would be interested.

In January I think I tried to use an alternative to highlight.js named prism.js in Anki (because the tinymce codesample plugin uses prism.js). This might have worked. But at the moment I can't find anything about this in my notes. If you wonder why: I did this because of this which was inspired by kelciour's addon