2013年5月31日金曜日

Bloggerウィジェット(Widget)のPageのフォント指定CSS

新しい記事 以前の記事
ブログ自体のフォント指定CSSは、
簡単にFont-familyで指定可能でした。

ですが、
私のブログでは記事タイトルの上部に、
pageウィジェット?ガジェット?を追加してあります。
(というか元々追加されていました。)

そこのフォントだけは、
Font-familyCSS指定では変わりませんでした。

数日間四苦八苦(@Д@; アセアセ・・・。

やっとの思いでCSSにて設定ができました。




結論から言うと、

要素の検証にて、該当する部分のclass?id?が判明しました。


ε=(・ρ・*) フゥ

最初からそうしろよ!!
って話しかも…。
(でも、そう言わんといてぇ~( 」´0`)」)


以前は(以下試してみたこと)、

1.HTML編集画面からid=PageLists1だったので、

CSSにて、
div#PageLists1 {
font-family: "ヒラギノ角ゴ Pro W3", "meiryo","メイリオ", "MS Pゴシック", Sans-serif;
}


とか、

2.ウィジェット内のを更に追跡してみると、

<span id=main~>とかいう部分を見つけたので、
.main {
font-family: "ヒラギノ角ゴ Pro W3", "meiryo","メイリオ", "MS Pゴシック", Sans-serif;
}


とか

3.HTML編集の<skin>…</skin>内にデフォルトで以下の様な記述があった為、


<Group description="Tabs Text" selector=".tabs-inner .widget li a">
     <Variable name="tabs.font" description="Font" type="font"
         default="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
     <Variable name="tabs.text.color" description="Text Color" type="color" default="#999999" value="#ffffff"/>
     <Variable name="tabs.selected.text.color" description="Selected Color" type="color" default="#000000" value="#ffffff"/>
   </Group>

ここの中のFontの種類が記載してある所
default="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif" value="normal normal 14px Arial, Tahoma, Helvetica, FreeSans, sans-serif"/>
"ヒラギノ角ゴ Pro W3", "meiryo","メイリオ", "MS Pゴシック", Sans-serif

とかを追加したりしてみたりしていました。
ひらがながあるとエラーを吐くので、
meiryoだけ追加してみたり…。

かなりのバカさ加減なことをしていました。

(@Д@; アセアセ・・・


やっと、
ページ部分のタイトル部分のフォントを指定するclass要素?がわかりました。

【結論】:備忘録とページのタイトルのフォント指定はどうするのかなぁ?

という方の為に記事として残しておきたいと思います。

.tabs-inner .widget li a {
font: normal normal "ヒラギノ角ゴ Pro W3", "meiryo","メイリオ", "MS Pゴシック", Sans-serif;
}

とCSSに追加するだけです…。

フォントサイズを指定したい場合は、

font: normal normalのあとに14pxとか追加すれば、
フォントサイズを指定することができます。
(できました。)



その他関連


0 件のコメント:

コメントを投稿

次の投稿 前の投稿 ホーム

Related Posts Plugin for WordPress, Blogger...