テンプレートの作成と利用

提供:八中・小山台デジタルアーカイブ
ナビゲーションに移動 検索に移動

テンプレートとは

 テンプレートとは、いろいろなページで共通に使う「定型文」のことです。
 たくさんのページを作成していると、「これっていつも作っているなぁ」「また繰り返しだ」と思うことがあるでしょう。
 そのようなときにあらかじめ「定型文」を作っておいて、それを再利用する、というのがテンプレートの考え方です。

 利用のパターンには以下の2つがあります。

 1. テンプレートをあちこちのページに置いて、それらの修正は一括で行う。
  あちこちのページに置かれた定型文の修正が一度で行えるので効率が良い。
   → #テンプレートの利用 その1で説明しています。

 2. テンプレートを「定型文例」として貼り付け、それを修正して使う。
  似たような文章を作成するときに、定型文を貼り付けてそれを修正すれば早く完成する。
   → #テンプレートの利用 その2で説明しています。


テンプレートの作成

どちらの利用パターンを使うにしても、まずは元となる「定型文」を作成して、保存しておく必要があります。
「作成」は以下の手順となります。


1. テンプレートを作成する
右上の検索窓に「Template:サンプル名」と入力する。
これで、「サンプル名」という名前のテンプレート作成画面となります。
実際には、定型文の「中身がよく分かる名称」を付けましょう。
編集終了後、下にある「変更を保存」ボタンクリック


2. テンプレートを編集する
一度保存した「テンプレート」を修正する場合は、右上の検索窓に作成済みの「Template:作成したテンプレートの名前」と入力する。
作成済みの「テンプレート」ページが表示される。
編集タブをクリックして、編集を行う。
終了後、下にある「変更を保存」ボタンクリックで、編集内容が保存される。


3. テンプレートを使用しているページから編集する方法
テンプレートを使用しているページを編集モードにして、ページの一番下にある「このページで使われているテンプレート:」をクリック
ページで使用しているテンプレート一覧が下に表示される[1]
編集したいテンプレート名をクリック
テンプレートページが表示される。
「ソースを編集」タブをクリックして、編集を行う。
終了後、下にある「変更を保存」ボタンクリックで、編集内容が保存される。:



テンプレートの利用 その1

以下の説明は、テンプレートをあちこちのページに置いて、それらの修正は一括で行うという使い方です。
1. テンプレート呼び出し
編集しているページで
{{テンプレート名}}
と記入する。
その後、「変更を保存」をクリックすると、テンプレートの内容が呼び出されて表示される。


2. テンプレート内容の変更とその影響
テンプレートの内容変更は、「 2. テンプレートを編集する」で行います。
テンプレートを編集すると、その結果は、同じテンプレートを使用している複数のページに及びます。
多数のページに使用しているテンプレートの編集は慎重に行いましょう。





テンプレートの利用 その2

以下の説明は、テンプレートを「定型文例」として貼り付けて、それを修正して使う場合の方法です。
1. テンプレート内容の貼り付け
テンプレートを使いたいページに、
 {{subst:テンプレート名}} 
と記載。
一番下の「変更を保存」をクリック。
保存することで、「テンプレート名」という名前のテンプレートの「内容」がページに展開される。
「編集モード」にして、中身を修正。


この場合は、「修正した内容は」元のテンプレートには影響しませんし、逆に、元のテンプレートを修正・変更しても、その内容は、こちらのページには反映されません。



2. 「既存のテンプレート」を修正して、「新たなテンプレート」を作成したい場合
「1. テンプレート内容の貼り付け」と同じ方法で、別の新たなテンプレートを作れます。
「テンプレートの作成」の「1. テンプレートを作成する」で、まったく新規の空の「テンプレート」を作成します。
編集画面で、
 {{subst:テンプレート名}} 
と記載。
一番下の「変更を保存」をクリック。
これで「既存のテンプレート」の内容を持った「新名称のテンプレート」ができました。
保存後、「編集モード」にして、「既存の内容」を修正して、「新たな内容のテンプレート」として保存。





  テンプレートの展開テスト

{{subst:年度別一覧}} で、貼り付けとその後の編集を試してみた。


 1921年度 (大正10年度)       1922年度 (大正11年度)       1923年度 (大正12年度)       1924年度 (大正13年度)       1925年度 (大正14年度)
 1926年度 (大正15年度)       1927年度 (昭和 2年度)       1928年度 (昭和 3年度)       1929年度 (昭和 4年度)       1930年度 (昭和 5年度)
 1931年度 (昭和 6年度)       1932年度 (昭和 7年度)       1933年度 (昭和 8年度)       1934年度 (昭和 9年度)       1935年度 (昭和10年度)
 1971年度 (昭和46年度)       1972年度 (昭和47年度)       1973年度 (昭和48年度)       1974年度 (昭和49年度)       1975年度 (昭和50年度)
 1976年度 (昭和51年度)       1977年度 (昭和52年度)       1978年度 (昭和53年度)       1979年度 (昭和54年度)       1980年度 (昭和55年度)
 1981年度 (昭和56年度)       1982年度 (昭和57年度)       1983年度 (昭和58年度)       1984年度 (昭和59年度)       1985年度 (昭和60年度)


うまくできました。




トランスクルージョンについて

テンプレート作成の際の記述方法と似ているのですが、「あるページ」をそのまま持ってきて表示させる「トランスクルージョン」という機能があります。
試しに「色見本」というページをそのまま表示してみます。
以下のように記述すればOK
{{:色見本}}


以下に「色見本」のページがそのまま表示されます。
ごちゃごちゃするので、最初は折り畳んでいます。
「色見本」のページ (最初は折り畳んでいます) 

