目次

「テンプレート」に戻る

DokuWiki arcticテンプレート

インストール

  1. 拡張機能管理で、「arctic」で検索して、「Arctic Template」をインストール
  2. 管理者メニューの「サイト設定」から、基本の「テンプレート」で「arch」にする


設定方法

既存の設定は変更せず、新しいファイルを作り上書きするようにする。

style.ini

「my_style.css = screen」を追記する。

[stylesheets]
layout.css        = screen
arctic_layout.css = screen
design.css        = screen
arctic_design.css = screen
style.css         = screen
media.css         = screen
arctic_media.css  = screen
_admin.css		    = screen
_linkwiz.css      = screen
_mediaoptions.css = screen
_subscription.css = screen
rtl.css           = rtl
arctic_rtl.css    = rtl
print.css         = print
arctic_print.css  = print
my_style.css      = screen

my_style.css

変更した箇所を既存と同じスタイルで設定する。

/**
 * arctic_layout.css
 **/

div.dokuwiki .logo {
  margin: 0.2em;
  font-size: 200%;
}

/**
 * design.css
 **/
div.dokuwiki h1 {
    color: __text__;
    background-color: inherit;
    font-size: 180%;
    font-weight: normal;
    margin: 0 0 1em 0;
    padding: 0.5em 0 0 0;
    /*border-bottom: 1px solid __border__;*/
    clear: left;
}
div.dokuwiki h2 {
    color: #ffffff;
    background-color: #557697;
    font-size: 160%;
    font-weight: normal;
    margin: 2em 0 1em 0;
    padding: 0.5em 0.5em 0.5em 0.5em;
    /*border-bottom: 2px solid __border__;*/
    clear: left;
}

div.dokuwiki h3 {
    color: __text__;
    background-color: inherit;
    font-size: 140%;
    font-weight: normal;
    margin: 1em 1em 1em 0.5em;
    padding: 0.3em;
    /*border-bottom: 1px solid __border__;*/
    border-top: 5px solid #557697;
    border-bottom: 5px solid #557697;
    border-left: 8px solid #557697;
    border-right: 8px solid #557697;
    clear: left;
}
div.dokuwiki h4 {
    color: __text__;
    background-color: inherit;
    font-size: 130%;
    font-weight: normal;
    margin: 0 0 1em 1em;
    padding: 0.3em;
    border-bottom: 5px solid #557697;
    border-left: 12px solid #557697;
    /*border-bottom: 1px dashed __border__;*/
    clear: left;
}
div.dokuwiki h5 {
    color: __text__;
    background-color: inherit;
    font-size: 130%;
    font-weight: normal;
    margin: 0 0 1em 1.5em;
    padding: 0.2em;
    border-bottom: 3px solid #557697;
    border-left: 5px solid #557697;
    clear: left;
}


設定

style.ini

サイトの幅を固定に変更

__wiki_width__     = "1400px"     <- 84%から変更

リンクの色を変更

; these are used for links #0066CC or #4682B4
__extern__    = "#0066CC"          <-"#436976"
__existing__  = "#0066CC"          <-"#56b04f"
__missing__   = "#ed5353"
__visited__   = "#0066CC"          <- "#436976"

layout.css

ヘッダーで、サイト名を右に、ページ名を左にする。

div.dokuwiki .pagename {
  float: left;            <- leftからrightに変更
  font-size: 200%;
  font-weight: bolder;
  color: __background_alt__;
  text-align: left;
  vertical-align: middle;
}

(略)

div.dokuwiki .logo {
  float: left;            <- rightからleftに変更
  font-size: 220%;
  font-weight: bolder;
  text-align: right;
  vertical-align: middle;
}

arctic_layout.css

div.dokuwiki .logo {
  margin: 0.2em;
  font-size: 200%;    <- 130%から変更
}

arctic_design.css

サイドバーの幅を変更

div.dokuwiki div.left_sidebar {
  float: left;
  width: 20%;       <- 22%から変更
  padding: 0.2em 0.5em 0 0;
  border-right: 1px solid  __border__;
}

