コンテンツにスキップ

Help:外装の詳細設定

Wikipedia:CSSから転送)

ウィキペディア日本語版ヘルプページです。元文書はメタウィキヘルプです。


ウィキペディア外装(がいそう)とは、サイトを閲覧する際のデザインです。スキン (Skin) とも言われます。ログインしていて、デスクトップモード(パソコン向け表示)で表示している場合、5つのデザインで変更することができます。

さらに、自分だけのデザインを指定したユーザースタイルシート(カスタムCSS)を記述して、ウィキペディア日本語版のサーバで公開するなどして利用できます。このスタイルシートは、カスケーディング・スタイルシート (CSS) の記法にて記述する必要があります。ウィキメディアプロジェクトのサーバに保存すると、スタイルシートに対応したブラウザでログインしていれば何時でも何処でも、あなた好みのデザインでウィキペディア日本語版の記事を読むことができます。これによって他の利用者のデザインに影響を与えることなく、例えば、表示されるリンクの色を変更したり、文字の大きさを変えたりすることができます。

Help:個人設定#外装にも解説があります。外装の機能は、ウィキペディアがシステムとして利用しているMediaWikiのものです。

外装を切り替える

[編集]

日本語版ウィキペディアでは2022年7月の途中までの標準設定であったベクター(2010年版=クラシック、レガシーベクター)のスキンは、ウィキペディア・ユーザービリティ・イニシアティブによる調査を通じて、以前のモノブックのスキンから使いやすさの点で改良されたものです。

2022年7月の途中に導入され標準設定となった「2022年版ベクター」と、以下の4種類、あわせて5種類の外装を使用できます。ログインしていなくても、画像の下のリンクをクリックすることで、「1ページだけ」実際の表示を体験できます。実際に設定を変更するには、ログインしてから、特別:個人設定の「表示」タブにて好みの外装を選択して保存します。この設定は日本語版ウィキペディアのみ適用されます。

2022年版ベクター


他のページで一時的にスキンを変更するには、そのページのURLの末尾に、次を追加します。

  • 普通は: ?useskin=スキン名
  • URLに既にイコールが含まれる時は: &useskin=スキン名

このスキン名はベクター2022はvector-2022、ベクター2010はvector、モノブックはmonobook、タイムレスはtimeless、ミネルバ・ノイエはminerva、ケルンブルーはcologneblue、モダンはmodernです。

問題

[編集]

スキンとブラウザの相性によっては、個人設定へのリンクがクリックできなくなる場合があります。以下のリンクから、別のスキンを選んで設定を保存してください。

ガジェット

[編集]
ダークモードガジェット[1]を適用した状態

ベクター、モノブック、ミネルバ・ノイエ(モバイルビュー含む)をダークモード(黒を基調とした画面表示モード)に変更できるガジェットがあります。個人設定のガジェットタブで有効化できます。

モノブックスキンを黒地に緑に変更できるガジェット

モノブックスキンを黒背景(一般にダークモードと呼ばれる)に緑に変更できるガジェットがあります。詳細はHelp:スキンを黒地に緑へ変更するをご覧ください。

カスタマイズ

[編集]

より細かい設定を行うには、自分でカスケーディング・スタイル・シート (CSS) を編集する必要があります。(一般にユーザースタイルシートと言われる)

設定をウィキメディア財団のサーバに置く場合、あなたが閲覧するためのCSSであるユーザースタイルシート(カスタムCSS)は、プロジェクト別(日本語版ウィキペディアといった)の利用者ページサブページとして保存され、「公開」されます。ログインしている間、各ページを読み込むときに一緒にこのユーザースタイルシートを読み込みます。これにより、標準的な表示スタイルが上書きされます。

ユーザースタイルシートを編集するためのサブページは、どのスキンを使っているかで異なります。下記を参照してください。どのスキンの場合にも適用されるものは、利用者:<利用者名>/common.cssです。これらCSSのページへのリンクは個人設定の「表示」タブに「カスタムCSS」にあります。まだユーザースタイルシートが何も記述されていなければ、リンクは赤く表示されています。なお、ユーザースタイルシートは他人には編集できないので、悪戯されることはありません。

