28.ブログツール(Nucleus)」カテゴリーアーカイブ

画像ポップアップウィンドウにスクロールバーを表示

画像アップロード時に自動的にサムネイルを作成してくれるプラグイン「NP_Thumbnail バージョン: 3.0」を導入してますが、デフォルトでは画面より大きいサイズのものをアップした場合、スクロールバーが表示されない為、全部見ることが出来ません。(F11をクリックするとフルスクリーンモードになりスクロールバーが出てきて全部見ることは出来ますが)
最近画像サイズの大きいものをアップすることが多くなったので、画像ポップアップウィンドウにスクロールバーを表示するようにしました。
「NP_Thumbnail.php」の278行目と279行目を以下のように変更

scrollbars=no
↓
scrollbars=yes

Nucleus バージョン3.31sp1 にアップグレード

Nucleus バージョン3.31sp1 日本語版にアップグレードしました。バージョン3.31英語版で発見されたXSS脆弱性の修正を加えたバージョン3.32相当のコードが含まれているようです。
アップグレード手順
■ パッケージのダウンロード
フルパッケージとアップグレード用パッケージがありますのが、(v3.3)からのアップグレードなのでアップグレード用パッケージをダウンロードします。
EUC-JP版
http://prdownloads.sourceforge.jp/nucleus-jp/29273/upgrade3.31_ja_euc_sp1.zip
■ バックアップの作成
今まで使ってたデータベースとconfig.php のバックアップをとります。
■ ファイルの更新
upgrade3.31_ja_euc_sp1のファイル全てをサーバーにアップします。但し、コアファイル等の変更をしてますので、変更してたファイルは全てバックアップをとっておきます。ファイル更新後、必要な箇所全てを変更しなおします。
変更しているファイル
1)未来投稿記事の表示
nucleus/libs/BLOG.php
nucleus/libs/COMMENTS.php
nucleus/libs/globalfunctions.php
2)コメント内の自動リンク表示変更
nucleus/libs/COMMENT.php
3)エディタに機能ボタンを追加
nucleus/javascript/edit.js
nucleus/libs/PAGEFACTORY.php
nucleus/language/japanese-euc.php
4)Nucleusのカテゴリーの順番入れ替え
nucleus/libs/BLOG.php
nucleus/libs/ITEMACTIONS.php
■ アップグレードスクリプトの実行
下記 URL にアクセスしてアップグレードスクリプトを実行します。
http://yokensaka.com/fedora/nucleus/upgrades/index.php
実行すべきアップグレード手順のリストが表示されます。
これらのアップグレード手順を全て実行します。
これによりアップグレード後に必要となるデータベース(v3.31用)が構築されます。
セキュリティリスクを避けるため、upgrades ディレクトリはアップグレード後は削除します。

コメント内の自動リンク表示変更

Nucleusはコメント内にurlがあった場合、表示されるurlは
最後が[…]になってしまいますので、全部表示されるようにしました。
ただし、以前のコメントに関しては全部表示になりません。
nucleus/libs/COMMENT.phpの最下行を編集

return $pre . '<a href="'.$linkedUrl.'">'.shorten($displayedUrl,30,'...').'</a>' . $post;
↓
return $pre . '<a href="'.$linkedUrl.'">'.$displayedUrl.'</a>' . $post;

ソースの書き方

このブログではソースのスペースや改行をそのまま表示するようにして書いてますが、どうするんですかっていう質問がありましたので私がやってる方法を書きます。
私はソースやスプリクトなどを書く時はソースのスペースや改行をそのまま表示する<pre>~</pre>を使って書いてます。ただし、”<” とか “>” とか “&” は特殊文字として認識されてしまうので、”&lt;” や “&gt;” や “&amp;” に置き換えなければなりません。それについては前にも書いてますのでそちらを参考にしてください。それと、ほとんどのブログツールは改行を自動変換して表示しますので、二重に改行されてしまいます。そこで、改行を自動変換しない部分を指定できるプラグイン「NP_StripBR」を使って、改行を自動変換してほしくない部分を<%nobr%>~<%/nobr%>で括って書いてます。あとソースの横幅はブログの記事を表示する横幅より長いのでスクロールして見れるようにスタイルシートで表示方法を指定してます。
記述例
■ 何もしないで書いた場合
ブログの表示幅にあわせて改行され、スペース等はつめられる

