差分

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

--- dokuwiki:right_menu [2018/12/05 09:54] – [編集用メニューとページ名の移動] 管理者
+++ dokuwiki:right_menu [2018/12/05 09:55] (現在) – [編集用メニューとページ名の移動] 管理者
@@ 行 1: / 行 1: @@
+====== 📝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>
+==== キャッシュクリア ====
+編集してもページの表示が変わらない場合は、ブラウザのキャッシュにより古いデータを読み込んでいるのでキャッシュをクリアして下さい。