人気ブログランキング | 話題のタグを見る

○○さんの為のエキサイト・スキン編集ブログ
by skin_dasu
S M T W T F S
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31
カテゴリ
skin編集
投稿&表示方法
コメント欄
背景の変更
メモ帳
その他
タグについて
skin付属
スキン解体
はじめに
以前の記事
2010年 12月
2009年 06月
2009年 05月
2006年 08月
2006年 07月
2006年 05月
2006年 04月
2006年 02月
2006年 01月
2005年 12月
2005年 11月
メモ帳
ご訪問有り難うございます。
なるべく分かり易いように
努力致します。
その他のジャンル
ファン
記事ランキング
ブログジャンル
画像一覧


今回からは・・・
ハイー、前回の予告通り、今回からは趣旨を変えてお送りしまーす。
で、何とするかと申しますと、スキン編集の元としている
エキサイトさん提供スキンの構造を解説もどきでやっていこうと思います。

スキン編集のテクニックを憶えるもの重要ですが、基礎が分かっていないと、
いざって時や、オリジナルを作る時にもたついてしまいます。

内容には過去に書いて来たものを重複する説明もあるかも知れませんが、
復習のつもりでだと思ってお付き合い下さいませ。
# by skin_dasu | 2006-07-31 17:55 | スキン解体 | △TOP
ベーシック スキン編
ハイー、まず最初は、エキサイト・スキンの一番最初にある「ベーシック スキン」です。

ここではカラーは「ダークグリーン」を使用しています。↓
(プレビューでスクリーン・ショットしたのもです)
ベーシック スキン編_a0064894_21105643.jpg


このスキンは上部にタイトル、URL、背景カラーが表示され、
左枠が、カレンダー、メモ帳などが表示され、
右枠が投稿コーナーになっている構図です。

これをスキン編集コーナーで見ていくと、

現在設定された部分別横幅(pixel) : 本文 500 - ロゴ150 - メニュー 190

HTML編集全体が


<table width="800" border="0" cellpadding="0" cellspacing="0" align="center">
<tr><td colspan="2" valign="top">
<div id="TOP">
<table width="800">
<tr><td align="left" width="800"><div class="HEADER"><$header$></div></td></tr>
</table>
<div class="URL"><$blogurl$></div>
<div class="USERMENU"><$adminmenu type=1$><div>
</div>
</td><tr>
<tr><td width="240" valign="top">
<div id="LEFT">
<div class="PROFILE">
<div align="center"><$logoimage type=1$></div>
<$description$>
<$nick$>
</div>
<$calendar type=2$>
<div class="MN"><$menuleft$></div>
<$banner type=1$>
<$xml$>
</div>
</td>
<td width="560" valign="top">
<div id="RIGHT">
<$post$>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr><td align="right" width="45%"><$prepage type=1$></td>
<td width="10%"></td>
<td align="left" width="45%"><$nextpage type=1$></td></tr>
</table><br/>
</div>
</td></tr></table>

・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
一番最初に入力されてる
<table width="800" border="0" cellpadding="0" cellspacing="0" align="center">

は、表示されてないだけですが、枠(罫線)を意味します。
これはどのスキンにも当てはまるモノで、
全てはここから始まる。と云っても過言ではありません。

枠を表示させるタグが table (テーブル) です。
枠を横幅で800で表示する指示を width="800"  のタグで入力してます。

border="0" cellpadding="0" cellspacing="0"

border="0" が表
cellpadding="0" が罫線の幅
cellspacing="0"  がセル内の余白

実際に数値を入れてみましょう↓
ベーシック スキン編_a0064894_21501445.jpg


・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
プレビューすると、↓
ベーシック スキン編_a0064894_21504953.jpg


・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
さらにアップで表示すると↓
ベーシック スキン編_a0064894_21514618.jpg


ちょっと、上記の順番と異なってわかりずらい点がありますが、

border="2" が ①
cellpadding="5" が ③
cellspacing="5"  が ②

cell(セル)とは、簡単に云うとタイルのようなもので、
上記の画像ではタイトルやURLを含む背景色がついた部分を指します。
もっと大きくみると、このベーシック スキンはトップと
その下にある、左枠と右枠の3つのタイルから構成されていると思って下さい。

まだまだ続きます。←をクリック
# by skin_dasu | 2006-07-31 17:52 | スキン解体 | △TOP
投稿を固定する
ハイー、約2ヶ月ほど放置しておりましたが、また徐々に進めて参ります。

今回は、Blogについての情報や告知などをメモ帳では無く、
投稿文として書き、それを投稿文の最初に固定しておく方法をしまーす。

まず、通常に投稿のボタンを押して、投稿画面にします。
そこで、タイトル下にある「投稿日時」の「現在」に入っているチェックを
右隣に入れます。
すると、現在の日時が表示されると同時に、プルダウンメニューになります。
各日時を一番下に設定します。↓
投稿を固定する_a0064894_0581528.jpg


・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
2007 12 31 23 59 とするわけです。
プレビューすると↓
投稿を固定する_a0064894_0594366.jpg


これで終わりです。
・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・

ただ、当方のブログにように投稿文を1ページにつき、1つしか表示しないブログでは、
あまりオススメ出来ません。
そこで、設定内の「環境設定」→「メインページの記事数」の数値を変更します。↓
投稿を固定する_a0064894_115719.jpg


・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・

あとは下にある「変更」を押して、設定を保存します。↓
投稿を固定する_a0064894_135465.jpg


以上です。

実際に固定して投稿がこの上にある記事です。

次回からはちょっと趣旨を変えて行きます。
# by skin_dasu | 2006-07-27 01:05 | 投稿&表示方法 | △TOP