jQueryのプラグインの仕方を教えて下さい。

前提・実現したいこと

オートでカナ入力
やり方は、jqueryでプラグイン（なるべくダウンロード方式がいいです）

発生している問題・エラーメッセージ

・プラグインができない
・CDNでのプラグインもできないし、ダウンロードでのやり方もわからないです。

エラーメッセージ

該当のソースコード

<!DOCTYOE html>

<html lang="ja">

<meta chraset="utf-8">

<title>HTML課題</title>

<link rel="stylesheet" href="css/styles2.css">


<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script>


<body>
 <div class="box1"
 style="border: 2px solid skyblue;
 ,background-color:skyblue;">
  <h1>プロフィールを入力して下さい</h1>




    <form method="post">

      <p>
        <label for="name">名前:</label>
        <input tyoe="text" id="name" placeholder="名前を入力して下さい">
      </p>

      <p>
        <label for="name">カナ名前:</label>
        <input tyoe="text" id="name" placeholder="カナを入力して下さい">
      </p>


     
      <p>
        <label for="name">血液型:</label>
        <select name="example">


          <option value="A">A</option>
          <option value="B">B</option>
          <option value="AB">AB</option>
          <option value="O">O</option>
        </select>

      </P>
      <p>
        <label for="name">星座:</label>
        <if >
        <input tyoe="text" id="name" placeholder="星座を入力して下さい">
      </P>

      <p >
        <label for="name">出身都道府県:</label>

        <select name="pref">
          <option value="">出身都道府県を入力して下さい</option>
          <option value="北海道">北海道</option>
          <option value="青森県">青森県</option>
          <option value="岩手県">岩手県</option>
          <option value="宮城県">宮城県</option>
          <option value="秋田県">秋田県</option>
          <option value="山形県">山形県</option>
          <option value="福島県">福島県</option>
          <option value="茨城県">茨城県</option>
          <option value="栃木県">栃木県</option>
          <option value="群馬県">群馬県</option>
          <option value="埼玉県">埼玉県</option>
          <option value="千葉県">千葉県</option>
          <option value="東京都" >東京都</option>
          <option value="神奈川県">神奈川県</option>
          <option value="新潟県">新潟県</option>
          <option value="富山県">富山県</option>
          <option value="石川県">石川県</option>
          <option value="福井県">福井県</option>
          <option value="山梨県">山梨県</option>
          <option value="長野県">長野県</option>
          <option value="岐阜県">岐阜県</option>
          <option value="静岡県">静岡県</option>
          <option value="愛知県">愛知県</option>
          <option value="三重県">三重県</option>
          <option value="滋賀県">滋賀県</option>
          <option value="京都府">京都府</option>
          <option value="大阪府">大阪府</option>
          <option value="兵庫県">兵庫県</option>
          <option value="奈良県">奈良県</option>
          <option value="和歌山県">和歌山県</option>
          <option value="鳥取県">鳥取県</option>
          <option value="島根県">島根県</option>
          <option value="岡山県">岡山県</option>
          <option value="広島県">広島県</option>
          <option value="山口県">山口県</option>
          <option value="徳島県">徳島県</option>
          <option value="香川県">香川県</option>
          <option value="愛媛県">愛媛県</option>
          <option value="高知県">高知県</option>
          <option value="福岡県">福岡県</option>
          <option value="佐賀県">佐賀県</option>
          <option value="長崎県">長崎県</option>
          <option value="熊本県">熊本県</option>
          <option value="大分県">大分県</option>
          <option value="宮崎県">宮崎県</option>
          <option value="鹿児島県">鹿児島県</option>
          <option value="沖縄県">沖縄県</option>
        </select>
      </P>




      <p>
        <label for="name">郵便番号:</label>
        <input tyoe="text" id="name" placeholder="郵便番号を入力して下さい">
      </P>

      <p>
        <label for="name">住所:</label>
        <input tyoe="text" id="name" placeholder="住所を入力して下さい">
      </P>

      <p>
        <input type="submit" value="登録">
        <input type="reset" value="クリア">

      </p>





  </form>
  </div>

  <form>
  <label for="userName">氏名</label>
  <input type="text" id="userName" placeholder="こっちに漢字を書き込むと…">
  <label for="userNameKana">氏名カナ</label>
  <input type="text" id="userNameKana" placeholder="こっちにカタカナが勝手に入力される">
  </form>

  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script type="text/javascript">
  $(function() {
    $.fn.autoKana('xxxxx', 'yyyyy', {
        katakana : true  //true：カタカナ、false：ひらがな（デフォルト）
    });
});
  </script>

  <script src="../../public/javascripts/jquery-1.10.2.min.js"></script>
  <script src="../../public/javascripts/jquery.autoKana.js" language="javascript" type="text/javascript"></script>

  <div>
      <label for="user_name" class="">氏名</label>
      <input type="text" id="user_name">
  </div>
  <div>
      <label for="user_name_kana" class="">カナ</label>
      <input type="text" id="user_name_kana">
  </div>

  <script type="text/javascript">
      $(document).ready(
          function() {
              $.fn.autoKana('#user_name', '#user_name_kana', {
                  katakana : true  //true：カタカナ、false：ひらがな（デフォルト）
          });
      });
  </script>


  <form>
  <label for="userName">氏名</label>
  <input type="text" id="userName" placeholder="こっちに漢字を書き込むと…">
  <label for="userNameKana">氏名カナ</label>
  <input type="text" id="userNameKana" placeholder="こっちにカタカナが勝手に入力される">
  </form>

  <script src="./jquery.autoKana.js"></script>
<script>
$(function() {
    $.fn.autoKana('#userName', '#userNameKana', {
        katakana : true  //true：カタカナ、false：ひらがな（デフォルト）
    });
});
</script>


<!-- ▼郵便番号入力フィールド(3桁+4桁) -->
<input type="text" name="zip21" size="4" maxlength="3"> － <input type="text" name="zip22" size="5" maxlength="4" onKeyUp="AjaxZip3.zip2addr('zip21','zip22','addr21','addr21');">
<!-- ▼住所入力フィールド(都道府県+以降の住所) -->
<input type="text" name="addr21" size="40">



</body>
</html>