[root@linux ~]# rpm -Uvh http://www.fedorafaq.org/yum http://rpm.livna.org/livna-release-6.rpm
http://www.fedorafaq.org/yum を取得中
http://rpm.livna.org/livna-release-6.rpm を取得中
警告: /var/tmp/rpm-xfer.4X6tSX: ヘッダ V3 DSA signature: NOKEY, key ID a109b1ec
準備中… ########################################### [100%]
パッケージ livna-release-6-1 は既にインストールされています。

■ <pre>~</pre>で括った場合
ブログの幅で改行されなくなり、スペースもそのまま表示されるが、二重改行される

[root@linux ~]# rpm -Uvh http://www.fedorafaq.org/yum http://rpm.livna.org/livna-release-6.rpm
http://www.fedorafaq.org/yum を取得中
http://rpm.livna.org/livna-release-6.rpm を取得中
警告: /var/tmp/rpm-xfer.4X6tSX: ヘッダ V3 DSA signature: NOKEY, key ID a109b1ec
準備中...                   ########################################### [100%]
パッケージ livna-release-6-1 は既にインストールされています。

■ 更に<pre><%nobr%>~<%/nobr%></pre>で括った場合
改行もスペースもそのまま表示される

[root@linux ~]# rpm -Uvh http://www.fedorafaq.org/yum http://rpm.livna.org/livna-release-6.rpm
http://www.fedorafaq.org/yum を取得中
http://rpm.livna.org/livna-release-6.rpm を取得中
警告: /var/tmp/rpm-xfer.4X6tSX: ヘッダ V3 DSA signature: NOKEY, key ID a109b1ec
準備中...                   ########################################### [100%]
パッケージ livna-release-6-1 は既にインストールされています。

■ 枠の中に表示して、はみ出た部分はスクロールするようにスタイルシートに以下のように記述

pre
{
width: 550px;
overflow-x: scroll;
font-family: sans-serif;
font-size: small;
border-style:dotted;
border-color:gray;
border-width:thin;
padding: 5px;
margin: 2px;
background-color:#F7F7F7;
}

プラグイン「NP_ArchiveIndex」をインストール

あにょのブログの記事数が多くなってきたので、カテゴリー別に一覧表示できるようにしました。前は記事の一覧表示させるのに「NP_Title List」を入れてたんですが、「NP_ArchiveIndex」に変更しました。
「NP_ArchiveIndex」はアーカイブ一覧画面に、カテゴリー別に記事一覧を分かりやすく表示する為のプラグインです。
プラグインをインストールしたら、アーカイブ一覧画面にカテゴリー別に記事の一覧を作成するため、スキンにプラグイン変数を記述します。
■スキンへの記述
スキン編集から「月別アーカイブ一覧ページ」の表示させたいところに記述
第1パラメータはインデックス(全カテゴリー表示時)のカテゴリー別記事数、第2パラメータはカテゴリー別表示時の一覧記事数、第3はカテゴリー詳細文の表示、非表示です。

<%archivelist(mtemplate)%>
↓
<%ArchiveIndex(10,50,none)%>

■スタイルシートに追記

/*-------------------------------------------------
NP_ArchiveIndex
-------------------------------------------------*/
.archiveindex table { /*テーブルのスタイル指定*/
width: 70%;
margin: 1em 0 2em;
padding: 0;
border-collapse: collapse;
};
.archiveindex th { /*カテゴリー名*/
margin: 0;
padding: 2px 5px;
text-align: left;
};
.archiveindex tr.more { /*Moreリンク行*/
background: none;
font-size: small;
}
.archiveindex td { /*セル表示のスタイル指定*/
margin: 0;
padding: 2px 5px;
border-top: 1px dotted gray;
text-align: left;
vertical-align: top;
}
.archiveindex td.detail { /*日付表示セル*/
white-space: nowrap;
text-align: right;
}
.archiveindex td span.title{ /*記事タイトル*/
}
.archiveindex td span.title-up { /*更新された記事*/
color: red;
}
.archiveindex td span.catdesc { /*カテゴリー詳細*/
font-size: small;
color: gray;
}
.archiveindex td span.nomore { /*Moreリンク無効*/
color: #ccc;
}

■NP_ArchiveIndex.phpの編集
カテゴリーの名前の前に<00>、<01>等の数字を入力して、順番を自由に設定できるようにしてますので、その数字を表示させないように変更します。

255行目
$icatName = $b->getCategoryName($icat);
↓
$icatName = strip_tags($b->getCategoryName($icat));

NP_ArchiveIndexはカテゴリーの順番をNP_ContentsListを使って並べ替えするような仕様になってますが、当ブログではNP_ContentsListを使ってないのでうまく並べ替えされません。そこで、新着記事順にカテゴリーも並べ替えされるようにsort by categoryの部分をコメントアウトします。

