スポンサーサイト

一定期間更新がないため広告を表示しています

| - | | - | - |
オリジナルのレイアウトを作ってみた。
JUGEMでブログを体験してみました。
テンプレートを編集したり、スタイルを、いたずらしたりすることで、とても簡単に、オリジナルのブログが出来そうです。

今日はその体験を 備忘。

このblogサービスには、オリジナルのblogを配布したり、経験豊富な人がいると思うけど、私のやり方は、それと比べて、どうなっているのか、ぜんぜんチェックしてませんけど。

私は、IE6じゃ使いにくいので、firefox の力を借りた。

テンプレートの編集をクリックすると、スタイルシートと、テンプレート編集用のテキストエリアが見える。

私は簡単に済ませたかったので、まず、テキストエディタに、テンプレートの内容を貼り付ける。

次に、CSSのテキストエリアを全てコピーして、貼り付ける。
貼り付ける場所は、先ほどの貼り付けたテンプレートの、headタグの区間内に貼り付ける。
<head>----CSS-----</head>

さて、次の工程は、IE6では出来なかった。

もう一枚のテンプレートファイルをダウンロードする作業だ。

ヘッダー内には、外部のスタイルシートへのリンクがある。
hogehoge.css というファイルだ。
firefox で自分のページを表示して、ソースを表示する。
CSSのアドレスをクリックすると、スタイルシートファイルを保存できる。
保存したら、全て選択して、またコピーする。
さっき、スタイルを貼り付けた近くに貼り付ける。出来れば最初のほうに貼り付ける。
このとき、重複したスタイルが多分いっぱいある。
最後に貼り付けた部分を中心に、スタイルを修正していく。

実際のblogで、変更し始めると、面倒なので、ローカルのパソコンで見ることが出来るようにする。

charsetをEUC-JPに直す。ローカルでも、表示できるようになる。

何でこんなことをやるか、世の中では、テンプレート(つまりHTMLファイル)と、CSSは、別々が常識だけど、作業は、同じファイルでやったほうがとても簡単になるんだ。

blog系は、スタイルシートで見た目を調整するから、数百行もあったりする。
一枚のファイル内だと検索などがとても楽チンだから、私的には、お勧めの方法です。

さて、ちょっと疲れた。でも、このまま、だらだら、書いていこう。

改造するには、ちょっとした知識が必要になる。
スタイルが、テンプレートのどの部分と対応しているかを知る必要がある。
今まで説明をしてきたやり方をしていると、テキストファイルを、htmlで保存すると、{++++++}この中カッコで囲まれた文字が見えていると思う。
これが、テンプレートファイルの心臓部で、このカッコ内の名前に呼応したデータと入れ替わる部分です。これは、だから、消しちゃいけない部分です。逆に言うと、これ以外は、自由に改造できます。

中カッコが何と対応しているかは、インターネット上の自分のページを開いてみるのがいい。ローカルにあるファイルは、同じレイアウトで、中カッコが、インターネット上のファイルは、文字列が表示されているので、比較すると簡単にわかるでしょう。

書き忘れましたが、headerタグ内にある、***.cssファイルの名前があるタグの部分は削除して置いてください。

どっかに気に入ったレイアウトがあるなら、bodyからbodyの部分をコピーして、{****}で囲まれた部分を、当てはめていくことで、オリジナルレイアウトは完成します。




| テンプレートの編集 | 16:47 | comments(0) | trackbacks(0) |
| 1/1PAGES |