人力検索はてな
ﾓﾊﾞｲﾙ版を表示しています｡PC版はこちら
i-mobile
はてなﾌﾞﾛｸﾞの文字ﾌｫﾝﾄ変更方法について教えて下さい｡
現在ﾃﾝﾌﾟﾚｰﾄEpicを使っていますが､Naturalの雰囲気が好きで､ﾌｫﾝﾄだけ“Josefin Sans”へ変更したいのですが､方法が分かりません｡
どなたかお詳しい方､教えていただけると嬉しいです｡
どうぞよろしくお願いいたします｡
●質問者: leela
●ｶﾃｺﾞﾘ:ｳｪﾌﾞ制作
○ 状態 :終了
└ 回答数 : 1/1件
▽最新の回答へ
▽1 ● rouge_2008
ﾍﾞｽﾄｱﾝｻｰ

｢Google Fonts｣というWebﾌｫﾝﾄｻｰﾋﾞｽの｢Josefin Sans｣ﾌｫﾝﾄを利用して表示しています｡

｢Natural｣ﾃｰﾏのCSSﾌｧｲﾙの最初の方に次のような記述があります｡

@import 'http://fonts.googleapis.com/css?family=Josefin+Sans:600';

上記をｺﾋﾟｰして､｢ｶｽﾀﾏｲｽﾞ｣ﾀﾌﾞの｢ﾃﾞｻﾞｲﾝCSS｣の欄にﾍﾟｰｽﾄします｡

/* <system section="theme" selected="xxxxx"> */
@import "/css/theme/xxxxx/xxxxx.css";
/* </system> */

/* ここ以降に追加 */

※選択したﾃｰﾏのCSSﾌｧｲﾙを読み込む記述よりも後に記述します｡

さらにﾌｫﾝﾄを適用する為に次の記述を続けて追加します｡

body {
 font-family: 'Josefin Sans', 'Gill Sans', 'Helvetica', 'Arial', 'ﾋﾗｷﾞﾉ角ｺﾞ Pro W3', 'Hiragino Kaku Gothic Pro', 'ﾒｲﾘｵ', Meiryo, 'MS Pｺﾞｼｯｸ', 'MS PGothic', sans-serif;
}

※｢Natural｣ﾃｰﾏと同じ指定内容です｡


※｢Josefin Sans｣は英字ﾌｫﾝﾄですので､漢字･ひらがな･ｶﾀｶﾅなどの日本語には適用されません｡
日本語部分は利用しているPC環境によって､違うﾌｫﾝﾄが適用されて表示されます｡(上記のように指定した場合は､｢ﾋﾗｷﾞﾉ角ｺﾞ Pro W3｣(※前出と同じﾌｫﾝﾄの英語表記｢Hiragino Kaku Gothic Pro｣､｢ﾒｲﾘｵ｣(※前出と同じﾌｫﾝﾄの英語表記｢ Meiryo｣､｢MS Pｺﾞｼｯｸ｣(※前出と同じﾌｫﾝﾄの英語表記｢MS PGothic｣)の優先順で､ｲﾝｽﾄｰﾙされているﾌｫﾝﾄが適用されます｡
おそらくMac環境では｢ﾋﾗｷﾞﾉ角ｺﾞ Pro W3｣で､Windows Vista以降の環境では｢ﾒｲﾘｵ｣で､Windows XP環境では｢MS Pｺﾞｼｯｸ｣で表示されると思います｡)

leelaさんのｺﾒﾝﾄ
rouge_2008様 ご丁寧にどうもありがとうございます！ お陰さまで､ﾌｫﾝﾄ変更出来ました｡日本語に対する解説も詳しくしていただき､なるほどと目が覚めるようでした｡ とても分かりやすかったです！ 本当にどうもありがとうございました｡
rouge_2008さんのｺﾒﾝﾄ
ﾌｫﾝﾄ変更が反映されたと思ったのですが､気になる事があって確認してみたら反映されませんでした｡ ﾌｫﾝﾄのCSSをｲﾝﾎﾟｰﾄする記述は､｢ﾃﾞｻﾞｲﾝCSS｣欄の最初､またはﾃｰﾏのCSSｲﾝﾎﾟｰﾄより先に記述するようにしてください｡(※ﾌｫﾝﾄ指定の変更など､通常のCSSを追加する箇所は変更ありません｡) >|| /* ﾌｫﾝﾄのCSSﾌｧｲﾙをｲﾝﾎﾟｰﾄする記述はここに追加 */ /* <system section="theme" selected="xxxxx"> */ /* または､ﾌｫﾝﾄのCSSﾌｧｲﾙをｲﾝﾎﾟｰﾄする記述はここに追加 */ @import "/css/theme/xxxxx/xxxxx.css"; /* </system> */ /* CSSはここ以降に追加 */ ||< ※結果的に上記回答の内容には一部間違いがあります｡ すみませんでした｡こちらのｺﾒﾝﾄの内容が正しい物になります｡ ※Googleﾌｫﾝﾄを複数使用したい時は､｢@import ?｣を複数記述します｡(ﾌﾞﾛｸﾞﾀｲﾄﾙとその他の場所で違うﾌｫﾝﾄを使いたい場合にどうぞ｡ただし､あまりたくさん使うと読み込みが遅くなります｡) >|| @import url(http://fonts.googleapis.com/css?family=Font1:400); @import url(http://fonts.googleapis.com/css?family=Font2:400); /* <system section="theme" selected="xxxxx"> */ @import "/css/theme/xxxxx/xxxxx.css"; /* </system> */ /* CSSはここ以降に追加 */ ||< ※Googleﾌｫﾝﾄでは｢|｣(ﾊﾟｲﾌﾟ)で区切る方法を示していますが､変更の保存時に自動変換が行われるらしく､ﾊﾟｲﾌﾟ以降は削除されるので使用できません｡(1つ目に記述したﾌｫﾝﾄのみ有効になります｡) ･Getting Started【Specifying font families and styles in a stylesheet URL】より抜粋 https://developers.google.com/fonts/docs/getting_started#Syntax >> To request multiple font families, separate the names with a pipe character (|). For example, to request the fonts Tangerine, Inconsolata, and Droid Sans: >|| http://fonts.googleapis.com/css?family=Tangerine|Inconsolata|Droid+Sans ||< Requesting multiple fonts allows you to use all of those fonts in your page. (But don't go overboard; most pages don't need very many fonts, and requesting a lot of fonts may make your pages slow to load.) <<
leelaさんのｺﾒﾝﾄ
ご丁寧に再度お調べいただいて､どうもありがとうございました！ 微妙に変わったと思ったのですが錯覚だったのでしょうか(笑)､上記設定をし直しましたら劇的に変化しました！大満足です｡ どうもありがとうございました！
関連質問
●質問をもっと探す●

0.人力検索はてなﾄｯﾌﾟ
8.このﾍﾟｰｼﾞを友達に紹介
9.このﾍﾟｰｼﾞの先頭へ
□対応機種一覧
□お問い合わせ
□ﾍﾙﾌﾟ/お知らせ
□ﾛｸﾞｲﾝ
□無料ﾕｰｻﾞｰ登録
□はてなﾄｯﾌﾟ