Extended editor for field (for tables, search&replace, ...) [Official thread]

accept shortcut: this is actually built-in - it’s ctrl+return on win/linux - on mac it might be automatically adjusted to cmd+return

about the font shortcut: it’s not built in. I would also have look up again how to configure tinymce so I can’t help

Thank you ijgnd for the shortcuts!

I have also been thinking of using formatted text, however, I have tried " Custom Styles (font color, background colour, classes)" add on, but it doesn’t work now. I hope to have a simple add on that just enables people to change text sizes easily ( pre-set ones would also be ok)

Split cells option is not working while editing the table. Please look into this matter ASAP.

Tem como criar lista com tecla de atalho? Ajudaria muito na velocidade de produção dos cartões

Could you please add some shortcut keys like excel? Such as merge cells, split cell, cells properties, change font colors and so on. These could help me save a lot of time! Thank you ever so much!

@julian: my addon bundles the package tinymce5 with very few changes. So you could search for tinymce5 shortcuts. my main additions are the cloze shortcuts and ctrl+enter to save and close the window.

@SilverMercury: the developer of anki thinks about Evaluate feasibility of using parts of TinyMCE · Issue #2025 · ankitects/anki · GitHub . I’ll wait with updates for this add-on until this issue is closed. your idea sounds useful. and there’s the general problem of having too little time …

the ankiweb page [removed link] links to a 404 github page [removed link]

Edit table without locking cell widths

Problem description

This addon is unreliable for editing tables: it will sometimes save a hardcoded cell width
This matters more on multi-verb conjugation-table Cloze-hide-all notes where showing the entire text would make the table as wide as the screen, but the deletions can be set to 1em or 1px width, and the table should shrink to just the headers and text of a single cell. Using T5 sometimes expands the table to the width of the screen.

Reproduce:

<table style="border-collapse: collapse;" border="1">
  <tbody>
    <tr>
      <td>a1</td>
      <td>a2</td>
      <td>a3</td>
    </tr>
    <tr>
      <td>b1</td>
      <td>b2</td>
      <td>b3</td>
    </tr>
  </tbody>
</table>
  • Table properties→width is blank
  • click on any border, adjusting it is not necessary. There may be another cause, this is the one I found first.
  • Saving will lock cell widths
<table style="border-collapse: collapse; width: 7.30659%;" border="1">
  <tbody>
    <tr>
      <td style="width: 32.5624%;">a1</td>
      <td style="width: 33.5492%;">a2</td>
      <td style="width: 33.5492%;">a3</td>
    </tr>
    <tr>
      <td style="width: 32.5624%;">b1</td>
      <td style="width: 33.5492%;">b2</td>
      <td style="width: 33.5492%;">b3</td>
    </tr>
  </tbody>
</table>

in order to undo this through T5:

  • click the first icon in the floating toolbar, blank out Table properties→width
  • for every table cell:
    • click the cell
    • click the third toolbar Table→Cell Properties, blank out Width

in order to undo this through a text editor:

  • find/replace width: with wwidth:. There’s always going to be at least two different widths, so searching the whole string won’t work

Use case:

Cloze Hide All note with narrow deletion boxes with spanish conjugations, with the table chopped into multiple notes to stay under the 500 cards per note limit

cloze2_w {width:1em;width:1px!important;}
[removed for post length]
approximation: a 6x6 table with the bottom-right 5x5 cells each filled with:
{{c1::<cloze2_w class="cz-1"></cloze2_w><cloze2 class="cz-1">estoy bailando<br>estoy bebiendo<br>estoy viviendo</cloze2>::bailar<br>beber<br>vivir}}{{c2::<cloze2_w class="cz-2"></cloze2_w><cloze2 class="cz-2">estoy&nbsp;ca<span style="color: #ff0000;">y</span>endo</cloze2>::caer}}{{c3::<cloze2_w class="cz-3"></cloze2_w><cloze2 class="cz-3">estoy&nbsp;d<span style="color: #ff0000;">i</span>ciendo</cloze2>::decir}}{{c4::<cloze2_w class="cz-4"></cloze2_w><cloze2 class="cz-4">estoy&nbsp;<span style="color: #ff0000;">y</span>endo</cloze2>::ir}}{{c5::<cloze2_w class="cz-5"></cloze2_w><cloze2 class="cz-5">estoy&nbsp;o<span style="color: #ff0000;">y</span>endo</cloze2>::oír}}{{c6::<cloze2_w class="cz-6"></cloze2_w><cloze2 class="cz-6">estoy&nbsp;p<span style="color: #ff0000;">u</span>diendo</cloze2>::poder}}{{c7::<cloze2_w class="cz-7"></cloze2_w><cloze2 class="cz-7">estoy&nbsp;tra<span style="color: #ff0000;">y</span>endo</cloze2>::traer}}{{c8::<cloze2_w class="cz-8"></cloze2_w><cloze2 class="cz-8">estoy&nbsp;v<span style="color: #ff0000;">i</span>niendo</cloze2>::venir}}

I deleted the extra left column and put Indicative in the first cell, it had the unintended side effect of making the table as wide as the screen, so here’s this issue

Workaround:

table, td { width: initial; }

Thanks for the report. The add-on could be much better but I’m afraid I can’t help. You probably know more about this stuff. If you find something useful let me know.

You could have a look at the tinymce config options at Documentation | Docs | TinyMCE (maybe Table plugin | Docs | TinyMCE) and then adjust the top of the file “template_tiny5_body.html”

I don’t understand anything about programming, could you create shortcut keys to insert rows and columns before and after the selected area? I pay for this work, how much would it cost??

