ブログ & Blog アクセスランキング


「無料で始めるお小遣い稼ぎ!プチリッチ」(http://petit-rich.cheap.jp/)の別館です。 初心者の為のHTMLの小技やブログのカスタマイズ法、フリー素材屋さんを紹介していきます。

2006/06/04/Sun
コメント欄をスクロール表示
ブログを書いてるうちにだんだんコメントしてくださる方が増えて、嬉しいのだけど、ズラ〜っと長くなってしまって・・・なんて事ないですか?

コメント数が多くなってくると、お返事を書くにも何回もスクロールして・・・って事になったりします。

だって、ちゃんと書いてくれたコメントを見ながらお返事書きたいですもんね。

前置きが長くなってしまいましたが、今日はコメント欄をスクロールさせる方法です。

@HTMLを編集

 ←これが書いてある所を見つけます。
省略
 ←次はこれを見つけます。


赤い部分を追記します。

ACSSを編集します
div.com_area {
height:200px;
overflow:auto;
}


CSSのどこでもいいので上記のタグを追記します。これで完了です。

height:200px;の部分の200pxはお好みの高さでどうぞ。

どんな感じになるのかは私のもうひとつのブログ『ネットで収入♪実験室』で確認してください。

サンプルを見る?
 
   
Posted at 13:00 / FC2ブログをカスタマイズ  / この記事のURL / コメント(4)
2006/05/30/Tue
月別・カテゴリ別アーカイブのドロップダウンリスト化
月別・カテゴリ別アーカイブなどが増えてくるとどうしてもサイトが縦長になってしまい、すごっく邪魔になったりしますよね。

出来るだけコンパクトにしたい人にいい方法があります。

月間アーカイブをドロップダウン化
@HTML編集で下記のタグをからの間に挿入して下さい。



AHTML編集の画面で

MONTHLY






上記の記述を下の記述に書き換えてください。

MONTHLY









 
 続きを読む…  
Posted at 15:18 / FC2ブログをカスタマイズ  / この記事のURL / コメント(0)
2006/05/30/Tue
背景画像を変えよう
背景画像を変更するには、スタイルシートを編集します。

background-image : url(http://blog46.fc2.com/n/xxxxx/xxx/xxxxxx.gif);

と記述が数箇所あると思います。コレを編集します。

一番分かりやすい手順は、()の中のURLをコピーしてブラウザで表示します。
すると画像が表示されるので、現在のブログと見比べてみると、どこに使われてる画像か分かるので、タグが今ひとつ分からないといった初心者さんでも、簡単だと思います。

スタイルシートの画像URLをお好きなものに変更すれば、OKです。
(その前に使いたい画像をアップロードしてURLをコピーするのを忘れずに)

元画像の大きさが知りたい場合は画像の上にカーソルを合わせて、右クリックでプロパティを見れば分かります。
(例:420×55ピクセルとあれば、横420×縦55ピクセルということです。)

画像の並べ方
repeat
背景画像は縦横タイル状に並べられます。

repeat-x
背景画像は横方向のみに繰り返して並べられます。

repeat-y
背景画像は縦方向のみに繰り返して並べられます。

no-repeat
背景画像は繰り返されずにひとつだけ表示されます。
 
 続きを読む…  
Posted at 14:29 / FC2ブログをカスタマイズ  / この記事のURL / コメント(0)
2006/05/17/Wed
リンク色を変更しよう
リンク色の設定は下記のタグを使用して設定する事が出来ます。

hover疑似クラスを設定する際には必ず宣言順序(link→visited→hover→active)に注意して下さい。誤った順序で宣言すると正しい表示結果が得られない場合があります。




a:link
リンクする要素のうち、未閲覧(キャッシュされていない)要素に対してスタイルを適用します。

visited
リンクする要素のうち、閲覧済(キャッシュされている)要素に対してスタイルを適用します。

hover
ユーザーがカーソルをその要素の上に置いているが、まだアクティブ状態にしていない時にスタイルを適用します。

active
その要素がユーザーによってアクティブ状態にされた時にスタイルを適用します。

上記のタグを、テンプレートの〜 の間に貼り付ければOKです。


 
   
Posted at 18:02 / FC2ブログをカスタマイズ  / この記事のURL / コメント(0)
2006/05/16/Tue
背景の画像を変更する
管理画面でスタイルシートを編集する画面を開いてください。 スタイルシートの始めの方に

body {
background○○
}


という表記を書き換えればOKです。


書き換えるためのタグ

body {
background-image : url("使いたい画像のURL"); /* 背景画像の設定 */
background-repeat : repeat; /* 背景画像を横縦タイル状に並べる */
background-position : left top; /* 開始位置を画面左上に設定 */
background-attachment : fixed; /* 背景画像の位置を固定 */
}



background-repeat :
画像の並べ方を指定します。
repeat
背景画像は縦横タイル状に並べられます。
repeat-x
背景画像は横方向のみに繰り返して並べられます。
repeat-y
背景画像は縦方向のみに繰り返して並べられます。
no-repeat
背景画像は繰り返されずにひとつだけ表示されます。


background-position :
画像の表示位置を指定します。
left(左) center (中央) right(右)


background-attachment :
fixed 背景画像の位置を固定します。
scroll 背景画像を他の内容と共にスクロールします。


背景色を変更する場合は下記のタグを使います。

background-color: #009999; (#009999の部分に好きな色のコードを入力

色見本はここから
 
   
Posted at 23:11 / FC2ブログをカスタマイズ  / この記事のURL / コメント(0)
2006/05/16/Tue
相互リンク集
 
   
Posted at 00:17 / リンクについて  / この記事のURL / コメント(0)
2006/05/13/Sat
文字(FONT)のサイズを変える
FONTサイズを変えるにはいくつかの記述方法があります。

「○pxや○pt」などの絶対値指定と「x-small」,相対値指定があります。

絶対数値指定
8,9,10,11,12・・・・pxもしくはpt

xx-small,x-small,small,medium,large,x-large,xx-large


相対値指定
0.8em,0.9em,1em,1.1em,1.2em

85%,90%,95%,100%,105%,110%,115%


CSS(スタイルシート)記述方法:タグ名 { プロパティ : 値 ; }

例:
body{
font-size: 11pt;
}

自分のブログのCSSを見てみましょう。font-sizeと記述があるところを好みのサイズに変更すればOKです。

絶対値指定と相対指定どっちがいいの?

絶対値で指定してしまうと訪問者が自分のブラウザ上でサイズ変更ができません。
また、ブラウザ(Internet ExplorerやNetscapeなど)によっては解釈が異なる為、見え方がぜんぜん違う!という事もあります。ですので相対指定を使うほうがいいと思います。
 
   
Posted at 21:06 / FC2ブログをカスタマイズ  / この記事のURL / コメント(0)
2006/05/13/Sat
まずは文字(FONT)を変えてみよう!
ブログの文字(FONT)を変えてみるだけでも随分、印象が変わるものです。

どんなFONTが好ましい?

ついつい個性的なFONTを選びがちですが、やはり、ブログに訪れた方が読みやすい方がいいでしょう。

読みやすさで言えば、やはり、「Verdana」でしょう。

MovableTypeでは初期設定の第一指定にされてるようですし、他のブログのテンプレートでも非常によく使われている代表的なFONTです。(Windows 標準フォントです)

「プチリッチ★別館」でも第一指定しています。

もうひとつのオススメは「Osaka」ですね。こちらは元はMac用に作られたものですが、現在ではWindowsでも使用可能となっています。ただ文字のサイズによっては汚く見えてしまうので小さいサイズでの使用が好ましいでしょう。

Windows標準FONTの中から選ぶのが無難でしょう。

Windows標準FONTを見るには?
メモ帳などのテキストエディタを開き、「書式」→フォントを開けば各フォントが見られます。
「これは?」と思ったフォントを指定して、実際にメモ帳に日記でも書けば、より具体的に見る事が出来ます。

FONTを指定するには?

テンプレートの設定等でスタイルシート(CSS)の編集画面を開き、font-family の記述を探し、好きなフォント名に書き換えればOKです。

例えば

body{
font-family : Verdana, Arial, sans-serif;
}


MS ゴシック」や「MS 明朝」のようにフォント名にスペースが含まれている場合には、ダブルクォーテーション( " )、または、シングルクォーテーション( ' )で囲みます。

font-family: "MS ゴシック", "MS 明朝", Arial ;

という風に書き換えて保存→再構築すればOKです。(FC2など再構築が自動で行われる場合では保存だけでOKです。(プレビューで確認してから保存するようにしましょう)

カスタマイズする前に
必ずメモ帳などにコピーしてから変更するようにしましょう。万が一失敗してもメモ帳のコピーをもう一度貼り付ければ元の状態に戻すことが簡単にできます。
 
   
Posted at 01:05 / FC2ブログをカスタマイズ  / この記事のURL / コメント(0)
2006/05/13/Sat
ブログをカスタマイズする前に
ブログをカスタマイズする前にスタイルシート(CSS)やテンプレートの記述などを
メモ帳などのテキストエディタにコピーして保存
(右クリック→すべて選択→コピー→貼り付け)しておきましょう。

万が一失敗したり、カスタマイズしたけど気に入らない場合にはメモ帳のコピーを貼り付ければ簡単にもとの状態に戻す事ができます。

面倒でもテンプレートの初期状態と別に触る度に保存しておけば、ここまではOKという所まで戻る事ができます。

またHTMLタグを多少は理解していないとカスタマイズするのは難しいです。

HTMLタグって何?
すごく簡単に言えばホームページを構成するプログラムの事です。
ブログもホームページの一種なのでHTMLタグをはずす事はできません。

・・・なんか難しそう??

大丈夫です。実はそんなには難しくありません。
確かに最初は戸惑うかもしれませんが、色々と触っていくうちに慣れると思います。

当サイトではHTMLタグの詳しい説明は省略していくので、タグが分からない方は「みんなのタグ辞書」を参考にしてみてください。シンプルで分かりやすいサイトです。
 
   
Posted at 00:55 / FC2ブログをカスタマイズ  / この記事のURL / コメント(0)
2006/05/11/Thu
ランキングに参加しよう
ブログを作ったらアクセスアップの為にもランキングに是非参加しましょう たくさんのブログランキングがあるけど、一押しは「人気blogランキング」です。

ここで上位に入れるとたくさんのアクセスが望めます。

その他のブログランキング
 ブログランキング・にほんブログ村へ
 
 
  ブログランキング くつろぐ  
 
   
Posted at 17:30 / アクセスアップ  / この記事のURL / コメント(0)
P R
2006年06月
« 前の月    |    次の月 »
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
  | 前へ  
 
GMO MadiaHoldings, Inc. 
MATERIAL by CANDIED
DESIGNED by CANDY BOX