PR PR

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

スポンサーリンク
新着情報
2023.04.09
2023.04.06
2023.04.03
2023.03.19
スポンサーリンク
スポンサーリンク

この記事は2013年5月31日の1年以上前に書かれたものです。現在は状況が異なる可能性がありますのでご注意ください。

記事内に広告が含まれています。

ブログ自体のフォント指定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とか追加すれば、
フォントサイズを指定することができます。
(できました。)

You may choose to prevent this website from aggregating and analyzing the actions you take here. Doing so will protect your privacy, but will also prevent the owner from learning from your actions and creating a better experience for you and other users.

コメント

スポンサーリンク
タイトルとURLをコピーしました