Thanks for offering to pay. I’m really busy at the moment. So I can’t look into it before February or March.

Maybe hire the anki contributor abdo from https://www.fiverr.com/abd_nh .

He should get you your code quickly so that you can install it without me updating the add-on. As long as his code doesn’t modify the bundled tinymce itself I’d merge his changes to my add-on version next year.

I’m mentioning abdo because I recently added some code made by him to another add-on of mine (pdf viewer). He was paid for his contribution by a third party.

Hi @ijgnd

I can’t find the add-on on your GitHub so here is a diff of the modification to add the table shortcuts:

diff --git a/template_tiny5_body.html b/template_tiny5_body.html
index 4a0eed9..06bdbc5 100644
--- a/template_tiny5_body.html
+++ b/template_tiny5_body.html
@@ -133,7 +133,7 @@ setup: function(editor) {
     editor.addShortcut("Ctrl+E", "Special character", function() {editor.execCommand("mceShowCharmap");});
     editor.addShortcut("Alt+39", "Insert → (Alt+ArrowRight)", function () {editor.execCommand("mceInsertContent", 0, "→");});
     editor.addShortcut("Shift+Alt+39", "Insert ⇒ (Shift+Alt+ArrowRight)", function () {editor.execCommand("mceInsertContent", 0, "⇒");});
-    editor.addShortcut("Ctrl+Alt+39", "Insert ↔ (Ctrl+Alt+ArrowRight)", function () {editor.execCommand("mceInsertContent", 0, "↔");});
+    editor.addShortcut("Ctrl+Shift+39", "Insert ↔ (Ctrl+Shift+ArrowRight)", function () {editor.execCommand("mceInsertContent", 0, "↔");});
     editor.addShortcut("Ctrl+Shift+Alt+39", "Insert ⇔ (Ctrl+Shift+Alt+ArrowRight)", function () {editor.execCommand("mceInsertContent", 0, "⇔");});
     editor.addShortcut("Alt+37", "Insert ← (Alt+ArrowLeft)", function () {editor.execCommand("mceInsertContent", 0, "←");});
     editor.addShortcut("Shift+Alt+37", "Insert ⇐ (Shift+Alt+ArrowLeft)", function () {editor.execCommand("mceInsertContent", 0, "⇐");});
@@ -148,6 +148,12 @@ setup: function(editor) {
     editor.addShortcut("Ctrl+Alt+U", "Upper case (Ctrl+Alt+U)", function () {editor.execCommand("mceInsertRawHTML", 0, editor.selection.getContent({ format: "html" }).toUpperCase());});
     editor.addShortcut("Ctrl+Alt+L", "Lower case (Ctrl+Alt+L)", function () {editor.execCommand("mceInsertRawHTML", 0, editor.selection.getContent({ format: "html" }).toLowerCase());});
 
+    /* Table shortcuts */
+    editor.addShortcut("Ctrl+Alt+32", "Insert table (Ctrl+Alt+Space)", function () {editor.execCommand("mceInsertTable", false, { rows: 1, columns: 1 })});
+    editor.addShortcut("Ctrl+Alt+37", "Insert column before (Ctrl+Alt+ArrowLeft)", function () {editor.execCommand("mceTableInsertColBefore")});
+    editor.addShortcut("Ctrl+Alt+38", "Insert row before (Ctrl+Alt+ArrowUp)", function () {editor.execCommand("mceTableInsertRowBefore")});
+    editor.addShortcut("Ctrl+Alt+39", "Insert column after (Ctrl+Alt+ArrowRight)", function () {editor.execCommand("mceTableInsertColAfter")});
+    editor.addShortcut("Ctrl+Alt+40", "Insert row after (Ctrl+Alt+ArrowDown)", function () {editor.execCommand("mceTableInsertRowAfter")});
 
 /*
     var myexQ;

Note that I changed the shortcut to insert the ↔ symbol because it conflicts with the shortcut @julian wanted for “Insert column after”. I think the table shortcuts will be used more often, so it’s worth giving them a bit more convenient shortcuts.

By the way, let me know if you have a Patreon/ko-fi/etc account. You’re providing great value to the Anki ecosystem with your add-ons.

thanks I’ll look at this in february.

Thanks for a great add-on!
I’m Japanese. Sorry if I haven’t made myself understood in English. I’m poor at English.

How can I use there 2 functions?

Inserting a table using this gridded tool.
スクリーンショット 2023-01-08 152830

Editing width or height by drag-and-drop.

Do I possible to enable these features?

After installing the add-on and restarting anki: you must click the button “T5” in the button bar on top of the fields in the editor. Then an additional window with the content of the current field will show. only in this window you have the additional features.

Thank you for your answering.
Yes, I tried the process but I can’t see gridded tool.

And cannot edit width or height by drag-and-drop.
(I can edit only by inputting value on property fields)

that’s strange. can you give some details about your system? If I can’t reproduce the problem it’s very difficult to fix.

Thank you for your answering.

Anki
version ⁨2.1.56 (07fd88dd)⁩
Python 3.9.15 Qt 6.4.0 PyQt 6.4.0

PC
surface pro 8.0
windows 11 home 64bit

Are there enough information?
Please tell me if you can fix or not.
This is not urgent, so you can do it when you have time.

Thank you.

Hi there,
when I try to reinstall the extension in my new anki version, I get an error message “Error during download: Invalid code or the extension is not available for your version of anki”.
My version is 2.1.15 (442df9d6). All my other extensions work fine. Is this an already known error?

It’s probably because your version is not supported. The minimum version listed in the add-on page is 2.1.22

3 Likes