Panda Noir

JavaScript の限界を究めるブログです。

seesaaブログのデザイン変更方法 1/2

seesaaのデザイン変更してみて分かった方法まとめてみました。

始めにいっておきますが、HTMLもしくはCSSが出来ない人はこれ読んでも無駄です。

あと、プログラミング経験あった方がいいと思います。変数とif elseが分かればいいです。

ではまえおきはこのぐらいにして。

変更する方法はいくつかあります。一から作るというのもあります。

でもとても大変です。

今回は既存のデザインの改造ですませたいと思います。

だからまず自分がしたいレイアウトに近いものをダウンロードしてください。

デザイン>PC>デザイン一覧からダウンロードできます。

ダウンロードしたら、それをGoogle ChromeSafariでみてください。

別に他のブラウザでもかまわないと思いますが、IEは無理です。

では、適当にブログのところで右クリックをしてみてください。そして「要素の詳細」をクリックしてください

(若干ブラウザによって表記が変わりますが要素とあったらそれだと思います)。

Chromeだと

chrome.png

Safariだと

safari.png

こんな感じの画面になればOKです。別にソースでもいいのですがこっちの方が分かりやすいので。

ここでclass名を調べたり、実際にbackgroundをいじってみたりしてデザインを考えます。

まとまったら、デザイン>PC>デザイン設定に行き、適用してあるデザインをクリックします。

css.png

こんな画面になればOKです。ここで先ほど調べたclass名やid名を探してスタイルを書き換えて保存を押します。

すると、ブログのデザインが変わってるはずなのでアクセスしてみてください。

変わってないようなら、更新(windowsはctrl+R、macはcommand+Rがショートカットキーです)してみてください。これで変わるはずです。

今回はCSSについて書きました。

次回はHTMLの変更方法について書きたいと思います。

(というか長くなったので分割します。)