テキストに色を付ける

テキストや背景 (バックグラウンド)に色を付ける際の参考です。


「色の名前」で指定
 文字の色を指定するには、spanタグのstyle属性に「色名」を記載します。
 例えば、
 <span style="color:red;">赤字</span>
 とすると赤字になります。
 「red」のような「色名」には以下のものがあります。


記述例
 <span style="color:black;">黒</span>
 <span style="color:gray;">灰色</span>
 <span style="color:silver;">銀色</span>
 <span style="background:black; color:white;">白</span>
 <span style="color:blue;">青</span>
 <span style="color:navy;">濃紺</span>
 <span style="color:teal;">青緑</span>
 <span style="color:green;">緑</span>
 <span style="color:lime;">黄緑</span>
 <span style="color:aqua;">水色</span>
 <span style="background:navy; color:yellow;">黄色</span>
 <span style="color:fuchsia;">マゼンタ</span>
 <span style="color:olive;">オリーブ</span>
 <span style="color:purple;">紫</span>
 <span style="color:maroon;">茶色</span>
    脚注:「teal[2]」「fuchsia[3]
表示

    灰色  銀色      濃紺  青緑    黄緑  水色  黄色  マゼンタ  オリーブ    茶色

「白」と「黄色」の文字には、それぞれ「黒:"background:black;"」、「濃紺:"background:navy;"」の背景色を付けています。



その他の色の名前

色の名前にはまだまだあります。例えば、
 <span style="background:lemonchiffon;">浅黄色      </span>

  浅黄色      

 なんて色も出せます。「色名」には、全部で140色あるそうです。
 詳しくはこちらを → 「カラーサンプル」



「色名」に無い色は「16進カラーコード」で指定

 また色を「名前」で指定する代わりに「#F5F5F5」のような16進カラーコードで指定することもできます。
 これを使えば「色名」に無い色「1677万色」が使えます。
 しかし、MediaWikiでは派手な色使いは推奨されませんので、控えめに、そしてスマートに作りましょう!


記入例
 <span style="color:#8D6449">枯茶色</span>
 <span style="color:#FFD900">蒲公英(たんぽぽ)色</span>
 <span style="color:#7058A3">菫(すみれ)色</span>
 背景色を羊羹(ようかん)色に設定
 <span style="background:#383C3C;color:#DBD0E6">白藤色  </span>
表示
 枯茶色
 蒲公英(たんぽぽ)色
 菫(すみれ)色
 背景色を羊羹(ようかん)色に設定
 白藤色  



カラーサンプル

MediaWikiでは派手な色使いは推奨されませんとは言うものの、個性的な色使いをしたい方もいらっしゃるでしょう。
そのような方のために以下に「色名(Color Name)」と「16進カラーコード」の一覧表です。
一覧表を表示するには、下のボタンをクリック

一覧表の表示/非表示



色に関する情報について

「色名」に無い色を使いたい
「色名」に無い色を指定したい場合は、「16進カラーコード」を組み合わせて作成します。
「16進カラーコード」については、以下のリンク先情報を参照ください。


この16進コードはどんな色かな?
「16進カラーコード」に対する実際の色を確認したい場合は、https://www.peko-step.com/tool/tfcolor.html


この色を使いたいが、16進コードは?
逆に、好きな色からカラーコードを知りたい場合は「HTML Color Code」https://html-color-codes.info/japanese/ が便利。


また、「原色大辞典」https://www.colordic.org/ というサイトも参考になります。



質問・ご意見はこちら

お問い合わせ・ご意見のメールはこちら


上記リンクをクリックしてもメールソフトが起動しない場合は、以下のアドレスをコピーしてメールソフトの「宛先」に貼り付けてください。
 【担当者メールアドレス】wiki_admin@koyamadai100.jp




  ←「3. テキスト整形方法について」    ←「4. テキスト編集ツール」    →「6. 【重要】ログアウトに注意!」    →「7. リンク作成方法について」
  ↑ページトップへ     ↑↑「メインページ」の「編集者のためのヘルプ」に戻る    ↑↑「メインページ」トップに戻る

脚注: 

2022年6月6日:直近編集者:Adminkoyama100
TimeStamp:20220606102502


「トランスクルージョン」で持ってきた「ページ」を修正すると、元のページが修正されます。
元のページを変えたくない場合は、「トランスクルージョン」は使わず、「元のページ」の一番上にある「ソースを編集」タブをクリックして、内容を全てをコピーして、こちらに貼り付けます。
ということで、「トランスクルージョン」は、あまり意味なさそうですね。


参考URL
https://ja.wikipedia.org/wiki/%E3%83%88%E3%83%A9%E3%83%B3%E3%82%B9%E3%82%AF%E3%83%AB%E3%83%BC%E3%82%B8%E3%83%A7%E3%83%B3
https://en.wikipedia.org/wiki/Help:Transclusion







質問・ご意見はこちら

お問い合わせ・ご意見のメールはこちら


上記リンクをクリックしてもメールソフトが起動しない場合は、以下のアドレスをコピーしてメールソフトの「宛先」に貼り付けてください。
 【担当者メールアドレス】wiki_admin@koyamadai100.jp




  ←「12. 動画・音声を再生する 」    ←「13. コメント(編集時のみ表示)」    ←「14. Marginを使った表示位置の微調整」    →「16. ファイルアップロードと削除」    →「18. 管理者用ヘルプ」
  ↑ページトップへ     ↑↑「メインページ」の「編集者のためのヘルプ」に戻る    ↑↑「メインページ」トップに戻る



脚注: 

2022年6月6日:直近編集者:Adminkoyama100
TimeStamp:20220606102502