エントリー

freoのエントリーのタグ投稿を楽にする方法

freoのエントリーでカテゴリーはチェックボックスで選んで投稿できますが、タグは選んで投稿することができません。
以前使っていたタグ名がわからず一旦サイトのタグクラウドを見て...なんて経験よくありますね。
そこで今回はjQueryプラグインのjQuery.jTagging.jsを使ってタグの入力候補を表示させる方法を紹介します。

参考:タグを簡単にフォームに挿入するjavascript「jTagging」

  1. jQuery.jTagging.js(ライセンスはMIT&GPLの模様)はもともとの配布場所が閉鎖されているため、m-captcha に残っているソースをテキストエディタにコピー(「View raw file」を押すとテキストのソースが表示されるのでそこからコピーしたほうがよい)して作成し、 ⇒こちら(圧縮版のファイルを作成しました)のソースをコピーして jQuery.jTagging.min.js と名前をつけて、js/ にアップして下さい。【2018/05/12修正】
  2. js/admin.js の9行目にある
    $(document).ready(function() {

    の下に、

      //タグ入力
      $("#tag").jTagging($("#taglist"), ",");
    を追加します。
    ※iPhone版で使用したい場合は js/iphone/common.js にも同様に追加して下さい。
  3. templates/internals/admin/header.html の15行目あたりの
    <script type="text/javascript" src="{$freo.core.http_url}{$smarty.const.FREO_JS_DIR}jquery.tablesorter.js"></script>

    の下に、

    <script type="text/javascript" src="{$freo.core.http_url}{$smarty.const.FREO_JS_DIR}jQuery.jTagging.min.js"></script>
    を追加します。【2018/05/12ファイル名修正】
    ※iPhone版で使用したい場合は templates/iphones/header.html にも同様に追加して下さい。
  4. 投稿フォームの変更
    • 任意のタグの候補を使用する場合
      templates/internals/admin/entry_form.html
      <dt>タグ</dt>
        <dd><input type="text" name="entry[tag]" size="50" value="{$input.entry.tag}" /></dd>

      の部分を、

      <dt>タグ</dt>
        <dd>
          <input type="text" name="entry[tag]" id="tag" size="50" value="{$input.entry.tag}" />
          <div id="taglist">
            <a href="#" onclick="return false;">タグ1</a>&nbsp;&nbsp;<a href="#" onclick="return false;">タグ2</a>&nbsp;&nbsp;<a href="#" onclick="return false;">タグ3</a>
          </div>
        </dd>
      に変更(赤字を追加)します。
      タグ1タグ2タグ3の部分は任意のものを入れて下さい。
    • タグの候補をタグクラウド一覧から選ぶ場合(あらかじめfreoの エントリータグクラウド表示プラグイン を導入してくだい)
      libs/freo/plugins/config.entry_tagcloud.php のdisplayファイルの読み込み設定に"admin/entry_form"を追加します。
      //displayファイルの読み込み設定
        define('FREO_PLUGIN_ENTRY_TAGCLOUD_LOAD_DISPLAY', 'default,entry,category,view,admin/entry_form');

      上記の任意のタグの候補を使用する場合の templates/internals/admin/entry_form.html の変更箇所を、

      <dt>タグ</dt>
        <dd>
          <input type="text" name="entry[tag]" id="tag" size="50" value="{$input.entry.tag}" />
          <div id="taglist">
          <!--{foreach from=$plugin_entry_tagclouds|smarty:nodefaults item='plugin_entry_tagcloud'}-->
            <a href="#" onclick="return false;">{$plugin_entry_tagcloud.tag}</a>&nbsp;&nbsp;
          <!--{/foreach}-->
          </div>
        </dd>

      に変更(赤字を追加)します。

      ※タグクラウド一覧を使う場合は候補が多いとずらずらと表示されるのでそのへんはどうかご勘弁を...(^^ゞ
      ※一覧以外のものを任意に入力することは可能です。
      ※iPhone版で使用したい場合は templates/iphones/internals/admin/entry_form.html にも同様に変更して下さい。

  5. 変更するとタグの入力欄の下にタグの候補が表示されます。
    ファイル 69-1.jpg
    入力したい候補をクリックすると入力欄にクリックした候補が表示されます(複数選択すると間にカンマが入るようになっています)。
    ファイル 69-2.jpg

ページ移動

関連エントリー

コメント

利用者

初めまして、こんばんは。
いつもfreoのカスタマイズに役立てさせていただいております。

こちらのカスタマイズですが、突然使用できなくなってしまいました。
エントリー登録画面のタイトル入力の真下、本文という文字の横にある
メディア管理・メディア登録が同じウインドウ(iframe表示にならない)で表示されるようになりました。
4-2) タグの候補をタグクラウド一覧から選ぶ場合を利用していました。

・同じブログでもページ登録ではメディア管理・メディア登録はiframe表示される
・タグが最初数個以降は、クリックしてもきちんと選択されなくなっていた

このカスタマイズの以下の部分

<div id="taglist">
<!--{foreach from=$plugin_entry_tagclouds|smarty:nodefaults item='plugin_entry_tagcloud'}-->
<a href="#" onclick="return false;">{$plugin_entry_tagcloud.tag}</a>&nbsp;&nbsp;
<!--{/foreach}-->
</div>

を消してみたところ、きちんとiframe表示されるようになりました。

ただ、当方、いくつかfreoでブログを運営しておりまして、別のブログでも
このカスタマイズを同じ状況で利用しているのですが、そちらは問題が発生していませんでした。

このカスタマイズを消したところ、きちんと表示されるようになりました。

いくつかのブラウザで確認しましたが、全て同様の現象が発生しました。
4-2) タグの候補をタグクラウド一覧から選ぶ場合を利用しており、
タグの数が多くなるとおかしくなってしまうのでしょうか……現在22個ほどあります。
また、タグ自体も具体的に表記しているので長文のものが多いです。

便利でしたので、継続して利用できるようでしたら利用したいです。
お時間がある時で構いませんので、こちらの環境改善で改善されるようでしたらご指導の程、よろしくお願い致します。

  • 2017/02/17 06:06:00

ccc

サイトのfreo化などもあって、すっかり亀レスになって申し訳ございませんm(__)m

タグの数が多くなるとおかしくなってしまうのでしょうか……現在22個ほどあります。

タグの数が多くても特に問題はないはずですが...(個人的には30以上のタグでも問題は出ていません)

対処方法としては月並みですが、
・ブラウザのキャッシュをクリアする
・templates_c ディレクトリ内の.htaccess以外のファイルを一旦消す
・フレームを再読込する
とぐらいしか言いようがなくて申し訳ないです。

  • 2017/06/13 14:50:57

コメント登録

  • コメントを入力してください。
  • 一旦登録したコメントは、あとで編集できませんのでご注意下さい。
登録フォーム

基本的には「全体に公開」されますが、内容によっては管理人の方で公開を制限する場合がありますので、その旨ご了承下さい。

ユーティリティ

2024年03月

- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31 - - - - - -

キーワード検索

キーワード検索フォーム

ユーザー

  • cccのアバター

新着画像

ブログパーツ

Twitter

Twilogを見る

Feed