Help needed for creating clickable links

hey guys, I have been trying to link my cards for example i have card A,B,C and B,C are synonyms of A so i added it in synonym field, i want them to clickable, so whenever i click any of them it would open respective card for glimpse.

https://ankiweb.net/shared/info/1423933177
https://ankiweb.net/shared/info/1077002392
https://ankiweb.net/shared/info/1170639320

In a sense, too
https://ankiweb.net/shared/info/1745211643

Thank you for reply, I had already figure it out with the last addon it works fine for me but the thing is I can only utilize it on pc and I am mostly always on ankidroid.

The addon “Anki Note Linker” has instructions on how to make it work on mobile devices.

I checked out the suggested Javascript and it doesn’t seem to be creating clickable links, just removing the nid123456789102 text and keeping the title part.

Here’s Javascript code with a modified renderLinks function that will make the links created by Anki Note Linker clickable on AnkiDroid. This won’t work on AnkiMobile.


<div class="linkRender">
  {{Some note field}}
</div>

<div class="customClassForYourStyling linkRender">
  {{Another note field}}
</div>

<script>
  function renderLinks(_) {
    var api;
    var jsApiContract = {
      version: "0.0.3",
      developer: "your_email_here"
    };
    try {
      api = new AnkiDroidJS(jsApiContract);
    } catch {}

    function openCardBrowserForNoteId(noteId) {
      // If you know the deck the linked notes are in is always the same
      // you could use this instead
      // search = `"deck:Deck name here" nid:${noteId}`;
      search = `nid:${noteId}`;
      try {
        api.ankiSearchCard(search);
      } catch {
        // We're not on AnkiDroid,
        // AnkiMobile's pycmd (probably) doesn't support opening the card browser
      }
    }
    for (const element of document.getElementsByClassName("linkRender")) {
      element.innerHTML = element.innerHTML.replace(
        /\[((?:[^\[]|\\\[)*)\|nid(\d{13})\]/g,
        (match, title, nid) =>
          // Render a clickable span element for the note ID
          `<span class="clickable-link" onclick="openCardBrowserForNoteId('${nid}')">${title}</span>`
      );
    }
  }
  try {
    AnkiNoteLinkerIsActive;
  } catch (err) {
    if (document.readyState !== "loading") renderLinks(null);
    else
      document.addEventListener("DOMContentLoaded", renderLinks, {
        once: true
      });
  }
</script>

This will make a clickable element that opens the card browser for the note id in the link. If the deck is not specified in the search input, AnkiDroid defaults to searching the current deck first which will return nothing if the note isn’t in the current deck. You need to tap “Search in all decks” then. This can be fixed by specifiying the deck in the code but that will of course only work if you know the notes you are linking are always in one specific deck.

For example, in this video I have [Tap me to open kanji note for ćľ±|nid1651931422873] in a field for a vocabulary note.

3 Likes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.