- 履歴一覧
- 差分 を表示
- 現在との差分 を表示
- ソース を表示
- プラグインの変更箇所/contentsx.inc.php へ行く。
目次
[表示]
変更箇所のまとめ
- 目次タイトルを変更
- 表示・非表示の切替機能を追加
変更の詳細
目次タイトルを変更する
そのままだと"Table of Contents"と英語表記なので普通に"目次"表記に変更する。
if ($html != '') {
$html = '<table border="0" class="toc"><tbody>' . "\n"
. '<tr><td class="toctitle">' . "\n"
- . '<span>' . _('Table of Contents') . "</span>\n"
- . '<span>' . _('目次') . "</span>\n"
表示・非表示の切替機能を追加
ページによっては目次がべらぼうに長くなるので、Javascriptを使った表示・非表示機能を追加する。
WordPressとかだとよくあるあれ。
まずは"目次"表記の横に切替用のボタン (リンク) を追加する。
- . '<span>' . _('目次') . "</span>\n"
+ . '<span>' . _('目次') . '</span><span class="toctoggle">[<a href="#" id="togglelink">表示</a>]</span>' . "\n"
見た目としては [表示] ← こんな感じ。
次に切り替えのためのスクリプトを$htmlの最後に追加する。
一行一行追加していくのがメンドイのでヒアドキュメントを使う。
. $html
. "</td></tr>\n"
. "</tbody></table>\n";
+ $html .= <<<EOD
+ <script type="text/javascript">
+ $('a[href="#"]').click(function(){
+ return false;
+ });
+ $('#togglelink').on('click', function () {
+ if ($(this).text() === '表示') {
+ $(this).text('非表示');
+ $(".toclist").show();
+ } else {
+ $(this).text('表示');
+ $(".toclist").hide();
+ }
+});
+</script>
+EOD;
}
return $html;
} while (false);
今の所非表示状態がデフォルトにしてある。
そして基本的に各ページに一個しか設置しないため、複数個置いたときの事は考えていない。
複数個置く場合はregionみたいにグローバル変数でカウントしてid振るか、もしくは2個以上設置したらエラー吐けばいいのかな?
Plugin/contentsx.inc.php - Sonots' PukiWiki プラグイン
質問や指摘などあればどうぞ。
コメントはありません。 コメント/プラグインの変更箇所/contentsx.inc.php