内容へ移動
あちあち情報局
趣味や日曜プログラムなどを書いています
ユーザ用ツール
ログイン
サイト用ツール
検索
ツール
文書の表示
以前のリビジョン
バックリンク
最近の変更
メディアマネージャー
サイトマップ
ログイン
>
最近の変更
メディアマネージャー
サイトマップ
現在位置:
トップページ
»
📝DokuWiki
»
📝DokuWiki サイドバーを右側表示
dokuwiki:right_menu
この文書は読取専用です。文書のソースを閲覧することは可能ですが、変更はできません。もし変更したい場合は管理者に連絡してください。
====== 📝DokuWiki サイドバーを右側表示====== |{{:media:201809:20180922-103545.jpg?200}}| DokuWikiの標準テンプレートは左側にサイドメニューが表示されますが、右側に表示したい場合はスタイルシートを書き換える事変更できます。 ---- <html> <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- respon_0 --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-9251612436023685" data-ad-slot="1409739163" data-ad-format="auto"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </html> ===== 作業手順 ===== 注意事項 * 作業前にサイドバーが左側に表示されていない場合は「[[setting]]」のサイドバー表示を行いサイドバーを表示した状態にして下さい * 念のためシステムのバックアップして下さい * DokuWikiのバージョン・設定・プラグインの利用状況によって変更できない可能性があります(2018-04-22a "Greebo"にて確認) ==== サイドメニューの移動 ==== dokuwikiインストール先の ''lib/tpl/dokuwiki/css/structure.less'' を開き、48行目~付近(行はDokuWikiのバージョンにより変わるかもしれません)にある IDセレクター「''%%#dokuwiki__aside{}%%''」 の''floatプロパティ'' と ''marginプロパティ'' を次のように書き換えます。 <code css> #dokuwiki__aside { width: @ini_sidebar_width; /* ↓ float: left 【変更】 */ float: right; position: relative; display: block; > .pad { /* ↓ margin: 0 1.5em 0 0 ; 【変更】 */ margin: 0 0 0 1.5em ; } } </code> ==== 編集用メニューとページ名の移動 ==== 右サイドメニューの場合は、編集用メニューとページ名は左側に移動させた方が雰囲気がよくなるのでその変更方法です。(サイドメニューだけを右側にしたい場合は変更不要です) 編集用メニューは''lib/tpl/dokuwiki/css/pagetools.less'' を開き、23行目~付近(行はDokuWikiのバージョンにより変わるかもしれません)にある IDセレクター「''%%#dokuwiki__pagetools{}%%''」 の''rightプロパティ'' を次のように書き換えます。 <code css> #dokuwiki__pagetools { @ico-width: 28px; @ico-margin: 8px; @item-width: (@ico-width + @ico-margin + @ico-margin); @item-height: (@ico-width + @ico-margin); position: absolute; /* ↓right: (-1 * @item-width); 【変更】*/ left: (-1 * @item-width); /* on same vertical level as first headline, because .page has 2em padding */ </code> ページ名は''lib/tpl/dokuwiki/css/design.less'' を開き、263行目~付近(行はDokuWikiのバージョンにより変わるかもしれません)にある Classセレクター「''%%.dokuwiki .pageId {}%%''」 の''floatプロパティ'' を次のように書き換えます。 <code css> .dokuwiki .pageId { /* ↓ float: right; 【変更】 */ float: left; margin-right: -1em; </code> ==== キャッシュクリア ==== 編集してもページの表示が変わらない場合は、ブラウザのキャッシュにより古いデータを読み込んでいるのでキャッシュをクリアして下さい。
dokuwiki/right_menu.txt
· 最終更新: 2018/12/05 09:55 by
管理者
ページ用ツール
文書の表示
以前のリビジョン
バックリンク
文書の先頭へ