index.html 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. <!DOCTYPE html>
  2. <!--[if IE 8]><html class="no-js lt-ie9" lang="en" > <![endif]-->
  3. <!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
  4. <head>
  5. <meta charset="utf-8">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8. <link rel="shortcut icon" href="../img/favicon.ico">
  9. <title>Champs éditables «partie 1» - Les Tutoriels du Yojik</title>
  10. <link rel="stylesheet" href="../css/theme.css" />
  11. <link rel="stylesheet" href="../css/theme_extra.css" />
  12. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/github.min.css" />
  13. <script>
  14. // Current page data
  15. var mkdocs_page_name = "Champs \u00e9ditables \u00abpartie 1\u00bb";
  16. var mkdocs_page_input_path = "Champs-\u00e9ditables-1.md";
  17. var mkdocs_page_url = null;
  18. </script>
  19. <script src="../js/jquery-2.1.1.min.js" defer></script>
  20. <script src="../js/modernizr-2.8.3.min.js" defer></script>
  21. <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
  22. <script>hljs.initHighlightingOnLoad();</script>
  23. </head>
  24. <body class="wy-body-for-nav" role="document">
  25. <div class="wy-grid-for-nav">
  26. <nav data-toggle="wy-nav-shift" class="wy-nav-side stickynav">
  27. <div class="wy-side-scroll">
  28. <div class="wy-side-nav-search">
  29. <a href=".." class="icon icon-home"> Les Tutoriels du Yojik</a>
  30. <div role="search">
  31. <form id ="rtd-search-form" class="wy-form" action="../search.html" method="get">
  32. <input type="text" name="q" placeholder="Search docs" title="Type search term here" />
  33. </form>
  34. </div>
  35. </div>
  36. <div class="wy-menu wy-menu-vertical" data-spy="affix" role="navigation" aria-label="main navigation">
  37. <p class="caption"><span class="caption-text">Tutoriel Anki</span></p>
  38. <ul class="current">
  39. <li class="toctree-l1"><a class="reference internal" href="..">Introduction</a>
  40. </li>
  41. <li class="toctree-l1"><a class="reference internal" href="../Installation/">Installation</a>
  42. </li>
  43. <li class="toctree-l1"><a class="reference internal" href="../Les-fiches/">Les fiches</a>
  44. </li>
  45. <li class="toctree-l1"><a class="reference internal" href="../Premi%C3%A8re-utilisation/">Premières utilisations et impressions</a>
  46. </li>
  47. <li class="toctree-l1"><a class="reference internal" href="../Personnalisation/">Personnalisation</a>
  48. </li>
  49. <li class="toctree-l1"><a class="reference internal" href="../Cartes/">Les cartes</a>
  50. </li>
  51. <li class="toctree-l1"><a class="reference internal" href="../Compl%C3%A9tion/">Complétion</a>
  52. </li>
  53. <li class="toctree-l1"><a class="reference internal" href="../Nouvelle-approche/">Nouvelle approche</a>
  54. </li>
  55. <li class="toctree-l1 current"><a class="reference internal current" href="./">Champs éditables «partie 1»</a>
  56. <ul class="current">
  57. <li class="toctree-l2"><a class="reference internal" href="#les-champs">Les champs</a>
  58. </li>
  59. </ul>
  60. </li>
  61. <li class="toctree-l1"><a class="reference internal" href="../Champs-%C3%A9ditables-2/">Champs éditables «partie 2»</a>
  62. </li>
  63. </ul>
  64. </div>
  65. </div>
  66. </nav>
  67. <section data-toggle="wy-nav-shift" class="wy-nav-content-wrap">
  68. <nav class="wy-nav-top" role="navigation" aria-label="top navigation">
  69. <i data-toggle="wy-nav-top" class="fa fa-bars"></i>
  70. <a href="..">Les Tutoriels du Yojik</a>
  71. </nav>
  72. <div class="wy-nav-content">
  73. <div class="rst-content">
  74. <div role="navigation" aria-label="breadcrumbs navigation">
  75. <ul class="wy-breadcrumbs">
  76. <li><a href="..">Docs</a> &raquo;</li>
  77. <li>Tutoriel Anki &raquo;</li>
  78. <li>Champs éditables «partie 1»</li>
  79. <li class="wy-breadcrumbs-aside">
  80. </li>
  81. </ul>
  82. <hr/>
  83. </div>
  84. <div role="main">
  85. <div class="section">
  86. <h1 id="champs-editables-partie-1">Champs éditables «partie 1»</h1>
  87. <p>Il est possible d'étendre les possibilités de Anki en utilisant les champs éditables.</p>
  88. <p>Le scénario est le suivant : </p>
  89. <ol>
  90. <li>vous entendez un mot et vous devez le taper au clavier dans le chmap correspondant. Un contrôle est fait et le résultat est affiché.</li>
  91. <li>les textes à trous : une phrase vous est proposée avec un «indice» et un «trou» que vous devez remplir. De la même façon que précédemment, un contrôle est effectué et le résultat est affiché avec les erreurs s'il y en a.</li>
  92. </ol>
  93. <p>Dans cette première partie, nous verrons comment implémenter la simple saisie d'un mot dans Anki.</p>
  94. <h2 id="les-champs">Les champs</h2>
  95. <p>Nous allons utiliser un fichier de vocabulaire de quelques mots pour illustrer le principe.</p>
  96. <p>Voilà le fichier en question; n'oubliez pas que les champs sont séparés par des tabulations.</p>
  97. <pre><code>maison home
  98. voiture car
  99. arbre tree
  100. </code></pre>
  101. <p>Bien, cela suffira. Sauver ce contenu sous le nom «essai.cvs»</p>
  102. <p>Nous avons donc 2 champs, un que nous appellerons «français», l'autre «anglais»</p>
  103. <p>Il suffit de suivre la méthode déjà décrite avant; seul le type de note à dupliquer sera différent. Je vais simplement afficher les captures d'écran pour ce qui ne change pas, et mettre un commentaire pour les parties modifiées.</p>
  104. <ol>
  105. <li>
  106. <p>créer un nouveau type de note</p>
  107. <p><img alt="étape 67" src="../Images/image-82.png" /></p>
  108. <p><img alt="étape 68" src="../Images/image-83.png" /></p>
  109. <p>C'est ici que nous allons avoir une modification du type de note. Nous utliserons une copie de «Basique (saisissez la réponse)»</p>
  110. <p><img alt="étape 69" src="../Images/image-84.png" /></p>
  111. <p><img alt="étape 70" src="../Images/image-85.png" /></p>
  112. </li>
  113. <li>
  114. <p>nos champs</p>
  115. <p><img alt="étape 71" src="../Images/image-86.png" /></p>
  116. <p><img alt="étape 72" src="../Images/image-87.png" /></p>
  117. <p><img alt="étape 73" src="../Images/image-88.png" /></p>
  118. <p><img alt="étape 74" src="../Images/image-89.png" /></p>
  119. </li>
  120. <li>
  121. <p>la définition de nos cartes</p>
  122. <p>Ici, voyez la différence de conception de nos cartes. La partie qui concerne la saisie dans la définition du recto est : {{type:anglais}}.</p>
  123. <p>Cette définition est reprise dans la partie verso pour montrer les erreurs s'il y en a, comme sur l'exmple sur la capture d'écran dans la partie droite en bas.</p>
  124. <p><img alt="étape 75" src="../Images/image-91.png" /></p>
  125. </li>
  126. <li>
  127. <p>importation de notre mini-fichier <strong>essai.csv</strong></p>
  128. <p><img alt="étape 76" src="../Images/image-92.png" /></p>
  129. <p><img alt="étape 77" src="../Images/image-93.png" /></p>
  130. <p><img alt="étape 78" src="../Images/image-94.png" /></p>
  131. <p><img alt="étape 79" src="../Images/image-95.png" /></p>
  132. <p><img alt="étape 80" src="../Images/image-96.png" /></p>
  133. </li>
  134. <li>
  135. <p>test</p>
  136. <p>En tapant la bonne réponse :</p>
  137. <p><img alt="étape 81" src="../Images/image-97.png" /></p>
  138. <p><img alt="étape 82" src="../Images/image-98.png" /></p>
  139. <p><img alt="étape 83" src="../Images/image-99.png" /></p>
  140. <p><img alt="étape 84" src="../Images/image-100.png" /></p>
  141. <p>En tapant une réponse erronée :</p>
  142. <p><img alt="étape 85" src="../Images/image-101.png" /></p>
  143. <p><img alt="étape 86" src="../Images/image-102.png" /></p>
  144. </li>
  145. </ol>
  146. <p>Et voilà pour les fiches avec saisie. Nous allons voir les textes à trous dans le chapitre suivant.</p>
  147. </div>
  148. </div>
  149. <footer>
  150. <div class="rst-footer-buttons" role="navigation" aria-label="footer navigation">
  151. <a href="../Champs-%C3%A9ditables-2/" class="btn btn-neutral float-right" title="Champs éditables «partie 2»">Next <span class="icon icon-circle-arrow-right"></span></a>
  152. <a href="../Nouvelle-approche/" class="btn btn-neutral" title="Nouvelle approche"><span class="icon icon-circle-arrow-left"></span> Previous</a>
  153. </div>
  154. <hr/>
  155. <div role="contentinfo">
  156. <!-- Copyright etc -->
  157. </div>
  158. Built with <a href="https://www.mkdocs.org/">MkDocs</a> using a <a href="https://github.com/snide/sphinx_rtd_theme">theme</a> provided by <a href="https://readthedocs.org">Read the Docs</a>.
  159. </footer>
  160. </div>
  161. </div>
  162. </section>
  163. </div>
  164. <div class="rst-versions" role="note" aria-label="versions">
  165. <span class="rst-current-version" data-toggle="rst-current-version">
  166. <span><a href="../Nouvelle-approche/" style="color: #fcfcfc;">&laquo; Previous</a></span>
  167. <span style="margin-left: 15px"><a href="../Champs-%C3%A9ditables-2/" style="color: #fcfcfc">Next &raquo;</a></span>
  168. </span>
  169. </div>
  170. <script>var base_url = '..';</script>
  171. <script src="../js/theme.js" defer></script>
  172. <script src="../search/main.js" defer></script>
  173. <script defer>
  174. window.onload = function () {
  175. SphinxRtdTheme.Navigation.enable(true);
  176. };
  177. </script>
  178. </body>
  179. </html>