差分

このページの2つのバージョン間の差分を表示します。

--- dokuwiki:customize_dokuwiki_using_include_hooks_and_jquery [2016-12-09 11:21]
Decomo
+++ dokuwiki:customize_dokuwiki_using_include_hooks_and_jquery [2017-01-20 21:01] (現在)
Decomo
@@ 行 4: / 行 4: @@
 DokuWikiのテンプレートには[[https://www.dokuwiki.org/include_hooks|Include Hooks]]と呼ばれる仕組みがある。
-テンプレートディレクトリに指定のHTMLファイルを置くと、生成されるWikiページの所定の場所に、その内容が差し込まれるというものだ。
+テンプレートディレクトリに指定のHTMLファイルを置くと、その内容が生成されるWikiページの所定の場所に差し込まれるという機能だ。
 例えば、''meta.html''なら''<head>''タグの中に展開されるといった具合。
@@ 行 17: / 行 17: @@
 |footer.html|''</body>''タグの直前、ページの最後尾|
-フックの処理はWiki側ではなくテンプレート側で実装されるものなので、規約というよりも紳士協定に近く、テンプレートによっては対応してなかったり、逆に独自のフックを追加している場合もある。詳細は各テンプレートのドキュメント（とコード）で確認されたし。
+フックの処理はWiki側ではなくテンプレート側で実装されるものなので、規約というよりも紳士協定に近い。従ってテンプレートによっては対応してなかったり、逆に独自のフックを追加している場合もある。詳細は各テンプレートのドキュメント（とコード）で確認されたし。
-インクルードフックを使うとテンプレートのコードを弄らずにWikiページをカスタマイズ出来るようになるが、全てのページに対し一律で適用されるため、フック単体ではあまり凝ったことはできない。想定の使われ方としてはフック名の通り、ヘッダやフッタといった静的かつ全ページに適用したい事を記述するのだろう。
+インクルードフックを使うとテンプレートのコードを弄らずにWikiページをカスタマイズ出来るようになるが、全てのページに対し一律で適用されるため、フック単体ではあまり凝ったことはできない。フックのファイル名が表すとおり、ヘッダやフッタといった全ページ共通で内容も位置も静的なコンテンツを挿入するといった事が想定された使われ方だろうか。
 ===== jQueryと組み合わせて使う =====
-だがしかし、jQueryと組み合わせることで一気に夢が広がリング。
+だがしかし、インクルードフックとjQueryを組み合わせて使うことで一気に夢が広がリング。
+このページを見るくらいの人ならjQueryの事は知ってると思うが、念のため簡単に説明すると、ブラウザでHTMLの構造（DOM）を動的に変更するためのJavaScriptライブラリである。
+DOMをイジれるってことはHTMLの記述場所と実際の表示場所を変更できる訳で、つまるところ、Wiki本文内に表示したいHTMLをインクルードフックに“仮置き”しといて、jQueryで後から本文内に移動しちゃおうって寸法。
+例えば、以下のようなインクルードフックを用意する。
+<file html meta.html>
+<script>
+  jQuery(function() {
+    var goto
+    jQuery('h2').after(
+</file>
+<file html pageheader.html>
+<a name="page-top" />
+<div class="goto-page-top">
+  <a href="#page-top">▲ページトップへ</a>
+</div>
+</code>