独自レイアウトでモリサワフォントを使用するためのWebフォントのCSS設定方法
Jimdoの有料版から日本語フォントのトップメーカーである株式会社モリサワのフォントを使用することができますが、独自レイアウト、旧レイアウト(2014年8月以前にJimdoに登録された方が使用できる)、使用できるのは、見出し部分のみです。
せっかくモリサワのフォントを使用できるのに、もったいないですよね。
今回はCSSを使用して、本文などにもフォントを使用できる設定方法をご紹介します。
今回はCSSという専門知識を必要としますがコピーペーストで使用できる部分がほとんどですので「CSSなんてまったくわからない」という方もぜひお試しください。
※今回ご紹介する内容はJimdoの有料版をご契約中の方を対象としています
使用できるモリサワフォントの種類
JimdoPro:15書体
JimdoBusiness:176書体
WebフォントをCSSで設定
CSSが得意の方は下記のコードを参考にカスタマイズしていただけますと幸いです。
セレクタ { font-family: "フォント名※英字","typesquare" }
typesquareという指定は、株式会社モリサワが提供するインターネットを介してフォントを読み込むのに必要なものです。
CSSが苦手、初めての方は下記のコードを使用して、すこし手を加えるだけで、見出し以外の全般のフォントを変更できます。
「フォント名※英字」の部分を後述のフォント名に書き換えてご利用ください。
p,li,td, figcaption { font-family: "フォント名※英字","typesquare" !important }
「p」や「li」などは、フォントを変更するテキストの種類を指定しています。
- p … 「文章」「写真付き文章」項目などで挿入したテキスト全般
- li …「番号なしリスト」設定などリスト形式のテキスト
- td …「表」項目で挿入したテキスト
- figcaption …「写真」項目などで指定したキャプションのテキスト
※不必要な指定は削除してください
CSSをホームページに適用する方法
独自レイアウトをご利用中の方は「レイアウト」メニューの「独自レイアウト」から「CSS」を選択してください。入力欄のお好きな部分にCSSを追記して適用できます。
旧レイアウトをご利用の方は「設定」メニューの「ヘッダー部分を編集」を選択してください。入力欄のお好きな箇所に下記のように追加して適用できます。
<style>
p,li,td, figcaption { font-family: "フォント名※英字","typesquare" !important }
</style>
フォント名
Jimdo Proで使用できるフォント
フォント名 | CSSで指定するフォント名 |
---|---|
じゅん 201 | Jun 201 |
ゴシックMB101 L | Gothic MB101 Light |
ナウ-MM | NOW-MM |
ナウ-GM | NOW-GM |
フォーク R | Folk Regular |
リュウミン R-KL | Ryumin Regular KL |
新丸ゴ R | Shin Maru Go Regular |
見出ゴMB31 | Midashi Go MB31 |
見出ミンMA31 | Midashi Min MA31 |
正楷書CB1 | Sei Kaisho CB1 |
丸フォーク R | Maru Folk Regular |
太ゴB101 | Futo Go B101 |
太ミンA101 | Futo Min A101 |
教科書ICA R | Kyoukasho ICA Regular |
新ゴ R | Shin Go Regular |
Jimdo Businessで使用できるフォント
フォント名(日本語) | フォント名(英字) |
---|---|
リュウミン L-KL | Ryumin Light KL |
リュウミン R-KL | Ryumin Regular KL |
リュウミン B-KL | Ryumin Bold KL |
黎ミン L | Reimin Light |
黎ミン R | Reimin Regular |
黎ミン B | Reimin Bold |
太ミンA101 | Futo Min A101 |
見出ミンMA1 | Midashi Min MA1 |
見出ミンMA31 | Midashi Min MA31 |
秀英明朝 L | Shuei Mincho L |
秀英明朝 M | Shuei Mincho M |
秀英明朝 B | Shuei Mincho B |
秀英初号明朝 | Shuei ShogoMincho |
秀英初号明朝 撰 | Shuei ShogoMincho Sen |
秀英横太明朝 M | Shuei Yokobuto Min M |
秀英横太明朝 B | Shuei Yokobuto Min B |
凸版文久明朝 R | Toppan Bunkyu Mincho R |
光朝 | Kocho |
font-family: A1明朝 | A1 Mincho |
リュウミン L-KL JIS2004 | Ryumin Light KL JIS2004 |
リュウミン R-KL JIS2004 | Ryumin Regular KL JIS2004 |
リュウミン B-KL JIS2004 | Ryumin Bold KL JIS2004 |
黎ミン L JIS2004 | Reimin Light JIS2004 |
黎ミン R JIS2004 | Reimin Regular JIS2004 |
黎ミン B JIS2004 | Reimin Bold JIS2004 |
新ゴ L | Shin Go Light |
新ゴ R | Shin Go Regular |
新ゴ B | Shin Go Bold |
ゴシックMB101 L | Gothic MB101 Light |
ゴシックMB101 R | Gothic MB101 Regular |
ゴシックMB101 B | Gothic MB101 Bold |
中ゴシックBBB | Gothic Medium BBB |
太ゴB101 | Futo Go B101 |
見出ゴMB1 | Midashi Go MB1 |
見出ゴMB31 | Midashi Go MB31 |
秀英角ゴシック金 L | Shuei KakuGo Kin L |
秀英角ゴシック金 B | Shuei KakuGo Kin B |
秀英角ゴシック銀 L | Shuei KakuGo Gin L |
秀英角ゴシック銀 B | Shuei KakuGo Gin B |
じゅん 101 | Jun 101 |
じゅん 201 | Jun 201 |
じゅん 34 | Jun 34 |
新丸ゴ L | Shin Maru Go Light |
新丸ゴ R | Shin Maru Go Regular |
新丸ゴ B | Shin Maru Go Bold |
ソフトゴシック L | Soft Gothic Light |
ソフトゴシック R | Soft Gothic Regular |
ソフトゴシック B | Soft Gothic Bold |
秀英丸ゴシック L | Shuei MaruGo L |
秀英丸ゴシック B | Shuei MaruGo B |
フォーク R | Folk Regular |
フォーク M | Folk Medium |
フォーク B | Folk Bold |
丸フォーク R | Maru Folk Regular |
丸フォーク M | Maru Folk Medium |
丸フォーク B | Maru Folk Bold |
カクミン R | Kakumin Regular |
カクミン M | Kakumin Medium |
カクミン B | Kakumin Bold |
解ミン 宙 R | Kaimin Sora Regular |
解ミン 宙 M | Kaimin Sora Medium |
解ミン 宙 B | Kaimin Sora Bold |
解ミン 月 R | Kaimin Tsuki Regular |
解ミン 月 M | Kaimin Tsuki Medium |
解ミン 月 B | Kaimin Tsuki Bold |
モアリア R | Moaria Regular |
モアリア B | Moaria Bold |
シネマレター | Cinema Letter |
トーキング | Talking |
タカモダン | Takamodern |
竹 L | Take Light |
竹 M | Take Medium |
竹 B | Take Bold |
トンネル 細線 | Tunnel Tightline |
トンネル 太線 | Tunnel Wideline |
明石 | Akashi |
徐明 | Jomin |
那欽 | Nachin |
くもやじ | Kumoyaji |
ハルクラフト | Harucraft |
プリティー桃 | Pretty Momo |
はるひ学園 | Haruhi Gakuen |
すずむし | Suzumushi |
新ゴ シャドウ | Shin Go Shadow |
新ゴ エンボス | Shin Go Emboss |
新ゴ ライン | Shin Go Line |
新丸ゴ シャドウ | Shin Maru Go Shadow |
新丸ゴ エンボス | Shin Maru Go Emboss |
新丸ゴ ライン | Shin Maru Go Line |
正楷書CB1 | Sei Kaisho CB1 |
新正楷書CBSK1 | Shinsei Kaisho CBSK1 |
欧体楷書 | Outai Kaisho |
楷書MCBK1 | Kaisho MCBK1 |
教科書ICA L | Kyoukasho ICA Lig |
教科書ICA R | Kyoukasho ICA Regular |
教科書ICA M | Kyoukasho ICA Medium |
角新行書 L | Kakushin Gyousho Light |
角新行書 M | Kakushin Gyousho Medium |
隷書E1 | Reisho E1 |
隷書101 | Reisho 101 |
陸隷 | Likurei |
勘亭流 | Kanteiryu |
ひげ文字 | Higemoji |
UD黎ミン L |
UD Reimin Light |
UD黎ミン R | UD Reimin Regular |
UD黎ミン B | UD Reimin Bold |
UD新ゴ L | UD Shin Go Light |
UD新ゴ R | UD Shin Go Regular |
UD新ゴ B | UD Shin Go Bold |
UD新丸ゴ L | UD Shin Maru Go Light |
UD新丸ゴ R | UD Shin Maru Go Regular |
UD新丸ゴ B | UD Shin Maru Go Bold |
UD新ゴ コンデンス90 L | UD Shin Go Conde90 L |
UD新ゴ コンデンス90 R | UD Shin Go Conde90 R |
UD新ゴ コンデンス80 L | UD Shin Go Conde80 L |
UD新ゴ コンデンス80 R | UD Shin Go Conde80 R |
UD新ゴ コンデンス70 L | UD Shin Go Conde70 L |
UD新ゴ コンデンス70 R | UD Shin Go Conde70 R |
UD新ゴ コンデンス60 L | UD Shin Go Conde60 L |
UD新ゴ コンデンス60 R | UD Shin Go Conde60 R |
UD新ゴ コンデンス50 L | UD Shin Go Conde50 L |
UD新ゴ コンデンス50 R | UD Shin Go Conde50 R |
学参 常改リュウミン L-KL | GJ Ryumin Light KL |
学参 常改リュウミン R-KL | GJ Ryumin Regular KL |
学参 常改リュウミン B-KL | GJ Ryumin Bold KL |
学参 常改新ゴ L | GJ Shin Go Light |
学参 常改新ゴ R | GJ Shin Go Regular |
学参 常改新ゴ B | GJ Shin Go Bold |
学参 常改中ゴシックBBB | GJ Gothic Medium BBB |
学参 常改太ゴB101 | GJ Futo Go B101 |
学参 常改じゅん 34 | GJ Jun 34 |
学参 常改じゅん 501 | GJ Jun 501 |
学参 常改新丸ゴ L | GJ Shin Maru Go Light |
学参 常改新丸ゴ R | GJ Shin Maru Go Regular |
学参 常改新丸ゴ B | GJ Shin Maru Go Bold |
学参 常改教科書ICA L | GJ Kyoukasho ICA Light |
学参 常改教科書ICA R | GJ Kyoukasho ICA Regular |
ヒラギノ明朝 W3 JIS2004 | Hiragino Mincho W3 JIS2004 |
ヒラギノ明朝 W6 JIS2004 | Hiragino Mincho W6 JIS2004 |
ヒラギノ角ゴ W3 JIS2004 | Hiragino Kaku Gothic W3 JIS2004 |
ヒラギノ角ゴ W6 JIS2004 | Hiragino Kaku Gothic W6 JIS2004 |
ヒラギノ丸ゴ W4 JIS2004 | Hiragino Maru Gothic W4 JIS2004 |
ナウ-MM | NOW-MM |
ナウ-MB | NOW-MB |
ナウ-GM | NOW-GM |
ナウ-GB | NOW-GB |
font-family: G2サンセリフ-B | GSanSerif-B |
font-family: G2サンセリフ-U | GSanSerif-U |
ぶらっしゅ | Brush-U |
ぽっくる | Pokkru-B |
篠-M | Shino-M |
篠-B | Shino-B |
羽衣-M | Hagoromo-M |
羽衣-B | Hagoromo-B |
font-family: TB古印体 | Kointai-M |
日活正楷書体 | NikkatsuSeiKai-L |
花胡蝶-L | HanaKocho-Lt |
花胡蝶-M | HanaKocho-Md |
花胡蝶-B | HanaKocho-Bd |
花蓮華-L | HanaRenge-Lt |
花蓮華-M | HanaRenge-Md |
花牡丹-DB | HanaBotan-DB |
font-family: TBUDゴシック SL | TBUDGothic SL |
font-family: TBUDゴシック R | TBUDGothic R |
font-family: TBUDゴシック B | TBUDGothic B |
font-family: TBUD丸ゴシック SL | TBUDRGothic SL |
font-family: TBUD丸ゴシック R | TBUDRGothic R |
font-family: TBUD丸ゴシック B | TBUDRGothic B |
font-family: TBUD明朝 M | TBUDMincho M |
font-family: TBUD明朝 H | TBUDMincho H |
font-family: UDタイポス58 | UDTypos58 |
font-family: UDタイポス510 | UDTypos510 |