Ankiのカードテンプレートを作成する

 

 

 

 

以下リンクの先人方々を参考にコピペとカスタマイズした。

先人の時代よりもAnkiや他アプリが進化・更新されている為、自分のアプリの世代用に修正していく。

なおHTMLとCSSは10年以上前、自作HPが流行った時代に簡単なものを使っていただけなので必要部分だけ復習した。

 

 

リンクボタン

以下の先人の方々のサイトからコピペ。ありがとうございます。

github.com

note.com

 

物書堂が自動で開く

github.com

 

こちらのスクリプトですが、iphoneでは開いて欲しくなかったので

---------------

<a id="auto-click-link" href="mkdictionaries:///WISDOM3?text={{英単語}}"></a>

<script>

function isIOS() {

return /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;

}

if (isIOS()) {

document.getElementById("auto-click-link").click();

}

</script>

-------------

太字のiphoneの部分を削除しました。

(ここ消せばいいってわかるまで一週間かかりました)

 

 

物書堂リンク

上のリンク先のt9mdさんが物書堂アプリとリンクさせる方法も記載してくれていますが、自分の好きな辞書とリンクさせるには以下。

www.monokakido.jp

f:id:yoshiharay:20210921134610p:plain

スキーム

物書堂すごいな。めっちゃリンクさせる気満々。ありがとうございます。

 

WISDOM3、オックスフォード類語辞典とリンクさせたいので

mkdictionaries:///SOEJT?text={{英単語}}

mkdictionaries:///WISDOM3?text={{英単語}}

このURLを使う。

{{英単語}}は仮のフィールド。

 

フィールドごみ対策

設定していないフィールド、例えば{{例文}}というフィールド。今は例文を入れていないかもしれない。その際は{{#例文}}{{例文}}{{/例文}}で消えるとのこと。

以下先人より。

ameblo.jp

 

 

画像の貼り方

画像を以下の方法で生成したら、リンクを生成する。

hobooboegaki.hatenablog.com

f:id:yoshiharay:20210921164511p:plain

画像タグ生成

タグ+画像名+タグ
をエクセルで作っていき、フィールド化する。

 

ナイトモード用に画像を暗くする場合↓

kouhekikyozou.com

音声

以下のawesomeTTSで音声を作る。

hobooboegaki.hatenablog.com

 

CSS(見た目)

saruwakakun.com

saruwakakun.com

saruwakakun.com

 

saruwakakun.com

 

coliss.com

フォント

parashuto.com

行間

saruwakakun.com

 

 

画像トリミング

www.webcreatorbox.com

 

リンク

rilaks.jp

www.ipentec.com