378行目~396行目をコメントアウト
/*	//sort by category
if ($manager->pluginInstalled('NP_ContentsList')) {
$plugin =& $manager->getPlugin('NP_ContentsList');
if ($plugin) {
$query = 'SELECT rid as catid FROM '. sql_table('plug_contentslist_rank') .' WHERE blog=0 AND rank<20 ORDER BY rank ASC'; // you can delete 'AND rank<20'
$cl_res = sql_query($query);
$arr_out2 = $arr_out;
$arr_out = array();
while ($clrank = mysql_fetch_object($cl_res)) {
$icatName = $b->getCategoryName($clrank->catid);
$arr_out[] = $arr_out2[$icatName];
}
$arr_out2 = '';
}
}
else {
ksort($arr_out);
}*/

■オプション設定
カテゴリーの名前をオレンジ色に変更しました。

<table><thead title="%catdesc%"><tr><th><a href="%caturl%">%catname%</a></th><th></th></tr></thead><tbody>
       ↓
<table><thead title="%catdesc%"><tr><th><a href="%caturl%"><span style="color: #FF6600;">%catname%</span></a></th><th></th></tr></thead><tbody>

未来投稿記事の表示

Nucleusでは普通、今日の日付までの記事しか表示できません。
そこで、Nucleusでスケジュール管理用に先々の予定なども書き込み、表示させるようにしたかったので、いろいろ調べてみました。同じ様なことを考える人がやっぱりいるんですね。
NucleusJPフォーラムの中にありました。
http://japan.nucleuscms.org/bb/viewtopic.php?t=144
ここにコアファイルを改造する方法が詳しく解説されています。
1)Nucleusのコアファイル「BLOG.php」の変更
BLOG.php(v3.31SP1)
以下の3ヶ所を//でコメントアウト

function getSqlSearch内
491行目//	   . ' and i.itime<=' . mysqldate($this->getCorrectTime())
function getSqlBlog内
534行目	       . ' and i.idraft=0';	// exclude drafts
536行目//	   . ' and i.itime<=' . mysqldate($this->getCorrectTime());
※行の終了";"がコメントアウトではずれてしまうので「. ' and i.idraft=0」の後ろに";"を入れます
function showArchiveList内
566行目//	   . ' and itime <=' . mysqldate($this->getCorrectTime())	// don't show future items!

2)「globalfunctions.php」、「COMMENTS.php」の各ファイルのそれぞれの0,0 の部分を、1,1に変更
globalfunctions.php(v3.31SP1)

function selector内
771行目		if (!$manager->existsItem($itemid,1,1))

COMMENTS.php(v3.31SP1)

function isValidComment内
287行目		$item =& $manager->getItem($this->itemid,1,1);

3)プラグインを使用する場合はそのプラグインも変更
私は「NP_ShowBlogs」を使ってるのでこちらも変更します
http://japan.nucleuscms.org/bb/viewtopic.php?t=604
ここに変更方法が書かれてます。
NP_ShowBlogs
下記の2ヶ所(記事数カウントする部分と、記事を抽出する部分と)をコメントアウトして未来制限を解除します。

340行目//	$where .= ' AND i.itime <= ' . mysqldate($b->getCorrectTime());
404行目//				   . ' AND i.itime  <= ' . mysqldate($b->getCorrectTime()) 

4)未来投稿記事をカレンダーで表示できるように変更
NP_Calender-0.84k(表示幅設定機能付き)ここに変更方法が書かれてます
NP_Calendar.php

209行目	   if ($category != 0) {
210行目		   $res = sql_query('SELECT DAYOFMONTH(itime) as day FROM '.sql_table('item').' WHERE icat='.$category.' and MONTH(itime)='.$month.' and YEAR(itime)='.$year .' and iblog=' . $blogid . ' and idraft=0 and UNIX_TIMESTAMP(itime)<'.$timeNow.' GROUP BY day');
211行目	   } else {
212行目		   $res = sql_query('SELECT DAYOFMONTH(itime) as day FROM '.sql_table('item').' WHERE MONTH(itime)='.$month.' and YEAR(itime)='.$year .' and iblog=' . $blogid . ' and idraft=0 and UNIX_TIMESTAMP(itime)<'.$timeNow.' GROUP BY day');
213行目	   }
↓
209行目	   if ($category != 0) {
210行目		   $res = sql_query('SELECT DAYOFMONTH(itime) as day FROM '.sql_table('item').' WHERE icat='.$category.' and MONTH(itime)='.$month.' and YEAR(itime)='.$year .' and iblog=' . $blogid . ' and idraft=0 GROUP BY day');
211行目	   } else {
212行目		   $res = sql_query('SELECT DAYOFMONTH(itime) as day FROM '.sql_table('item').' WHERE MONTH(itime)='.$month.' and YEAR(itime)='.$year .' and iblog=' . $blogid . ' and idraft=0 GROUP BY day');
213行目	   }
226行目	   if ($next_month > $currentdate['mon'] && $year == $currentdate['year']) {
227行目	   	   $future = false;
228行目	   } else {
229行目	   	   $future = true;
230行目	   }
↓
226行目	   if ($next_month > $currentdate['mon'] && $year == $currentdate['year']) {
227行目	   	   $future = true;
228行目	   } else {
229行目	   	   $future = true;
230行目	   }