div.dokuwiki div.left_page,
div.dokuwiki div.right_page {
  text-align: justify;
  float: left;
  width: 75% !important;    <- 72%から変更
  width: 69%;
  padding: 2%;
}

h1, h2のフォントサイズを変更

/* special headlines */
div.dokuwiki h1 {font-size: 190%; font-weight: normal;}   <- 180%から変更
div.dokuwiki h2 {font-size: 160%; color: #fff}   <- 170%から変更
div.dokuwiki h3 {font-size: 160%; font-weight: normal;}
div.dokuwiki h4 {font-size: 140%; font-weight: normal;}
div.dokuwiki h5 {font-size: 120%; font-weight: bold;}

<code></code>の幅を変更

/* code blocks by indention */
div.dokuwiki pre.code,
div.dokuwiki pre.file {
  /*width: auto !important;*/
  width: 95%;                    <- 98%から変更
  font-size: 100%;
}

design.css

h1,h2,h3,h4,h5の装飾を変更

/* general headline setup */
div.dokuwiki h1 {
    color: __text__;
    background-color: inherit;
    font-size: 100%;
    font-weight: normal;
    margin: 0 0 1em 0;
    padding: 0.5em 0 0 0;
    /*border-bottom: 1px solid __border__;*/
    clear: left;
}
div.dokuwiki h2 {
    color: __text__;
    background-color: #557697;
    font-size: 100%;
    font-weight: normal;
    margin: 2em 0 1em 0;
    padding: 0.3em 0.3em 0.3em 0.3em;
    /*border-bottom: 2px solid __border__;*/
    clear: left;
}
div.dokuwiki h3 {
    color: __text__;
    background-color: inherit;
    font-size: 100%;
    font-weight: normal;
    margin: 1em 0 1em 0;
    padding: 0.2em 0 0.1em 0.2em;
    /*border-bottom: 1px solid __border__;*/
    border-bottom: 2px solid __border__;
    border-left: 10px solid __border__;
    clear: left;
}
div.dokuwiki h4 {
    color: __text__;
    background-color: inherit;
    font-size: 100%;
    font-weight: normal;
    margin: 0 0 1em 0;
    padding: 0.5em 0 0 0;
    border-bottom: 1px solid __border__;
    /*border-bottom: 1px dashed __border__;*/
    clear: left;
}
div.dokuwiki h5 {
    color: __text__;
    background-color: inherit;
    font-size: 100%;
    font-weight: normal;
    margin: 0 0 1em 0;
    padding: 0.5em 0 0 0;
    border-bottom: 1px dotted __border__;
    clear: left;
}

/* special headlines */
div.dokuwiki h1 {font-size: 160%; margin-left: 0px; font-weight: bold;}
div.dokuwiki h2 {font-size: 150%; margin-left: 10px;}  <- 20pxから変更
div.dokuwiki h3 {font-size: 140%; margin-left: 20px; font-weight: bold;}  <- 40pxから変更、border-bottom: none;を削除
div.dokuwiki h4 {font-size: 120%; margin-left: 28px; font-weight: bold;}  <- 60pxから変更、border-bottom: none;を削除
div.dokuwiki h5 {font-size: 100%; margin-left: 33px; font-weight: bold;}  <- 80pxから変更、border-bottom: none;を削除

/* indent different sections */
div.dokuwiki div.level1 { margin-left: 3px; }
div.dokuwiki div.level2 { margin-left: 13px; }   <- 23pxから変更
div.dokuwiki div.level3 { margin-left: 23px; }   <- 43pxから変更
div.dokuwiki div.level4 { margin-left: 30px; }   <- 63pxから変更
div.dokuwiki div.level5 { margin-left: 35px; }   <- 83pxから変更

目次の編集

div.dokuwiki #dw__toc {
  margin: 1.2em 0 0 2em;
  float: right;
  width: 300px;       <- 200px
  font-size: 100%;    <- 80%
  clear: both;
}


favicon.icoの変更

以下を修正する。

arctic/images/favicon.ico


参考





「テンプレート」に戻る