2020年5月16日更新
ティラノスクリプトV502a以降での変更方法に変更しました
デフォルトのフォントを独自のフォントにすることで、作品にオリジナリティが出たり、雰囲気を決めたりすることが出来ます。
今回はティラノスクリプトで独自フォントを使う手順についてメモ書きです。
行うことは全部で3つ。
・フォントを準備する
・font.cssの修正
・Config.tjsの修正
ひとつずつ解説します。
※index.htmlもv502a以降で更新されているので、v502a以降のindex.htmlに差し換えている必要があります
フォントを準備する
まずはフォントを準備します。
フォントは初めはフリーのものを選ぶのがいいと思います。
形式は、ttf、woff、eot、svg形式があれば十分です。
(今回はフォント4形式で設定していますが、全ては必要ないかも知れません)
フォント形式の変換については「フォント形式 変換」などでオンラインで変換出来るサイトが沢山ありますので、そちらを利用するのも手です。
上記形式のフォントを
/data/others
にそのまま入れます。
font.cssの修正
tyrano/css/font.cssの修正を行います。
(V502aより前はtyrano/font.css)
以下はfont.cssの中身です。
@font-face {
font-family: '独自フォント名';
src: url('../../data/others/独自フォント名.eot') format('eot');
url('../../data/others/独自フォント名.woff') format('woff'),
url('../../data/others/独自フォント名.ttf') format('truetype'),
url("../../data/others/独自フォント名.svg#独自フォント名") format("svg");
font-weight:normal;font-style:normal;
}
まず、@font-faceのコメント化を解除して下さい。
そして、上記の様に「独自フォント名」と書かれているのをフォントのファイル名に変更して下さい。ttf、woff、eot、svgとそれぞれ設定して下さい。
参考までにV502aより前は以下の通りにして下さい。
@font-face {
font-family: '独自フォント名';
src: url('../data/others/独自フォント名.eot') format('eot');
url('../data/others/独自フォント名.woff') format('woff'),
url('../data/others/独自フォント名.ttf') format('truetype'),
url("../data/others/独自フォント名.svg#独自フォント名") format("svg");
font-weight:normal;font-style:normal;
}
※V502aと前ではfont.cssの場所が異なるため、階層の記述に注意して下さい。
Config.tjsの修正
data/system/Config.tjsを修正します。
313行目に以下の様なコードがあると思います。
// ◆ 文字の書体
// デフォルトのフォント名を指定します。
// この設定はシステム変数に記録されて、次回起動時に引き継がれるので、
// userFace の設定を変更し、適用したい場合はシステム変数ファイル
// カンマで区切って複数のフォントを指定することができます。その場合は、最初
// の方に書いたフォントが存在すれば、優先されます。
;userFace = 独自フォント名;
;userFace = の後を独自フォント名にして下さい。
以上で、デフォルトのフォントが変更されます。
それではまた!