※おまけ
日付表示に曜日を付け加えて、更に曜日を日本語で表示するように変更
Nucleusの管理画面で「テンプレート編集」(日付と時刻)の中から

日付フォーマットを編集
%d/%m
↓
%m/%d(%a)
更にLocaleも編集
en
↓
japanese

エディタに機能ボタンを追加

Nucleusのエディタに機能ボタンを追加する方法については、nakahara21.comweb関連tips備忘録でいろいろ紹介されているのでこのブログにもちょっとアレンジしてボタンを追加してみます。
Nucleusのエディタに以下の5つの機能ボタンを追加します。
・選択範囲を<pre><%nobr%>~<%/nobr%></pre>’で囲むボタン
・特殊文字を変換(<、>、& を &lt;、&gt;、&amp; に変換)するボタン
・リスト形式、番号付きリスト形式、見出しリスト形式のボタン
編集するのは下の3つ (Nucleus CMS v3.31SP1 )
 ・nucleus/javascript/edit.js
 ・nucleus/libs/PAGEFACTORY.php
 ・nucleus/language/japanese-euc.php
まずはedit.jpから 110行目付近の

function italicThis() { insertAroundCaret('<i>','</i>'); }
の下に、以下の2行を挿入する。
function preThis() { insertAroundCaret('<pre><%nobr%>','<%/nobr%></pre>'); }
function entitiesThis() { entitiesCaret(); }

次に、287行目付近の

/* some methods to get things working in Mozilla as well */
の上に以下の関数を挿入する。
function entitiesCaret () {
var textEl = lastSelected;
if (textEl && textEl.createTextRange && lastCaretPos) {
var caretPos = lastCaretPos;
caretPos.text = caretPos.text.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\"/g, '&quot;').replace(/'/g, '&#039;');
} else if (!document.all && document.getElementById) {
newText = mozSelectedText().replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/\"/g, '&quot;').replace(/'/g, '&#039;');
mozReplace(document.getElementById('input' + nonie_FormType), newText);
}
updAllPreviews();
}

次に、下記のコードを最後尾に追加します。

function ullistThis() { insertAroundCaret('<ul><li></li>\n<li></li>\n<li></li>\n<li></li>','</ul>\n'); }
function nolistThis() { insertAroundCaret('<ol><li></li>\n<li></li>\n<li></li>\n<li></li>','</ol>\n'); }
function dllistThis() { insertAroundCaret('<dl><dt></dt>\n<dd></dd>\n<dt></dt>\n<dd></dd>','</dl>\n'); }

今度はPAGEFACTORY.php (313行目)

$this->_jsbuttonspacer();
の下に、以下の5行を挿入する。
$this->_jsbutton('pre',"preThis()",_ADD_PRE_TT);
$this->_jsbutton('entities',"entitiesThis()",_ADD_ENTITIES_TT);
$this->_jsbutton('ullist',"ullistThis()",_ADD_ULLIST_TT);
$this->_jsbutton('nolist',"nolistThis()",_ADD_NOLIST_TT);
$this->_jsbutton('dtlist',"dllistThis()",_ADD_DLLIST_TT);

次にPAGEFACTORY.php (351行目)

$this->_jsbuttonspacer();
の下に、以下の5行を挿入する。
$this->_jsbutton('pre',"preThis()",_ADD_PRE_TT);
$this->_jsbutton('entities',"entitiesThis()",_ADD_ENTITIES_TT);
$this->_jsbutton('ullist',"ullistThis()",_ADD_ULLIST_TT);
$this->_jsbutton('nolist',"nolistThis()",_ADD_NOLIST_TT);
$this->_jsbutton('dtlist',"dllistThis()",_ADD_DLLIST_TT);

次にjapanese-euc.phpの編集

