2007.09.01(00:03)

今日はお小遣い稼ぎとはまったく関係ない記事です。
まぁよくあることですが(笑

今回はタブの作り方を。

元ネタは
知っておいて損はないAJAXやCSSを駆使したタブインターフェース18種類 - GIGAZINEから。
なんとなく簡単そうだったJavaScript Tabifier automatically create an html tab interfaceを選びました(手抜

このブログでも下にある、「ジャンル別お小遣い稼ぎサイトTOP5」で使ってます。
使ってみたいという人がいたりいなかったりするので簡単に作り方を説明します。
と言ってもココでは準備だけして内容は自分で書かなきゃいけないんでちょっと大変かもしれませんよ(^-^;

⇒タブでスペース有効活用の続き に興味がない人はランキングを見る

2007.08.13(11:27)

アフィリエイトやSEO対策関連に使えるサイト・ツール、さらにFireFoxのプラグインを自分用にまとめてみる。
俺しか見ちゃダメなんだからな(笑

⇒自分用アフィリエイト・SEO対策関連サイト+ツールとかのまとめの続き に興味がない人はランキングを見る

2007.07.08(23:27)

今日はお小遣い稼ぎとはまったく関係ない記事で。
まぁなんというか紹介するサイトがなくなったので(笑

画像ファイルをカッコよく表示するLightbox

「Lightbox」って皆さん知ってますか？
↓クリックしてみて

ということで今日はこれをFC2ブログで使おうというテーマで行きましょう。

やってみたいという人は続きをどうぞ(^-^)

え？興味がない？めんどくさい??
ランキングにでも行けばいいだろ｡･ﾟ･(*ﾉД`*)･ﾟ･。

⇒LightboxでFC2ブログをカッコよく！の続き に興味がない人はランキングを見る

2007.05.04(10:08)

以前作った、簡易(手抜き)テーブル生成マッシーン専用ツールとして

CSS生成マッシーンも作ってみました↓

〜使い方〜

ちょっと使いにくいかもしれません(^-^;

ちなみに、このマッシーンで指定できるのは、
・枠線
・タイトルの背景、文字
・項目名の背景、文字
↑の色。
・バナーの位置。

こんだけ。

まず、上部のカラーコード生成マッシーンで、つまみを動かしたり数値を入力したりして、6桁のカラーコードを生成してください。
sample colorの下のグレーで表示される数字がそれです。それをコピー。

次にコードを、CSS設定フォームのボーダー色や背景色にペーストしてください。白いボックスね。直接数値を入力してもかまいません。
グレーのボックスは、その部分のCSSです。
例えばテーブル全体のボーダー色ならborder:#xxxxxx;って具合に。
表示されてるだけだと思ってください(笑

次にバナーの位置ですが、右・左・中央の3種類ありますので好きなとこにチェックしてください。

プレービューエリアを見ながら好みの感じになったらあとは下にあるCSSソースをテンプレートのCSSに追加してください。

念のためテンプレートを複製してからのほうが安全です。

テーブル生成マッシーンもそうですが、試作段階なのでおかしな動きがあったらコメントしていただけるとありがたいです。

2007.05.04(09:50)

たとえばこんなテーブル↓

お財布.com基本データ
報酬	現金
受け取り	イーバンク銀行・ジャパンネット銀行・郵貯・ほか
換金レート	300円から
ポイント有効期限	なし
紹介制度	紹介者と同額100％

見やすくてわかりやすくて、いいと思いませんか？

ということで作ってみました。

「簡易(手抜き)テーブル作成マッシーン！」

↓↓↓↓↓↓↓

〜使い方〜

テーブルの概要ってのは、例えば、「お財布.comデータ」とかね。表示はされませんが、書いておいたほうがいいです。
テーブルタイトルってのはバナーの上に文字書きたいときに。
「お財布.com基本データ」とか。
上部バナータグと下部バナータグってのはASPとかポイントサイトとかの紹介バナーのタグをそのまま貼ってください。普通のテキストも書けますよ。
で、「項目名」に項目名を、「内容」に内容を入力してください。(まんまだな)
バナーのフォーム・項目名のフォームをクリックするとタグが追加されます。
やっぱりいらないって思ったら「列を削除」ボタンを押してください。

最後に、生成されたソースをコピペすればできあがり♪
htmlソースのところで一度クリックして「ctrl+A」ですべて選択できます。

※注意事項※

・項目の数は8個までです。
自由に増やせたりするようになる『かも』しれないです。

・生成されたソースの改行を削除して、一行で使ってください。
でないと自動改行のブログではおかしなことになると思います。
改行なしのソースも表示されるようになってますので、メンドクセーって方はそちらをどうぞ。
改行したい場合は記事の編集画面に貼付けてから改行するか、改行したい場所に<br />タグを追加してください。

07年05月：<br />タグが自動で挿入されるように

右上の<br />タグ自動挿入にチェックしてください。
赤いランプがついてる状態がチェックです。

ちなみにこのままだと枠線も何もないので、とりあえずデフォルトのDiechang風CSS(スタイルシート)を↓

table.siteData{
margin:auto;
border-collapse:collapse;
}
table.siteData td{
border:solid 1px #9999FF;
padding:4px;
}
table.siteData td.tableTitle{
background-color:#EEEEFF;
}
table.siteData td.bannerImg{
text-align:center;
}
table.siteData td.pro{
background-color:#EEEEFF;
}

テーブルのクラス名は「siteData」、
上部・下部のテーブルセルのクラス名は「bannerImg」、
項目名セルのクラス名は「pro」です。
上記CSSを、テンプレート設定からCSS編集の一番最後の方にでもコピペして色とかいじってみてください。
念のためテンプレートを複製しておくと安心かもしれません。

ちなみにこの「簡易(手抜き)テーブル作成マッシーン」はまだ試作段階ということで、おかしな動きをするかもしれません。
なにかあったらコメントください。

手に負えないようなバグだったら…
記事ごと削除だな(笑