路線テンプレートボックスとは、主に鉄道路線の情報を掲載するためのテンプレートです。
テンプレートの使い方
- 該当の編集ページを開く。
- 【htmlエディタの有効と無効を切り替える】をクリック。
- 編集したい記事にソースコードをコピー。
- 【<h2>概要</h2>】のあとに、コピーしたソースコードをペーストする。
- 再度【htmlエディタの有効と無効を切り替える】をクリック。
- 右に出てきたボックス内の情報をお好みで編集。(改行したいときはShift押しながら)
- 【投稿内容を実際に表示してみる】をクリックし確認する。
- 完了
もし失敗したら?
使い方とソースコード
- 背景色を変えるには、4か所あるbackground: linear-gradient(#89a1ad, #edffff, #89a1ad);の部分を変更します。ここのソースコードには日比谷線のものを仮に設定していますが、路線によって修正してください。
- #89a1ad, #edffff, #89a1adがそれぞれ開始色、中間色、終了色です。開始色と終了色はラインカラーを、中間色はラインカラーのRGBにそれぞれ100ずつ足したくらい(最大値は255)の色が良いでしょう。
例えば丸ノ内線のカラーコード#e60012
はRGBに直すとrgb(230, 0, 18)
なので、rgb(255, 100, 118)
すなわち#ff6476
となります。カラーコードとRGBはGoogle検索で変換できます。
この場合、background: linear-gradient(#e60012, #ff6476, #e60012);はこのようになります。 - メモ帳やワード、ニコニコ大百科HTMLエディタなどの置換機能を使うと簡単です。
- #89a1ad, #edffff, #89a1adがそれぞれ開始色、中間色、終了色です。開始色と終了色はラインカラーを、中間色はラインカラーのRGBにそれぞれ100ずつ足したくらい(最大値は255)の色が良いでしょう。
- 写真はニコニコモンズから探して、ここに画像を貼付と書いている部分のソースコードを<img style="margin-top: -45px;" alt="(写真のタイトル) ニコニ・コモンズより" src="https://deliver.commons.nicovideo.jp/thumbnail/(写真のnc番号)?size=l" width="200" height="200" />と書き換えてください。
| 日比谷線 | |
| 基本情報 | |
|---|---|
| 運行事業者 | |
| 総路線距離 | 20.3km |
| 総駅数 | 22駅 |
| 路線記号 | |
| 軌間 | 1067mm |
| 電化方式 | 直流1500V |
| 架空電車線方式 | |
| 使用車両 | 東京メトロ13000系 東武70000系 |
| 最高速度 | 80km/h |
| 部分開業日 | 1961年3月28日 (南千住駅-仲御徒町駅) |
| 全線開業日 | 1964年8月29日 |
| 備考 | |
| 路線テンプレート | |
<div style="margin: 0px 0px 0.5em 0.5em; border: 1px solid #999; padding: 4px; float: right; background-color: #ffffff;"> <table width="208" style="font-size: 13px; background-color: white; color: #333; text-align: center;"> <tbody> <tr><td style="border: 1px solid #fff; font-weight: bold; color: #000; font-size: 16px; background: linear-gradient(#89a1ad, #edffff, #89a1ad);" colspan="2"> ○○線</td></tr> <tr><td style="border: 1px solid #fff; font-size: medium; vertical-align: middle;" colspan="2"> <div style="overflow: hidden; height: 110px;">ここに画像を貼付</div></td></tr> <tr><th style="background: linear-gradient(#89a1ad, #edffff, #89a1ad); padding: 1px; border: 1px solid #ffffff; vertical-align: middle; color: #000;" colspan="2">基本情報</th></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">運行事業者</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> --</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">総路線距離</th> <td style="border: 1px solid #fff; text-align: left; padding: 1px;"> ---km</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">総駅数</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> --駅</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">路線記号</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> --</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">軌間</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> ----mm</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;" rowspan="2">電化方式</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> ----V</td></tr> <tr><td style="border: 1px solid #fff; padding: 1px; font-size: 12px; text-align: left;"> 架空電車線方式/第三軌条方式</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">使用車両</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> ----系</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">最高速度</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> --km/h</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">部分開業日</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> yyyy年mm月dd日<br /> (○○駅-△△駅)</td></tr> <tr><th style="border: 1px solid #fff; background: linear-gradient(90deg, #cccccc, #f5f5f5, #cccccc); color: #000000; padding: 1px; width: 75px; vertical-align: top;">全線開業日</th><td style="border: 1px solid #fff; text-align: left; padding: 1px;"> yyyy年mm月dd日</td></tr> <tr><th style="color: #000; background: linear-gradient(#89a1ad, #edffff, #89a1ad); padding: 1px; border: 1px solid #ffffff; vertical-align: top;" colspan="2">備考</th></tr> <tr><td style="border-color: white; border-style: solid; padding: 1px; font-size: 12px; text-align: left;" colspan="2"> <ul><li>-</li></ul></td></tr> <tr><td style="color: #000; font-size: 10px; background: linear-gradient(#89a1ad, #edffff, #89a1ad); padding: 1px; border: 1px solid #ffffff; vertical-align: top;" colspan="2"> 路線テンプレート</td></tr> </tbody></table></div>
関連項目
親記事
子記事
- なし
兄弟記事
- アナウンサーテンプレートボックス
- 映画テンプレートボックス
- 駅テンプレートボックス
- 化合物テンプレートボックス
- 楽曲テンプレートボックス
- 競技場テンプレートボックス
- 行政区画テンプレートボックス
- 芸人テンプレートボックス
- 原神テンプレートボックス
- ゲームソフトテンプレートボックス
- サッカー選手テンプレートボックス
- 政治家テンプレートボックス
- 政党・政治団体テンプレートボックス
- 声優テンプレートボックス
- ゾイドテンプレートボックス
- 大学テンプレートボックス
- テニス選手テンプレートボックス
- テレビ番組テンプレートボックス
- 道路テンプレートボックス
- 独立リーグのプロ野球選手テンプレートボックス
- ドラゴンクエストのモンスターテンプレートボックス
- ネット配信者テンプレートボックス
- 俳優テンプレートボックス
- プロサッカークラブテンプレートボックス
- プロ野球球団テンプレートボックス
- プロ野球選手テンプレートボックス
- 漫画・アニメテンプレートボックス
- メジャーリーグベースボール選手テンプレートボックス
- モンスターハンターのモンスターテンプレートボックス
▶もっと見る
- 1
- 0pt


