====== Bootstrap3 テンプレート ====== ---- template ---- description : Bootstrap を基にした DokuWiki 用テンプレート author : Giuseppe Di Terlizzi email : giuseppe.diterlizzi@gmail.com lastupdate : 2015-08-20 compatible : Detritus, "Ponder Stibbons", Hrun depends : conflicts : # prefix templates by template: similar : screenshot_img: http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template.png?nocache tags : bootstrap html5 navbar sidebar hooks bootswatch themes responsive right-sidebar semantic cookielaw downloadurl : http://github.com/LotarProject/dokuwiki-template-bootstrap3/zipball/master bugtracker : http://github.com/LotarProject/dokuwiki-template-bootstrap3/issues sourcerepo : http://github.com/LotarProject/dokuwiki-template-bootstrap3/ donationurl : https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=9LJDLVSNGYSA2 ---- カスタマイズの自由度が高い Bootstrap を基にした DokuWiki 用テンプレート。 このテンプレートはレスポンシブで全ての機器(携帯・タブレット・デスクトップなど)に対応して設計されています。 私の [[:ja:plugin:bootswrapper|Bootstrap ラッパープラグイン]]と[[:ja:plugin:icons|アイコンプラグイン]]を使用して映像・ユーザー体験は完成します。 ===== 機能 ===== * HTML5 * Bootstrap 3.x を基にしたテンプレート * Glyphicons アイコン * [[#設定|設定管理]]による自由度が高いカスタマイズ * 多くの [[#使用可能なフック|html フック]] * レスポンシブ * サイドバーに対応(**左側**又は**右側**) * 右サイドバーに対応(下記の[[#右サイドバー|注]]を参照) * [[https://bootswatch.com|Bootswatch]] が作成した多くのテーマ * Bootswatch.com テーマのテーマ切替 * 左と右サイドバーの大きさ * [[#Cookie Law Banner Notice]] [[#映像巡回|映像巡回]]を参照して下さい。 ==== プラグインの統合 ==== * [[:ja:plugin:translation|翻訳プラグイン]] * [[:plugin:discussion|議論プラグイン]] * [[:ja:plugin:tags|タグプラグイン]] * [[:ja:plugin:tagging|Tagging プラグイン]] * [[:ja:plugin:publish|公開プラグイン]] * [[:plugin:explain|Explain プラグイン]] * [[:ja:plugin:wrap|Wrap プラグイン - Tabs]] * [[:ja:plugin:bootswrapper|Bootstrap ラッパープラグイン]] ==== 翻訳 ==== * English * Italian * German * Japanese * Spanish * Russian * Simplified Chinese ===== ダウンロードとインストール ====== このテンプレートのインストールには[[:ja:plugin:extension|拡張機能管理]]を使用してください。 DokuWiki でテンプレートをインストールして使用する方法は、[[:ja:template|テンプレート]]を参照して下さい。 ===== 設定 ===== ==== テーマ ==== ^ オプション ^ 説明 ^ デフォルト値 ^ ^ ''bootstrapTheme'' | Bootstrap テーマ \\ (//default// Bootstrap テーマ・//default+optional// Bootstrap が作成したテーマ・//bootswatch// テーマ・//custom// テーマ) | ''default'' | ^ ''bootswatchTheme'' | Bootswatch が作成したテーマ | ''spacelab'' | ^ ''customTheme'' | custom テーマの URL | '''' | ^ ''showThemeSwitcher'' | navbar 内に Bootswatch テーマ用のテーマ切替を表示する | ''0'' | ^ ''hideInThemeSwitcher'' | テーマ切替内で隠すテーマ | | ==== サイドバー ==== ^ オプション ^ 説明 ^ デフォルト値 ^ ^ ''sidebarPosition'' | サイドバーの配置(''left''・''right'') | ''left'' | ^ ''rightSidebar'' | 右サイドバーのページ名 | ''rightsidebar'' | ^ ''leftSidebarGrid'' | 左・右サイドバーの grid クラス\\ ''col-{xs,sm,md,lg}-x'' ([[http://getbootstrap.com/css/#grid|Bootstrap Grids]] マニュアルを参照)| ''col-sm-3 col-md-2'' | ^ ''rightSidebarGrid'' | ::: | ''col-sm-3 col-md-2'' | === 右サイドバー === デフォルトの DokuWiki [[doku>ja:config:sidebar|サイドバー]]サイドバーが有効で ''left'' に配置した場合(''tpl > bootstrap3 > sidebarPosition'' 設定を参照)のみ右サイドバーを表示します。 DokuWiki サイドバーを右側に配置したい場合、''tpl > bootstrap3 > sidebarPosition'' 設定を ''right'' にしてください。 ==== Navbar ==== ^ オプション ^ 説明 ^ デフォルト値 ^ ^ ''inverseNavbar'' | Navbar の色を反転する | ''0'' | ^ ''fixedTopNavbar'' | Navbar を上部に固定する | ''0'' | ^ ''showTools'' | Navbar 内にツールメニューを表示する | ''always'' | ^ ''showUserHomeLink'' | ユーザーのホームページリンクを表示する | ''1'' | ^ ''hideLoginLink'' | Navbar 上のログインボタンを非表示にする。「読取り専用」の DokuWiki サイト(例:ブログ・個人的な Web サイト)には便利です。 | ''0'' | ^ ''individualTools'' | Navbar 上のツールを個々のメニューに分割する | ''0'' | ^ ''showIndividualTool'' | Navbar 上の個々のツールを表示・非表示 | ''user,site,page'' | ^ ''showSearchForm'' | Navbar 上の検索フォームを表示する | ''always'' | ==== セマンティック ==== セマンティックデータへの基本的な対応のために Schema.org マークアップを追加します。 完全に対応するには [[:plugin:semantic|Semantic Plugin]] を利用して下さい。 ^ オプション ^ 説明 ^ デフォルト値 ^ ^ ''semantic'' | semantic データを有効にする | ''0'' | ^ ''schemaOrgType'' | Schema.org の型(''Article'', ''NewsArticle'', ''TechArticle'', ''BlogPosting'')| ''Article'' | ==== 配置 ==== ^ オプション ^ 説明 ^ デフォルト値 ^ ^ ''fluidContainer'' | Enable the fluid container (full-width of page) | ''0'' | ^ ''pageOnPanel'' | Enable the panel around the page | ''1'' | ^ ''tableFullWidth'' | 100% のテーブル幅を有効にする(Bootstrap のデフォルト) | ''1'' | ==== 議論 ==== ^ オプション ^ 説明 ^ デフォルト値 ^ ^ ''showDiscussion'' | ツールメニュー内に議論リンクを表示する | ''0'' | ^ ''discussionPage'' | 議論ページ名(デフォルトは ''discussion:@ID@''。''@ID@'' は現在のページ名に置き換えるプレースホルダー)空の場合リンクは無効になる。 | ''discussion:@ID@'' | ==== Cookie Law Banner Notice ==== ^ オプション ^ 説明 ^ デフォルト値 ^ ^ ''showCookieLawBanner'' | Enable the banner notice on footer | ''0'' | ^ ''cookieLawBannerPage'' | The name of DokuWiki page which contains a brief notice and two buttons for accept all cookies and read the full policy | ''cookie:banner'' | ^ ''cookieLawPolicy'' | The name of DokuWiki page which contains a full policy | ''cookie:policy'' | The Cookie Law Banner Notice add a cookie called "cookieNoticeAccepted" to use in your JavaScript/PHP code (eg. to add Google Analytics only when the user accept the policy). **JavaScript Snippet:** if (DokuCookie.getValue('cookieNoticeAccepted')) { // Your JS code } **PHP Snippet:** if ( ! (get_doku_pref('cookieNoticeAccepted', null) || get_doku_pref('cookieNoticeAccepted', '')) ) { // Your PHP code } ==== その他 ==== ^ オプション ^ 説明 ^ デフォルト値 ^ ^ ''showPageInfo'' | Display the page info (author, etc...) | ''1'' | ^ ''showTranslation'' | [[:ja:plugin:translation|翻訳プラグイン]] ツールバーを表示する。 | ''0'' | ^ ''showBadges'' | Show badge buttons (DokuWiki, Donate, etc) | ''1'' | ^ ''showLoginOnFooter'' | Display a "little" login link on footer. This option is useful when ''hideLoginLink'' is on | ''0'' | ===== テーマのカスタマイズ ===== ''conf/[[:ja:devel:css#ユーザスタイル|userstyle.css]]''(又は''userall.css'')を編集してテーマをカスタマイズします。 Bootstrap3 のテーマは、現在のテーマを識別するための特別なクラスを '''' に提供します。 /** Vanilla Bootstrap Theme */ body.default .page-header { font-weight: 900; } /** Optional Bootstrap Theme */ body.optional .img-responsive { display: inline-block; } /** Custom Bootstrap Theme */ body.custom .btn-success { background-color: green; } /** Lumen - Bootswatch.com theme */ body.lumen .navbar-default { background-color: red; } ===== 使用可能なフック ===== 全てのファイルはテンプレートディレクトリ(例: ''lib/tpl/bootstrap3/'')に置く必要があります。 ^ ファイル名 ^ HTML の挿入場所 ^ ^ ''meta.html'' | HTML '''' の内側。style や metaheader を追加するために使用する。 | ^ ''topheader.html'' | ページの最上部。'''' タグの直後。 | ^ ''header.html'' | 上部の青いバーの上。ページ名と Wiki の題名の下。 | ^ ''navbar.html'' | Navbar の中。リンクを追加するには使用する。(例:
  • Foo
  • )) | ^ ''pageheader.html'' | パンくずリストの下。実際のコンテンツの上。 | ^ ''pagefooter.html'' | 下部の青いバーの上。最終更新日付の下。 | ^ ''footer.html'' | ページの最後。'''' タグの直前。 | ^ ''sidebarheader.html'' | サイドバーの最上部 | ^ ''sidebarfooter.html'' | サイドバーの最下部 | ^ ''social.html'' | ''header.html'' の下。ソーシャルボタン(例:Google+、Twitter、LinkedIn 等)を追加します。 | ^ ''rightsidebarheader.html'' | 右サイドバーの最上部 | ^ ''rightsidebarfooter.html'' | 右サイドバーの最下部 | ===== このテンプレートの使用例 ===== * http://lotar.altervista.org/dokuwiki (メインサイト -- [[http://lotar.altervista.org/dokuwiki/wiki/syntax|構文ページ]]を参照) * https://wiki.freedom-ip.com * http://www.scenic-shop.com/structure * http://garethwilliams.me.uk * http://go.cokr.wo.tc/wiki * http://chester.website * http://www.wolfganglezius.de * http://www.pernias.com * http://support.4ef.de/dokuwiki * http://www.furope.it * http://wiki.cigolla.ch ===== 映像巡回 ===== ^ メインページ | {{http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template.png?400&nocache}} | ^ Navbar | {{http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template-navbar.png?400&nocache}} | ^ Navbar(携帯) | {{http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template-navbar-mobile.png?nocache}} | ^ 目次 | {{http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template-toc.png?nocache}} | ^ 目次(折りたたみ) | {{http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template-toc-collapsed.png?nocache}} | ^ ツールメニュー | {{http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template-tools.png?nocache}} | ^ タグプラグイン | {{http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template-tags.png?nocache}} | ^ 翻訳プラグイン | {{http://lotar.altervista.org/dokuwiki/_media/wiki/template/bootstrap3-template-translations.png?nocache}} | ===== 開発 ===== === 変更履歴 === {{rss>https://github.com/LotarProject/dokuwiki-template-bootstrap3/commits/master.atom 5 author date 1h }} === バグ・機能要望 === [[http://github.com/LotarProject/dokuwiki-template-bootstrap3/issues|バグ追跡システム]]でバグや機能要望を報告してください。 === 既知のバグと問題 === === ToDo・要望一覧 === * ヘッダー内のユーザーアイコンの表示・非表示 * テーマ切替内で bootswatch.com から全部ではなくいくつかのテーマを表示する選択肢がある。 ===== FAQ ===== ===== 議論 ===== [[doku>template:bootstrap3#discussion1|Discussion]] を参照して下さい。