画像を扱うには、まずそれをアップロードしておく必要があります。FlatPress の場合はメディアの処理が単純で画像データは一か所にごちゃまぜにアップロードされるだけとなっています。
画像のアップロード
アップロードをするには「管理エリア」の「アップローダ」を選択し、参照ボタンで所定ファイルを指定し、アップロードボタンを押して実行します(Firefox の場合は、この「参照」ボタンに画像をドラッグ&ドロップすることで指定を指示することが可能です)。同図のようにファイル名を複数してしておくことが可能です。
アップロードが無事に完了すると、その旨「ファイルがアップロードされました」が表示されます。
投稿記事において、html タグ自体を利用することが可能です。「管理エリア」の「プラグイン」の「BBcode」設定に下図のようなオプションがありますので「インラインHTML]を使用化としてチェックを入れておきます。
記事内容のおいては、例えば、
<img src=”https://www.google.co.jp/images/srpr/logo11w.png” width=120 style=”float: right”>
としておけば、HTMLタグがそのまま適用されて、下に示すような表示となります。
ここでは画像の表示位置も width=120 style=”float: right”のようにオプション指定しています。
タグプラグインをインストールする
これから、タグクラウド(tagcloud)のプラグインの導入実験をしてみようと思います。それに先立ってエディター(BBcode)の周辺を確認しました。下図をご覧ください。「管理エリア」の「プラグイン」のパネルには「プラグインの管理」の他に「BBCode」の設定が存在してました。これをみると「インラインHTML」を有効にするかどうかの設定が可能ですね。自分専用の備忘録が目的ならば有効にしないでも済む感じですが、一応チェックを入れておきます。
さて、目下のTagCloudのインストールとなるのですが、このタグクラウドの導入目的が通常のサイトとは異なっていることを、お断りしておきたいと思います。すなわち、通常ではアクセスされた記事が目立つ(大きく)表示になる訳ですが、本サイトの目的は「カテゴリ」区分に加えて、通常のタグとして、すなわち「ヒント、インデックス、タグ、付箋」のように、その時折に自分がしおりを挟むように活用したいと考えてます。ということで、自分が注目しているキーワードだけが強調される状態となるでしょう。
では実際のプラグインをダウンロードしましょう。FlatPress で目的のプラグインを探していくと、以下を見つけることができました。http://www.pierovdfn.it/2011/08/01/plugin-tag-v25-flatpress/comments/、ここより、tag_v2.5.tar.gzをダウンロードし、解凍しまし(unzip tag_v2.5.tar.gz、 tar xvf tag_v2.5.tar)、/fp-plugins 配下にアップロードしておきます。
アップロード後に「管理パネル」の「プラグイン」でアップロード状況を確かめておき、この図の赤丸をクリックして有効状態にします。
ところで、プラグインが有効となっただけでは表示場所が確保されていませんから、「管理エリア」の「ウィジェット」画面にてドラッグ&ドロップ機能でインストールされたこのtagプラグインを右パネルの最上部に表示設定します。(ドラッグ&ドロップにはちょっとコツが必要でした) なお、表示を削除するには赤色のボックスにドラッグ&ドロップすれば(表示が)削除されます。
以下の二つの画面ショットは、追加前と追加後の様子です。赤丸で示すようにタグ入力欄が追加表示されていますね。
タグ入力の操作感覚を試してみると、タグ欄には文字を入れるだけの話ですが、削除については下図のようにすでにタグ化されものは”ボタン化”されて表示される様子で、このおボタンをクリックすれば削除ができました。(削除確認のフェーズはありません)
ところで、トップ画面には前述したウィジェット操作でこの機能が出ているはずなので確かめてみるとありました。当然、まだ一つも記事にタグをつけていませんから、”まだタグはありません”表示となってます。
お試しに「支援ツール」といれてサンプル記事を書いてみましょうか。タグクラウドが見事にでました。が、文字がでかすぎ、醜い。。。。
そも、タグが一つであるのが理由ではありますが、前述している目的通りであれば、次第に自動で当該タグ数が増えることはないので、ここは次回の記事として対応策を考えましょう。
タグプラグイン(TagCloud)の表示機能を補強
一つ前の記事の「タグプラグインをインストールする」の続きとなっています。任意にタグを付けてワンクリックでアクセスするために TagCloud を利用したいという目的でこのプラグインをインストールしたわけです。カテゴリーからのアクセスとは使い方が異なっていると思っています。さて、前回の画面をもう一度掲載しておきます。このように最上位部に、目下、注目させておきたい記事(のタグ)が見えています。が、ちょっと大きさがイケテマセンね。
タグクラウドの大きさの設定画面を準備する
TagCloud で表示される大きさは付加されたタグの相対数比率となっています。なので、1個だけであれば100%の大きさになっています。そこで、大きさに係数を適当に掛けておこうと考えました。プログラムの変更点はまとめて後述したいと思いますので、ここでは UI 部分を説明していきます。
「管理エリア」に「タグクラウドの表示拡大サイズ」の設定項目増やしました。
表示係数で修正された文字で表示されるようになりました。
TagCloudの表示を日本語にしました。
(ここで適当なタグを付けた記事を増やしてみると、このようにタグの文字の大きさが記事数に応じて変わっています)
プログラムの変更点
各プログラムについて修正部分付近を記載しています。変更ポイントは冒頭にわかりやすく抜粋しています。
- 文字拡大率の設定に関する変更ポイント。
/fp-content/config/settings.conf.php
---------------------------------------------- 'tagmode' => '5', ---------------------------------------------- <?php $fp_config = array ( 'general' => array ( 'www' => 'http://flatpress.world/', 'title' => 'SixFlags', 'subtitle' => 'Information & blog', 'footer' => 'powered by AZLAND', 'author' => 'sixflags', 'email' => 'このメールアドレスはスパムボットから保護されています。閲覧するにはJavaScriptを有効にする必要があります。', 'startpage' => 'static-home', 'maxentries' => '31', 'maxcontents' => '50', 'tagmode' => '5', 'notify' => true, 'theme' => 'leggero', 'style' => 'leggero', 'blogid' => 'fp-532f3d58', 'charset' => 'utf-8', ), 'locale' => array (
/admin/panels/config/admin.config.php
---------------------------------------------- array('tagmode', 'tagmode', 'isInt', false, false, 'trim'), ---------------------------------------------- <?php class admin_config extends AdminPanel { var $panelname = 'config'; } class admin_config_default extends AdminPanelActionValidated { var $validators = array( // not needed anymore ! // array('blog_root', 'blog_root', 'notEmpty', false, false, 'trim'), array('www', 'www', 'notEmpty', false, false, 'trim'), // ... array('title', 'title', 'notEmpty', false, false, 'trim'), //array('subtitle', 'subtitle', 'notEmpty', false, false, 'trim'), //array('blogfooter', 'blogfooter', 'notEmpty', false, false, 'trim'), array('email', 'email', 'isEmail', false, false, 'trim'), array('maxentries', 'maxentries', 'isInt', false, false, 'trim'), array('maxcontents', 'maxcontents', 'isInt', false, false, 'trim'), array('tagmode', 'tagmode', 'isInt', false, false, 'trim'), array('timeoffset', 'timeoffset', 'isNumber', false, false, 'trim'), array('timeformat', 'timeformat', 'notEmpty', false, false, 'trim'), array('dateformat', 'dateformat', 'notEmpty', false, false, 'trim'), array('dateformatshort', 'dateformatshort', 'notEmpty', false, false, 'trim'), array('lang', 'lang', 'notEmpty', false, false, 'trim'), array('charset', 'charset', 'notEmpty', false, false, 'trim'),
/fp-interface/lang/ja-jp/lang.admin.conf.php---------------------------------------------- 'blogtagmode' => 'タグクラウドの表示拡大サイズ', ---------------------------------------------- 'gensetts' => '全般の設定', 'blogtitle' => 'サイトのタイトル', 'blogsubtitle' => 'サイトのサブタイトル', 'blogfooter' => 'フッター欄', 'blogauthor' => '管理者名', 'startpage' => 'サイトのトップ(優先表示する)ページ', 'stdstartpage' => '記事リスト(ブログ)の1ページめ(初期設定)', 'blogurl' => 'サイトのURL', 'blogemail' => '管理者のメールアドレス', 'notifications' => '通知設定', 'mailnotify' => 'コメントがつくとメールで通知する。', 'blogmaxentries' => 'ブログの1ページに表示する記事数', 'blogmaxcontents' => '表示する最近の記事数', 'blogtagmode' => 'タグクラウドの表示拡大サイズ', 'langchoice' => '言語の選択', 'intsetts' => 'ローカルの設定', 'utctime' => '<acronym title="Universal Coordinated Time">UTC</acronym>の時刻:', 'timeoffset' => '投稿時に加算する時間', 'hours' => '時間', 'timeformat' => '時刻表示のデフォルト形式', 'dateformat' => '日付表示のデフォルト形式', 'dateformatshort' => '日付短縮表示のデフォルト形式', 'output' => '現在の設定での表示例', 'charset' => '使用する文字コード', 'charsettip' => '(使用する文字コードは、utf-8を '. '<a href="http://wiki.flatpress.org/doc:charsets">推奨します</a>。)' (略) ---------------------------------------------- 'tagmode'=> '数は半角数字で正しく入力してください。', ---------------------------------------------- $lang['admin']['config']['default']['error'] = array( 'www' => 'サイトのURLが有効ではないようです。', 'title' => 'タイトルを記入してください。', 'email' => '正しくメールアドレスを記入してください。', 'maxentries'=> '記事数は半角数字で正しく入力してください。', 'maxcontents'=> '記事数は半角数字で正しく入力してください。', 'tagmode'=> '数は半角数字で正しく入力してください。', 'timeoffset'=> '有効な時差を半角数字で入力してください! '. 'なお小数を使用できます。 (例 2時間30分 => 2.5)', 'timeformat'=> '時刻表示用の表記で指定してください。', 'dateformat'=> '日付表示用の形式で指定してください。', 'dateformatshort'=> '日付短縮表示用の形式を使用してください。', 'charset' => 'You must insert a charset id.(文字コード名を正確に記入してください)', 'lang' => 'The language you chose is not available.(選択言語は使用不可)' );
/admin/panels/config/admin.config.php------------------------------------------------------------ 'tagmode' => $_POST['tagmode'], ------------------------------------------------------------ function onsave() { global $fp_config; $l = explode(',',$_POST['lang']); $fp_config['general'] = array( //'BLOG_ROOT' => $_POST['blog_root'], 'www' => $_POST['www'], 'title' => html_entity_decode(stripslashes($_POST['title'])), 'subtitle' => html_entity_decode(stripslashes($_POST['subtitle'])), 'footer' => html_entity_decode(stripslashes($_POST['blogfooter'])), 'author' => $_POST['author'], 'email' => $_POST['email'], 'startpage' => ($_POST['startpage'] == ':NULL:')? null : $_POST['startpage'], 'maxentries' => $_POST['maxentries'], 'maxcontents' => $_POST['maxcontents'], 'tagmode' => $_POST['tagmode'], // 'voting' => $_POST['voting'], 'notify' => isset($_POST['notify']), /* preserve the following */ 'theme' => $fp_config['general']['theme'], 'style' => @$fp_config['general']['style'], 'blogid' => $fp_config['general']['blogid'], 'charset'=> 'utf-8', );
admin/panels/config/admin.config.tpl
----------------------------------------------------------- <dt><label for="tagmode"> {$panelstrings.blogtagmode} </label></dt> <dd><input type="text" name="tagmode" id="tagmode" class="smalltextinput{$error.tagmode|notempty:" field-error"}" value="{$flatpress.tagmode}" /></dd> ----------------------------------------------------------- <dt><label for="maxcontents"> {$panelstrings.blogmaxcontents} </label></dt> <dd><input type="text" name="maxcontents" id="maxcontents" class="smalltextinput{$error.maxcontents|notempty:" field-error"}" value="{$flatpress.maxcontents}" /></dd> <dt><label for="tagmode"> {$panelstrings.blogtagmode} </label></dt> <dd><input type="text" name="tagmode" id="tagmode" class="smalltextinput{$error.tagmode|notempty:" field-error"}" value="{$flatpress.tagmode}" /></dd> </dl>
- 実際の文字列を表示する際に係数を掛け込む変更ポイント。
/fp-plugins/tag/inc/widget.php ($fp_config と $smod がグローバル変数としてアクセスしています。)-------------------------------------------------------- // FlatPress 2014-9-5 global $fp_config; global $smod; $smod = intval($fp_config['general']['tagmode']); --------------------------------------------------------- // FlatPress 2014-9-5 global $smod; --------------------------------------------------------- // FlatPress 2014-9-5 $s=PLUGIN_TAG_WMIN+$perc*$smod; -------------------------------------------------------- <?php /** * plugin_tag_widget * * This class manages the widgets of the plugin tag. * These are the Tag Cloud and the related Entries. */ class plugin_tag_widget { # The tagdb object var $tagdb=null; # The tag entry object var $entry=null; # The tag cloud cache var $widgetCache=array(); /** * This function is the constructor of the class. * It saves by reference the tagdb object and the entry object. * * @param object $tagdb: The tagdb object * @param object $entry: The tag entry object */ function plugin_tag_widget(&$tagdb, &$entry) { // FlatPress 2014-9-5 global $fp_config; global $smod; $smod = intval($fp_config['general']['tagmode']); $this->tagdb=&$tagdb; $this->entry=&$entry; } (snip) function tagCloud($number=PLUGIN_TAG_MAXC) { // FlatPress 2014-9-5 global $smod; (snip) foreach($tags as $tag=>$perc) { $l=apply_filters('tag_link', $tag); $n=$cache[$tag]['a']; $t=''.$n; $t.=$n==1 ? $lang['entry'] : $lang['entries']; $t=wp_specialchars($t); $d=$this->relToClass($perc); $c=wp_specialchars($tag); $s=PLUGIN_TAG_WMIN+$perc*$delta; // FlatPress 2014-9-5 $s=PLUGIN_TAG_WMIN+$perc*$smod;
- 日本語(TagCloud -> タグクラウド)への変更ポイント。
/fp-plugins/tag/lang (英語をいったんコピー(lang.ja-jp.php)してそれを変更する)<?php $lang['plugin']['tag'] = array( 'tag_s'=>'Tag: ', 'title_pre'=>'Tag: ', 'widget'=>'タグ', 'entry'=>' entry', 'entries'=>' entries', 'notags'=>'There isn\'t any tag.', ); $lang['plugin']['tag']['errors'] = array ( -1 => 'This plugin require BBCode to be loaded. Maybe plugins have been loaded in wrong order' ); $lang['admin']['plugin']['tag']=array( 'tag_pl'=>'タグ', 'remove'=>'Remove', ); ?>