i2i無料WEBパーツ
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
DOLのフレのnoraさんに、ツリーのプラグインについてご質問されましたので試しにFC2でリンクをツリー表示するプラグインを試してみました。

使用したプラグインは、

ぷらぐいん ごー!ごー!で紹介されています、直感リンクツリーV1.3

です。

まず、FC2でのプラグインのダウンロードから

1.FC2管理ページの環境設定で、『プラグイン設定』をクリックします。
00プラグイン設定
2.共有プラグイン追加をクリックします。
01共有プラグイン追加
3.プラグイン名に『直感リンク』と入力して『検索』ボタンをクリックします。
02直感リンク

4.直感リンクツリーV1.3が表示されますので『詳細』ボタンをクリックします。
03直感リンクフリー


5.次の画面で『ダウンロード』ボタンをクリックします。これで直感リンクツリーのダウンロードは完了です。
04直感リンクフリー2

06直感リンクフリー2

6.環境設定で、『プラグイン設定』をクリックして『直感リンクツリーV1.3』が追加されていることを確認してください。
このとき、プラグインカテゴリ1が直感リンクツリーV1.3となっていますが、適当な名前(リンクツリーとかリンク)とかにお好みで変更して『設定』ボタンをクリックしてください。
07直感リンクフリー2

7.次にリンクを種類ごとに分けていきます。環境設定で、『リンク設定』をクリックすると下記のように現在のリンクが表示されます。
08リンク追加

8.下記のようなリンクが存在したときに、『大航海時代関係』と『MySQL関係』といった種類で整理したいとします。
10リンクの分類前
ツリーのイメージとしてはこんな感じですね。↓
09ツリー

9.まず、『大航海時代関係』の親ツリーを作成します。
リンクの1行目に下記を追加します。サイト名の★から★の間の文字が、親ツリーになります。
URLは適当でOKみたいです。

サイト名:★大航海時代関係★2,0
URL:http://kevinjohnson2.blog69.fc2.com/

12MySQL関係追加

10.次に、リンクの4行目には、下記を追加します。

サイト名:★MySQL関係★1,1
URL:http://www-jp.mysql.com/

13MySQL関係追加

11.これで、設定は完了です。ブログを確認すると下記のようにツリー表示で分類されてリンクが表示されますね。
サイト名のカンマ","の後の数値は、0がツリーを展開して表示、1がツリーを非展開状態で表示することを意味しています。
今回は、『大航海時代関係』を非展開状態で表示させるために、サイト名:★大航海時代関係★2,0としています。
14MySQL関係追加

以下の図が、『大航海時代関係』の親ツリーをクリックした状況です。
サイト名のカンマ","の前の数字は親ツリーにぶら下がるリンクの数です。大航海時代関係には2つのリンクがぶら下がっていますので、★大航海時代関係★2,0を設定しています。

15MySQL関係追加


これで、リンクの設定は完了です。
リンクが多い場合はすっきりしますね^^

12.下記のようにいままでのリンクも表示されたままなので、環境設定の『プラグイン設定』で、リンクの表示するのチェックボックスのチェックをはずして『設定』ボタンをクリックしておくと良いかと思います。

16今までのリンク

17今までのリンク

詳しい設定は、本家のサイトも参考にしてくださいね^^

ぷらぐいん ごー!ごー! 直感リンクツリーV1.3

ぷらぐいん ごー!ごー! 直感カテゴリーツリー
スポンサーサイト
どうも最近、ソースコードが白黒表示になっちゃうなぁとおもったら、テンプレート変更時にcssとjavascriptを読込み忘れていたらしぃ・・・(・_・;)
そんなわけで、google-code-prettifyをの最新版をダウンロードしてきて、ファイル挿入でアップロードし、テンプレートに下記の記述を追加しました。

<link href="http://blog-imgs-22.fc2.com/k/e/v/kevinjohnson2/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://blog-imgs-22.fc2.com/k/e/v/kevinjohnson2/prettify.js"<;/script>


うむ、これでもとにもどったな・・・(汗

prettyprintの設定手順はこんなかんじ。

1)下記のサイトでダウンロードしたjavascriptをファイル挿入でアップロード
2)テンプレートに上記のようにlinkタグとjavascriptタグを追加する
3)テンプレートでbodyにonloadを追加する。<body onload="prettyPrint()">こんな感じ
4)ブログを書くときにソースコードを、<pre class="prettyprint"><pre>で囲めばOK

これだけなんで、楽ですね^^
対応言語もこのくらいありそうなんで十分じゃないかしら・・・。

■対応言語
C and friends, Java, Python, Bash, SQL, HTML, XML, CSS, Javascript, Ruby, PHP, VB, and Awk and Perl and Ruby

google-code-prettify

Javascript code prettifier README
FC2でコンソール風に表示する方法

1)FC2の管理画面の環境設定で【テンプレートの設定】をクリック
2)スタイルシートの編集に以下を追加し更新ボタンをクリック

pre.term {
background-color:#111;
color:#EEE;
}

3)コンソール表示したいブログの記事を<pre class="term"></pre>で囲めばOK。


C:\xampp\php>pear install phpunit/PHPUnit
Did not download optional dependencies: pear/Image_GraphViz, pear/Log, use --alldeps to download automatically
phpunit/PHPUnit requires PEAR Installer (version >= 1.8.1), installed version is 1.7.2
phpunit/PHPUnit can optionally use package "pear/Image_GraphViz" (version >= 1.2.1)
phpunit/PHPUnit can optionally use package "pear/Log"
phpunit/PHPUnit can optionally use PHP extension "pdo_sqlite"
phpunit/PHPUnit can optionally use PHP extension "xdebug" (version >= 2.0.0)
No valid packages found
install failed

C:\xampp\php>


うむーーテンプレートの関係か、右端がきれるわい・・・(つ_・。)
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。