便利なホームページの作成に必要な、これは便利と思われるhtmlソースやタグ、CSSやCGI又.htaccessなどのソースを紹介します。

青色のテキストをクリックコピーして、ページの所定位置に貼り付けてください。
 カレンダー



  サンプル ⇒ 【カレンダー】
下の欄のソーステキストを、拡張子「.cgi」にペーストして、アップし、ブラウザで見る。




#! /usr/local/bin/ruby

today = Time.now

print "Content-type: text/html; charset=Shift_JIS\n\n"
print <<END
<html>
<head>
<title>#{today.year}年カレンダー</title>
</head>
<body bgcolor="mintcream">
<table align="center" cellpadding="4">
<caption style="font-size:large">#{today.year}年</caption>
END
days = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31] # 月の日数(うるう年の2月は+1)
days[1] += 1 if today.year % 4 == 0 and today.year % 100 != 0 or today.year % 400 == 0
for m in 1..12 # カレンダー表示(1月~12月)
startday = Time.local(today.year, m, 1) # 1日
endday = days[m - 1] # 最後の日
print "<tr>\n" if m % 3 == 1
print <<" END"
<td valign="top">
<table border="0" bordercolor="#ffefd5" cellspacing="0" cellpadding="4">
<tr>
<th colspan="7">#{m}<span style="font-size:xx-small">月</span></th>
</tr>
<tr>
<td align="center" style="font-size:xx-small;color:red">日</td>
<td align="center" style="font-size:xx-small">月</td>
<td align="center" style="font-size:xx-small">火</td>
<td align="center" style="font-size:xx-small">水</td>
<td align="center" style="font-size:xx-small">木</td>
<td align="center" style="font-size:xx-small">金</td>
<td align="center" style="font-size:xx-small;color:seagreen">土</font></td>
</tr>
END
count = 0
i = 0
while i < startday.wday # 1日までの空欄
print "<tr>" if count % 7 == 0
print "<td> </td>"
count += 1
i += 1
end
i = 1
while i <= endday # 日付を書き込む
print "<tr>" if count % 7 == 0
print "<td align=\"right\""
print " style=\"color:red\"" if count % 7 == 0
print " style=\"color:seagreen\"" if count % 7 == 6
print ">"
print i
print "</td>"
count += 1
print "</tr>\n" if count % 7 == 0
i += 1
end
while count % 7 != 0 # 最後の日からの空欄
print "<td> </td>"
count += 1
print "</tr>\n" if count % 7 == 0
end
print <<" END"
</table>
</td>
END
print "</tr>\n" if m % 3 == 0
end
print <<END
</table>
</body>
</html>
END

exit
 訪問回数(クッキー・カウンター)


   参考例⇒ 「 【サンプル】 」  色やサイズをアレンジしよう♪


「.cgi」ファイルを作成。

#! /usr/local/bin/ruby

require "cgi"

cgi = CGI.new

# Cookieデータ取得
count = cgi.cookies['count'].first
count = count.to_i + 1

# Cookieデータ作成
life = 30 * 24 * 60 * 60
expires = Time.now + life
cookies = [
CGI::Cookie::new({
'name' => 'count',
'value' => count.to_s,
'expires' => expires,
}),
]

cgi.out("cookie" => cookies) do
"
<html>
<head>
<title>訪問回数</title>
</head>
<body>
#{count}回目の訪問<br>
</body>
</html>
"
end

exit
 時刻によって挨拶文を変える



表示例; 《 挨拶 》


深夜や早朝など変化を付けたりネ♪


拡張子「.cgi」にペースト。


#! /usr/local/bin/ruby

day = Time.now #日時取得
h = day.hour #時間

if h >= 3 and h < 10
msg = "おはようございます。"
elsif h >= 10 and h < 18
msg = "こんにちは。"
else
msg = "こんばんは。"
end

print "Content-type: text/html\n\n"
print <<END
<html>
<head>
<title>時刻によって挨拶文を変える</title>
</head>
<body>
#{msg}<br>
</body>
</html>
END

exit
ページリストへのリンク 内容説明
「.htaccess」を使って
このページに移動する  
特定IPを指定ページへ移動 index.hml以外をデフォルトファイルに
cgi拡張子をhtml拡張子に変換・転送 html拡張子でPHPページ表示
トップページ以外へのリンクは、トップページに転送
HTMLファイルでCGIを動作させる トップページを任意ファイルに変更
HTMLソース
このページに移動する  
5秒後に指定URLに移動のメタタグ テキストボックス
プルダウン チェックボックス ラジオボタン テーブル(文字位置 align)
JavaScript
このページに移動する  
 前に表示したページに戻る 電光掲示板 文字列変換 更新日時を自動で表示
CGI(Perl)
このページに移動する  
 おみくじ 更新のたびに背景画像を変える 訪問回数
CGI(Ruby)
このページに移動する  
カレンダー 訪問回数 時刻によって挨拶文を変える
スタイルシート(CSS)
このページに移動する  
マウスオーバーで、カーソルの形を指定 ボタン風リンク 縦書き
矢印リスト CGI(Python)
このページに移動する  
カラーチャート IPアドレス取得・表示 日時取得・表示
その他便利等1
このページに移動する  
 枠線の種類 文字表示 【背景色と文字色】の関係
その他便利等2
このページに移動する  
サイト内検索窓 文字列に背景色をつける