209行目 // tooltips on toolbar
210行目 define('_ADD_ALIGNLEFT_TT',		       '左寄せ');
211行目 define('_ADD_ALIGNRIGHT_TT',		'右寄せ');
212行目 define('_ADD_ALIGNCENTER_TT',		'中央寄せ');
この下に以下を追加
define('_ADD_PRE_TT',		'<PRE>');
define('_ADD_ENTITIES_TT',		'特殊文字変換');
define('_ADD_ULLIST_TT',		'リスト形式');
define('_ADD_NOLIST_TT',		'番号付きリスト形式');
define('_ADD_DLLIST_TT',		'見出しリスト形式');

最後に画像の追加
以下の5つの画像をnucleus/imagesに追加
20061105-button-pre.gif 20061105-button-entities.gif 20061106-button-ullist.gif 20061106-button-nolist.gif 20061106-button-dtlist.gif
こんな感じになります。
20080426-WS000003.JPG

未来投稿記事のコメントもリスト表示

スケジュール管理に未来投稿記事も表示できるようにしたんですが、未来投稿記事にコメントがあった場合、通常だとコメントリストには表示されません。そこで、未来投稿記事のコメントもリスト表示できるように変更しました。
コメントリストはNP_Comment Tree バージョン: 2.1を使ってますので、
NP_CommentTree.phpの173行目を以下のように変更します。

$item =& $manager->getItem($latest_itemid[$i],0,0);
↓
$item =& $manager->getItem($latest_itemid[$i],1,1);

Nucleusのカテゴリーの順番入れ替え

自宅サーバー構築メモのカテゴリーの順番を入れ替える必要があったのでググッてみたらNucleus(JP)Forumに修正方法が書かれてました。
【BLOG.php】を編集します(v2.4)

636行目付近の
$data['self'] = $CONF['Self'];
この部分の下に以下を追加します
$data['catname'] = strip_tags($data['catname']);
1138行目の
function parse_category() { echo $this->currentItem->category; }
を下記のように編集します
function parse_category() { echo strip_tags($this->currentItem->category); }

これでカテゴリーの名前の前に<00>、<01>等の数字を入力することで、順番を自由に設定できます。
v3.31SP1 の場合
【BLOG.php】

658行目付近の
$data['self'] = $CONF['Self'];
この部分の下に以下を追加します
$data['catname'] = strip_tags($data['catname']);

【ITEMACTIONS.php】

153~155行目の
function parse_category() {
echo $this->currentItem->category;
}
を下記のように編集します
function parse_category() {
echo strip_tags($this->currentItem->category);
}

Nucleus バージョン3.3 にアップグレード

このブログは Nucleus を使ってますが、Nucleus バージョン3.3 日本語版がリリースされましたので、アップグレードしました。
v3.3 の主な機能は以下の通り。
* コメントフォームのメールアドレス欄とURLの分離
* if 文の拡張
* カスタムスキンパーツ
* 自動ドラフト保存
* Atom 1.0 対応
* SpamCheck イベントがコア組み込みに
* セキュリティ関連の強化
などです。
アップグレード手順は以下のとおりです。
1)パッケージのダウンロード
フルパッケージ版ではなく、v3.24からアップグレードしますのでアップグレード用パッケージ「upgrade3.3_ja_euc.zip」をダウンロードします。
2)バックアップの作成
これまで使用していたデータベースを壊したりすることは無いようですが、念のため、データベースと config.php のバックアップをとっておきます。
3)ファイルのアップロード
コアファイル等いくつかのファイルを変更してますので、アップロードする前にそれぞれのバックアップファイルをとり、SSHで上書きアップロードします。更新後、変更してた箇所をなおします。
4)アップグレードスクリプトの実行
アップグレードスクリプトのディレクトリーにアクセスして、アップグレードスクリプトを実行します。
http://yokensaka.com/blog/nucleus/upgrades/index.php
実行すべきアップグレード手順が以下のように表示されますので、これを実行します。これで v3.3用のデータベースが構築されます。
20070511-nucleus_v3.3_01.gif
20070511-nucleus_v3.3_02.gif
20070511-nucleus_v3.3_03.gif
5)最後にセキュリティリスクを避けるため、upgrades/ ディレクトリは削除します。
6)手動変更
ログイン用のフォームや、(ログインしてないときの)コメントフォームが乱れる場合は、使用してるスキンの css に下記を追加することで、きれいに並ぶようになりようです。

div.loginform .formfield, div.commentform .formfield {
display: block;
} 

テンプレートで、日付のフッターを使用してる場合、こちらのBLOG.zipと入れ替える必要があるようです。