中学生の学習をサポートするために、Obsidianでいくつかの教科の学習ノートを作成し、Ankiのデッキを生成しました。そのうち、数学ノートには以下の要件があります。
- パソコンで授業を行う際:既定の読書モードでは問題の解答を非表示にし、クリックすると展開して表示すること
- PDFを生成する際には解答内容を含め、印刷して参考にできるようにすること
試行錯誤の末、最終的な操作方法は本文の通りです。
また、作成したノートとAnkiカードを私の別のブログサイトにアップロードしました:美好新人生。もしご家庭の中学生がちょうど八年生であれば、サイトからAnkiデッキファイルをダウンロードし、Ankiにインポートすることで学習に多少役立つかもしれません(少しでも助けになれば幸いです 🤣)。
1. 読書モードでの学習
最初は %% を使って解答部分をコメント化し、読書モードでは非表示にしました。しかし、表示するには実際のプレビューに戻る必要があり、印刷時にはコメント部分がPDFに出力されないため、%% では要件を満たせません。
そこで、Admonitionプラグインを使用し、先頭の %% を ```ad-info に変更。設定オプションの【Default Collapse Type】を close にして解答部分を非表示にし、クリックすると表示されるようにしました。
2. PDFの生成
さらに、以下のCSSスニペットを作成・有効化することで、PDF生成時(print)に非表示のAdmonitionブロックもPDFに出力できるようにしました。
▼ このスニペットはAIが生成
/*
* 目的:Admonitionプラグインの折りたたみ可能ブロックを印刷時に強制展開
* 適用:Obsidianの「PDFに印刷」機能
*/
@media print {
/* Admonitionプラグインが生成したdetails要素を選択 */
.admonition.is-collapsible details:not([open]) {
/* detailsの内容を強制的に表示するため、blockに設定 */
display: block !important;
}
/* details内部のコンテンツも強制表示 */
.admonition.is-collapsible details:not([open]) > .admonition-content,
.admonition.is-collapsible details:not([open]) > div {
display: block !important;
visibility: visible !important;
}
/* Admonition内容ブロックが印刷時に隠れないようにする */
.admonition-content {
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
/* 必要に応じて折りたたみ矢印を印刷時に非表示にする(省略可能)
.admonition.is-collapsible .admonition-title::before {
display: none !important;
}
*/
}
3. 💡 関連リンク
✅ 解説記事(繁体字中国語): https://jdev.tw/blog/9009/
✅ Explanation article (English)
✅ 解説記事(日本語)
✅ 中学生向けAnkiデッキ共有: https://jdev.tw/newlife/?tag=Anki
##