以下は、日本語版ウィキペディアのみで適用される、各外装と関連するファイルへの公開リンクです。自分専用のカスタマイズしたコードは、表の右(カスタムCSS)のリンク先に保存します。

外装 CSS(全利用者 共通) カスタムCSS(自分用)
ベクター2022 (初期設定) MediaWiki:Vector-2022.css 利用者:<利用者名>/vector-2022.css
ベクター2010 MediaWiki:Vector.css 利用者:<利用者名>/vector.css
モノブック MediaWiki:Monobook.css 利用者:<利用者名>/monobook.css
タイムレス MediaWiki:Timeless.css 利用者:<利用者名>/timeless.css
ミネルバ MediaWiki:Minerva.css 利用者:<利用者名>/minerva.css

グローバル利用者ページ同様、メタウィキ(meta.wikiMedia.org)上のmeta:Special:MyPage/global.cssなどに置くとウィキメディア財団の各ウィキで反映されます。

ユーザースタイルシートはカスケーディング・スタイルシート (CSS) という形式で記述する必要があります。この形式については、Cascading Style Sheetsb:CSSウィキブックス内)を参照してください。例えば、全ての訪問済みリンクの色を黄色にするには、以下のように記述します。

a:visited {
	color: #ffff00;
}

また、背景の既定値灰色にしたいなら、このようになります。

body {
	background-color: #cccccc;
}

/**/で囲われた部分にコメントを書けます。この間に書いたものは無視されます。このユーザースタイルシートのページでは、ウィキペディアの一般的なウィキの書式は使えません。また、機能的には他人のユーザースタイルシートをインポートすることも可能ですが、一般的には推奨されません。編集が終わったら「保存」することをお忘れなく。

保存したら、反映するためにページ上部の注意書きに従ってブラウザのキャッシュをクリアしましょう(Wikipedia:キャッシュを消すを参照)。ユーザースタイルシート記述ページを変更しても、それがすぐには反映されない場合があります。その場合には読んでいる記事を読み込み直してください。この方法はブラウザによって違うでしょう。もし、どんな方法を使ってもあなたのユーザースタイルシートが反映されない場合には、記述の仕方が間違っているのかも知れません。よく見直してみてください。

このユーザースタイルシート記述ページは、見かけ上は他の普通の記事(あるいは、普通のウェブページ)と殆ど変わりませんが、ご安心を。スタイルシートとして他の記事に読み込まれる際には、あたかもCSSファイルであるかの様に出力されます。もし、どうしても「自分のユーザースタイルシート記述ページをCSSファイルとして見たい」という方は、保存されたそのページのURLの後ろに&action=raw&ctype=text/cssと追加してみてください。テキスト入力欄に表示されていた部分だけが出力されているはずです。

どのように編集してよいかよく分からないときは、ウィキペディア内で検索することで、他の利用者のCSSを閲覧できます。まずそれを参考に編集していくと良いでしょう。

読み込まれるファイルやクラスの一覧

[編集]

en:Wikipedia:Catalogue of CSS classes(英語)に読み込まれるファイルやクラスの一覧があります。

JavaScript

[編集]

各スキンに対応したJavaScriptは、特にデザインの変更には使われていません。以下の各外装ごとにファイルが用意されていますが、実質何も記述されていないものもあります。全利用者共通ファイルは権限を持っている利用者しか編集できません。

なお、利用者ごとに設定するカスタムJSを用いることで表示や他の機能を変更することもできます。どのスキンの場合にも適用されるものは、利用者:<利用者名>>/common.jsです。こちらも、CSSと同様に公開されます。

下記リンクはウィキペディア日本語版用のリンクです。

外装 JS(全利用者 共通) スキンのカスタムJS(自分用)
ベクター2022 (初期設定) MediaWiki:Vector-2022.js 利用者:<利用者名>/vector-2022.js
ベクター2010 (クラシック) MediaWiki:Vector.js 利用者:<利用者名>/vector.js
モノブック MediaWiki:Monobook.js 利用者:<利用者名>/monobook.js
タイムレス MediaWiki:Timeless.js 利用者:<利用者名>/timeless.js
ミネルバ MediaWiki:Minerva.js 利用者:<利用者名>/minerva.js

関連項目

[編集]

脚注

[編集]