PROFILE
Template
【テンプレ】 avion
どうもお久しぶりです。
ずいぶん前から構想はあったんですが、上手く組み立てられず、ようやく出来きました。
「avion」
フランス語で「平面」を意味します。でも逆翻訳かけると「飛行機」になる不思議。
そもそもwebは平面的なものなんですが、立体的な平面、よくある壁みたいなものを作ってみたくて。
少しザラザラした背景に、文字を書きなぐっているような、はたまた写真を貼り付けているような。
そんなイメージ。
そして、今回はよりリスト周りと文字周りを見る人に配慮(したつもり)。
深玖さんやその他の方の記事で、
「月別アーカイブとか要らないんじゃない?コメントとか要らないんじゃない?」
って言うのを読んで、
「要る人は要るし、要らない人は要らない。
でも、テンプレだもの、入れておこう。要らない人は削ればOK。
とりあえず、見てる側で要らない人の為に隠しておこうか」
というわけで、こんなんなりました。
それから、世の中には
「文字が小さいと読む気にならないヒト」と「文字が小さくないと書く気にならないヒト」またはその逆のヒト達
がいるようです。
助け合い掲示板とかでも全体的に小さくしたいとか質問も飛んでいたり。
個人的には読みづらいので12pxは欲しいところですが。
なので今回は文字サイズを可変できるようにしてみました。
シェアの多いIE6ではpx等で固定した文字がサイズ可変できないという、不親切な仕様があるので、それに対応させました。
winIEでは文字サイズ「中」で、fxやMacIE、safariの文字サイズ「100%」で、本文文字サイズが12px相当になります。
技術的な話は別エントリで書きます。
カスタマイズは続きにて。
■avion DATA
・全体の幅:600px 記事部分の幅:600px
・1カラム
・文字可変、リスト折り畳み
→avionのDL Sample
【テンプレ】 hortensia
はい、予告どおり、新しいテンプレ。
「hortensia」
オルタンシアとかオルタシアとか読みます。意味は「紫陽花」。フランス語です。
紫陽花と言えば、青や紫の小さい花が密集してる感じですけども、今回は紫陽花らしいモチーフは一切使わず、色で表現してみました。
紫陽花は形もそうですけど、様々な色が集合してるのも、特徴の一つだと思うので。
サイト説明の部分は1行から3行が限界です;
それから、今回は極力divを削ったものにしたので、サイドバー部分を弄くるのはちょっとコツが必要です。
CSSをじっくり見て、よく分からない場合はどうぞ聞いてください。
あ。今回はちょっと面白いJavaScriptを使ってます。
Sample見てもらえると分かりますが、記事部分の画像が交互に変わってます。
このJavaScriptに関しては後々記事を書きますので、少々お持ちくださいませ。
■hortensia DATA
・全体の幅:800px 記事部分の幅:485px サイドバーの幅:195px
・2カラム
→hortensiaのDL Sample
【テンプレ】 【修正】in the cage(5.15追記有)
一昨日公開したばかりですが、ツメのあまいところがありました。スイマセン。
「Cookieを保存」するチェックボックスの両サイドにものすごい隙間が開いてます。
UTFの方は修正してますが、すでにダウンロードされている方、お手数ですが、CSSの部分に
CSSの所ならどこでもかまいません。
お手数おかけしまして、ホントすいません。
<ぼやき>
テンプレートのプレビューに、記事だけ表示させたバージョンも欲しいよね。確認がしづらい…。
フォーム周りのデザインとかも現状じゃ見れないし。
なんとかなりませんか、JUGEMさん?
</ぼやき>
アクセス解析ですでに使ってくださっている方々のところを見て回ってて気付きました。
うわぁん。orz
そうそう。
すでに使ってくださってる方々が感想で「かごの形」を気に入ってるのを読んで、過去になかったのかなぁとUTFを見てみたけど、無いっぽいですね。
お陰様で現在クールの第4位。ありがとうございます。
2007.5.15 : 追記
スイマセン。もう一個ありました;;
「Cookieを保存」するチェックボックスの両サイドにものすごい隙間が開いてます。
UTFの方は修正してますが、すでにダウンロードされている方、お手数ですが、CSSの部分に
input#set_cookie{を追加してください。
width:1em;
}
CSSの所ならどこでもかまいません。
お手数おかけしまして、ホントすいません。
<ぼやき>
テンプレートのプレビューに、記事だけ表示させたバージョンも欲しいよね。確認がしづらい…。
フォーム周りのデザインとかも現状じゃ見れないし。
なんとかなりませんか、JUGEMさん?
</ぼやき>
アクセス解析ですでに使ってくださっている方々のところを見て回ってて気付きました。
うわぁん。orz
そうそう。
すでに使ってくださってる方々が感想で「かごの形」を気に入ってるのを読んで、過去になかったのかなぁとUTFを見てみたけど、無いっぽいですね。
お陰様で現在クールの第4位。ありがとうございます。
2007.5.15 : 追記
スイマセン。もう一個ありました;;
【テンプレ】 in the cage
1ヵ月ぶりのテンプレ配布です。「in the cage」。
SoundHorizonの曲に「檻の中の花」というのがあるのですが、その曲をイメージして作ってみました。
仄暗く、悲しくて切ない、ジャズテイストの良い曲です。
モノクロームの世界で、花だけが鮮やかな赤。
花のまわりには黒揚羽。
やはり私は蝶モチーフが好きみたいです。
今回はJUGEMカスタマイズ講座さんで公開されてる折り畳みスクリプトを改造したものを使用してます。
追記にて解説しますね。
■in the cage DATA
・全体の幅:800px 記事部分の幅:495px サイドバーの幅:210px
・2カラム
→in the cageのDL Sample
【テンプレ】 Carte
久々なテンプレ配布です。「Carte」
カルテと読みますが、意味はカード。
記事内容表示時とプロフィール表示時以外はストンとした一枚カードのようになります。
タイトルをクリックしたら、もう一枚カードが出てきて内容を表示する。
イメージはそんな感じ。
サンプルを表示しただけじゃ内容のイメージが分かりにくいので、サンプル画像も用意しました。
■Carte DATA
・全体の幅:300px(一覧時) or 600px(記事表示時)
・一覧時と記事表示時で雰囲気が変わります。
・1カラム
→CarteのDL Sample
大きいサンプルは↓
一覧時 記事表示
大分前に出来てたんですが、色が決まらなくて。
結局(需要無さそうですが)複数作りました。
CSSを変えるだけでガラっと色を変えられます。ちなみにUTFに公開してるものは「桜」
追記にて他の色をご紹介。
【テンプレ】 Les ruines
Le cielを公開した後にすぐアップしようと思ってて、すっかりタイミングを見失ったので、あえてここで公開。笑
Le cielの色違いというか、写真違いなヤツ。
写真は何処だかもう判別不能。
で、がりごり弄くってたら、もう廃虚にしか見えない。人も居たけど、他にもなんか色々あったけど、消しちゃって、めちゃくちゃ寂しい。
国内の教会ではないそうです。
相変わらず、写真好きな友人がいると心強い。
■Les ruines DATA
・全体の幅&記事部分の幅:可変(ウィンドウサイズに合わせて変わります)
・記事部分の高さは400px(カスタマイズでかなり変えられます)
・1カラム(?) 横に3分割
→Le cielのDL Sample
カスタマイズとかはほぼLe cielと同じなので割愛です。
そろそろ、ぐちゃぐちゃした線が描きたいなー(時間が欲しい)
【テンプレ】 Le ciel
濃い味ばかりのものを食べると、たまにさっぱりしたものが食べたくなります。
ってわけでさっぱり。
なんだか映画のスクリーンみたい。
SeeSaaで配布してた時、やってみたかったんだけど、出来なかったカタチなので、ちょっと嬉しい。
コメントとか、レコメンドとか要らないものを削除しまくると、かなりシンプルなものになります。
観覧車の写真は写真好きの友人に撮ってもらったもの。葛西臨海公園の大観覧車。
撮る時にあれこれ口挟んだ人。。。
写真部分とかオリジナルにカスタマイズすると大分雰囲気変わると思います。
カスタマイズ方法を追記しますので、写真をころころ変えて楽しむのもアリかな。
■Le ciel DATA
・全体の幅&記事部分の幅:可変(ウィンドウサイズに合わせて変わります)
・記事部分の高さは400px(カスタマイズでかなり変えられます)
・1カラム(?) 横に3分割
→Le cielのDL Sample
結構自分の中ではシンプルな作りだと思うので、好きにカスタマイズして楽しんでください。
てわけで、カスタマイズのご案内〜
【テンプレ】 Trump Check
前々から作りたいなーと思っていた、Trump Checkのモノクロバージョンです。
トランプカラーの白・黒・赤で構成してみました。
この色の方がトランプな感じがしますね。
そして毎回ジャンルに困ります。
友人に「可愛い」と言われたので「カワイイ」にしてますが、どうなんでしょう?
「ゴージャス」とか「豪奢」とか「デコラ」とかジャンルがあれば迷わずそれにするんだけどな。。。
そうすると「キレイ」になっちゃうのだろうか?
■Trump Check DATA
・全体の幅&記事部分の幅:可変(ウィンドウサイズに合わせて変わります)
・サイドバーの幅:190px
・3カラム
→Trump CheckのDL Sample
【テンプレ】 Trump Check -Heart-/-Club-
チェック終了したので本公開です。
今回は英語タイトルですね。フランス語の語呂が可愛くなかったので。
ハート・クラブ・ダイヤ・スペード、それぞれがちょっとゴージャス。
おすすめ商品サムネールが並んでるのはちょっとお気に入り。
おすすめ商品が無い場合は、その部分の背景色のラインが出るようになってます。
■Trump Check -Heart-/-Club- DATA
・全体の幅&記事部分の幅:可変(ウィンドウサイズに合わせて変わります)
・サイドバーの幅:190px
・3カラム
→Trump Check -Heart-のDL Sample
→Trump Check -Club-のDL Sample
今回から広告のカラーを勝手に変更してくれるJavaScript付けました。
勝手に変えられたくない人は、↓の赤文字部分を削除してください。
<HTML>
<body onload="javascript:initval(); javascript:CMcolor();" id="n{eid}">
NEW ENTRYS
- 生存報告とか色々なお知らせ (12/28)
- 生存報告とお知らせと宣伝と (08/21)
- CSS Naked Day だそうです。 (04/09)
- gift (03/28)
- エントリが1ヶ月おきな件について (03/24)
COMMENTS
TRACKBACK
- JavaScriptメモ(3):しんぷるロールオーバー(追記:2007.6.29)
⇒ buggy_trekkerの学習帳 (10/24) - JavaScriptメモ(3):しんぷるロールオーバー(追記:2007.6.29)
⇒ Memoのメモ (08/23) - (追記:2007.8.29)IE7でbodyの背景が拡大/縮小されない!【IE7対策】
⇒ SOHOカアチャン通信 (06/09) - JavaScriptメモ(3):しんぷるロールオーバー(追記:2007.6.29)
⇒ WEB制作会社のメモ帳in徳島(ホームページ作成Tips) (11/18) - JavaScriptメモ(3):しんぷるロールオーバー(追記:2007.6.29)
⇒ btmup Blog [tech] (11/04) - JavaScriptメモ(3):しんぷるロールオーバー(追記:2007.6.29)
⇒ Bowz::Notebook (03/12) - Twitterな話。
⇒ COLORFULLIFE (05/16)
ARCHIVES
- December 2010 (1)
- August 2009 (1)
- April 2008 (1)
- March 2008 (2)
- February 2008 (1)
- December 2007 (1)
- November 2007 (1)
- October 2007 (1)
- August 2007 (1)
- July 2007 (2)
- June 2007 (10)
- May 2007 (4)
- April 2007 (9)
- March 2007 (16)
- February 2007 (17)