生存疾走更新

生存を目標に 仕事に進行中。1日1回以上更新、1日1冊以上読書!.....は現在休息中。

ブログタイトルの文字・色を変えるだけであたふたーブログタイトルの色を変更

ブログを変えて見やすいもの、好みのものにしようとしていろいろやってみました。

こんな時ネットは本当に頼りになります。

wepli-dot2.hatenablog.com

matoyomi.hatenablog.com

q.hatena.ne.jp

customtemplate.blog112.fc2.com

kyabana.hatenablog.jp

調べていって分かるのは「CSSコードを書くこと」。

まず、CSSって何なんだろろうか?

これもネットに頼ります。

CSSとは?-CSSの基本

うん、大体わかった(絶対わかってない)。

さ、次はこれをどこに書くかですね。

はてなブログの場合どこにあるのでしょうか。

お、あった。「デザイン」の「デザインCSS」です。(数分間かかったことは秘密です)

ここに習ったコードを書き込むだけ。

タイトルを変えるので #title {color: 色の名前;} を書くと。以外と簡単。

......

全然変わりません。Proじゃなきゃダメなんですか?

試しにブログ説明文の変更をやってみます。

#blog-description {color: midnightblue;}

ちゃんと変わります。

大きさやフォントの指定だって出来る。

なのに色だけ変わらない。

タイトルの色だけ変わらない。

途方にくれながら一つのサイトに出会います。

www.task-notes.com

ここに書いているように、フッタのHTMLにコードを入力していきます。

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$('#title>a').html('<span style="color:green;">自</span>由仕事探求ブログ');
</script>

 すると、確かに変わる。

ここから全部変えるにはどうするか。少しいじるだけですね。

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
$('#title>a').html('<span style="color:green;">自由仕事探究ブログ');
</script> 

 これで全部緑に変わります。他の色にしたければ"green"の部分を好きな色にかえるだけです。

WEB色見本 原色大辞典 - HTMLカラーコード

これでどうであれタイトル色の変更は出来ました。

(この記事が更新される頃はただの黒に戻っています。まだ少し迷走中)

まあ、更新の際1度黒くなって読み込む時に変更した色が付くのはどういうことなのかという疑問は残ります

これはこれで勉強していきます。そのためのjQuery(ジェイ・クエリー)を学ぶことになるのかも。

 

デザインCSSの部分だけで変えられたら楽だったのですが、何のせいか別の手を使うことになってしまいました。

こういった単純にうまくいかなかったことに関してはブログ記事にしていきたいと思います。