kiss me [Serene Bach用テンプレート]

Serene Bach用テンプレート kiss me

kiss me ver 1.00
last update: 06.11.10
トップページ | 個別エントリ

Shanty Templ@ers第2回企画「美味しい」で製作したテンプレートです。セクシーでシックな大人の雰囲気に仕上がりました。スイーツよりも美味しい唇をご賞味下さい。

テンプレートは利用規約への同意を条件として無料でお使いいただけます。
ご利用の前に必ずご一読下さるようお願いします。
ダウンロードされた時点で承諾されたものとさせていただきます。

ヘッダーメニューについて

ヘッダーにフリーメニューをつけてあります。デフォルトではmenu1~4になっています。
BBSや拍手、リンクページ等好きなコンテンツ名とURLを入れて使って下さい。はみ出さない程度であれば増やしても大丈夫です。使わなければまるっと削除しても影響はありません。

写真を差し替えたい場合

1. サイズは横540px×縦190pxに合わせたものを用意
2. 下記のCSSの{site_parts}bc012_lips.pngのところをアップロードしたヘッダー用画像のアドレスに変更。
3. フッター部分のphotoのクレジットを変更又は削除する。

#header {
margin:0;
padding:0;
height: 190px;
background:url({site_parts}bc012_lips.png) center top no-repeat;
}

写真はクリエイティブ・コモンズにより、クレジット表示を条件として使用を許可されているものです。使用中はクレジットの削除はご遠慮下さい。

ブラウン・アイボリー系で統一していますので、雑貨の写真やインテリア、植物の写真などに差し替えても似合います。写真だけ変えれば雰囲気も変わるので、コロコロ見た目をを変えたいけど面倒臭いモノグサさんにおすすめ(笑)

update
  • 1.00 (06.11.10)
    配布開始。
Related Archive

Comments

コメントエリアをスクロールする / スクロールを解除する

ユヅさん、こんばんは。
コメント消えたみたいなので、もう一度書き込みさせていただきます。
まだ、公開はしていない当方の「kiss me」では、どうもblockquoteの背景が生きていないようですので調べてみてください。
こちら→link

ちちさん>
あ、コメント消しちゃったことに気づいてすぐ、WEB拍手の方にお返事をお送りしたのですが、それでもだめでしたでしょうか?(´・ω・`)
もしまだご覧になっていなければ一度お試しください~

こんばんは。
clap!でメールが来たことなかったので、失礼いたしました。
無事に表示できるようになりました。
おそらく、基本的なことなのだろうが、初心者にはその辺で簡単につまずいてしまいます。
ありがとうございました♪

ユヅさんこんばんは。
すごくシンプルで素敵だったので早速DLして使わせてもらってます。
写真は自作画像に変更しましたが。。。

こんばんは
先日、このテンプレをお借りしコメントさせていただきました。
上の方と同じく、私のブログでもblockquoteが利いていないようです。
お手数をおかけしますが、どうしたらよいか教えて頂けたらと思います。
よろしくお願いします。

かりんさん>
こんにちは、CSSの1行目の
@charset "UTF-8";

@charset "EUC-JP";
にしてみてください^^

ユヅさん、無事表示させることができました。
どうもありがとうございました。

  • 061116
  • sisi
  • どっちでもOK

かっちょセクシーなテンプレ~vv
yuzさんのウエブセンス超超憧れですvv素敵です~!

お久しぶりです。
このステキ☆テンプレに一目ぼれし、拝借いたしました。
今後も新作を楽しみにしております。
ありがとうございました。

sisiさん>
こんにちは。写真の効果が90%をしめています(笑)
気に入っていただけてうれしいですー^^

yukiさん>
こんにちは。ご報告有難うございました。
HighslideJSですが、画像にはid="thumb1"、アンカーには class="highslide" onclick="return hs.expand(this)"が入ればいいってことですよね。
アンカーの方は、タグ挿入支援機能でclassとonclickを入れたものを1つ作っておいて画像の時だけ使えば楽かもです。画像のidは、entry_idはentryの中でも使えますが、元々投稿記事の中で独自タグが使えません。
編集は自己責任になりますが、Image.pmで画像の挿入タグを変更できますので、そこで組み込んでしまうのも手です。

こんばんわ。
わざわざのご解説ありがとうございました! 感激です。

実は、アンカーのほうは「タグ挿入支援で何とかなるわー」と後日気がつきまして、一応作っておりました。
>Image.pmで画像の挿入タグを変更…
こちらは知らなかったので今回チャレンジしてみたのですが……スキルが足りず挫折…しました。ぅぅ。
いずれにせよ、写真をアップするのがケータイからがほとんどで、その際には上手く組み込むことが出来ており(画像idは取得できないのでキャプションは使用してないんですけど)、現在の私のスキルではこの辺が限界かな…と思っております。

でもでも、本当にありがとうございました。
いつか教えていただいた知識がサックリ使えるようにスキルアップできたらご報告に上がります!

  • 061119
  • rin

ユヅさん、こんばんは。ご無沙汰してます。
またまたテンプレートお借りしました。
ユヅさんのテンプレート、ほんっとに大好きです!
どうもありがとうございました。

ユヅ様、はじめまして(^.^)
このテンプレートとってもステキなので早速導入を考えたのですが、ユヅ様のテンプレートは画像にテキストが回り込むようになっていますよね? それを解除する事はできませんでしょうか? 出来ればすぐに使いたいです(*^.^*)

アキさん>
CSSの下記の部分が回り込み指定です。

/* class名がpictとthumbの画像にテキストの回り込み */
img.pict,img.thumb {
float:left;
clear:left;
}

ずっと回り込みさせないのであれば、ここを削除してください。特定の画像だけを回り込みさせない場合は、その画像のclass名をpictとthumb以外の名前にすればOKです。

ユヅさん、早速のご回答ありがとうございました!
おかげさまで使わせていただき始めました♪
これからもユヅさんのテンプレートを
楽しみにしてますねo(*^▽^*)o~♪

ユヅさんこんばんは。
写真変えたり、色々カスタマイズして使っているのですが、「右側のメニューが下にずれてる」と指摘をうけました。
どうも、右側部分のメニューに1コメニューを追加した所、それが原因で右側のメニュー部分が下にずれているみたいなのです。
普段はSafariを使っていて、自分の環境だと何も問題がなかったので、気づかなかったのですが、ユヅさんの環境だとどういう風に見えているのでしょうか?
自分で勝手にカスタマイズしまくって、質問するのも申し訳ないのですが、教えていただければと思います。

かすりんさん>
うちもメインOperaなんで問題ないんですが、困ったIEさんは堕ちてますね。NOW PLAYINGのところにサイドバーの幅よりも大きい画像が入ってしまっているのが原因です。
幅は210pxで10pxずつ余白があるため、IEの場合は実質190px程度です、そこに230pxぐらいの画像をいれているので突き落とされてるんですねー。

中身を190以内に収めるか、サイドバーのサイズを広げるか、ddの中で<div>で囲んでoverflowでスクロールさせるorはみ出た部分は消すのいずれかで対応することになるかなと思います。

見ていただいてありがとうございます<(_ _)>
しかも丁寧な説明まで!
説明していただいた通りやってみたいと思います。
本当に、ありがとうございました。

ユヅさん、こんばんは~!
久々にお邪魔してみて、このテンプレートに一目惚れしてしまいました。
またお借りしますね~
ありがとうございます(*´∀`*) 

ユジさん こんばんは
テンプレートに一目ぼれしました・・
今回もまたお借りします

ありがとうございました。

はじめまして。
テンプレートをお借りします。

  • 061226
  • anan
  • レス必須

ユヅさん、初めまして、こんにちは。
ananと申します。いつもステキな素材やSBのテンプレートなど、楽しく拝見させて頂いております。
今回こちらの新しいテンプレート、「kiss me」をお借りしたのですが、試しにプレビューしてみたところ、エントリ内で打ち込んだ
『<font size="1~7">』
のタグが無効になってしまうようなのです。スタイルシートのタグで指定した場合、そのフォントサイズには変更が出来ましたが、これから記事の中全ての表記を変えるのは大変で…上記の『<font~>』のタグを有効にするには、CSSのどの部分を直せばよいのでしょうか?(font-size:○○;の部分は殆ど直してみたりしましたがダメでした)
お忙しいところ申し訳ございません。
宜しければ、お答えくださると嬉しいです。
因みにURLはテスト用としておいてあるブログで、公開するには恥ずかしいので、拍手から送らせて頂きました。トップが例としてあげてみたエントリです。宜しくお願い致します。

ananさん>
こんにちはー
一番最初の* { }の中のfont-size:100%;を消すことで有効になりますが、*{}は全称セレクタといって全体に関わる部分の指定のため他のフォントサイズに影響が出る場合があります。いまフォントサイズを指定していない場所は、これまで自動的にfont-size:100%と計算されていましたが、フォントサイズ指定がなくなってしまうので予想外に文字が大きくなったり小さくなったりするかもしれません(今カスタマイズされていらっしゃるようなので)
影響が出た場所に応じてフォントサイズ指定をかけてあげてくださいね。
fontタグは非推奨要素(使わない方がよいとされ、一部の定義や将来的に削除や廃止となるもの:参考URL→link)のため、使用を前提として考えていない作りになっております、ごめんなさい^^;

また、html>bodyの指定のところが9ptになっていますが、これだとIE以外のブラウザで文字が潰れてしまうので、11~13ptあたりにされた方がと思います。
(デフォルトは13pt)
ここの数字からみて、90%や75%といった指定を後の要素で使っているため、9ptだと7pt以下で表示されてしまう箇所がでてきてしまうからです。
(※IE6からでは関係のないところです)

  • 061228
  • anan
  • レス不要

ユヅさんこんにちは。お忙しい中回答をありがとうございました!
丁寧にさまざまなアドバイスを付け足して頂いて、大変恐縮でございます…ありがとうございます。
全体指定の部分を消してみたところ、fontのタグが確かに有効になりました。IEで確認する限りではほかの部分の崩れはないようですが、他ブラウザでも確認しながら、スタイルシート指定にするかどうかを決めようと思っております。
%指定の部分をカスタマイズした件についてもご助言ありがとうございました。当方が今までずっとpxかptで指定していたため、%に慣れておらず変更していたのですが、現段階ではテストなので%で何ptのフォントサイズなのか把握しながらやろうと思います。
非推奨要素のことも知っており、もしかしてこれを考慮されてのつくりにしていらっしゃるのかな、とも考えておりましたので、わざわざのご回答、重ね重ねお礼を申し上げます。
せっかくの素敵なテンプレート、作者様であるユヅさんのお気持ちを壊さぬように使用させて頂きたいです。
お忙しい中ほんとうにありがとうございました。少し早いですが、よいお年を…。
来年もどうか、ユヅさんにとってよい一年となりますように。

  • 070106
  • ぽるん
  • レス必須

はじめまして。とっても素敵なテンプレートですね!ぜひ使わせていただきたいと思います。
ところで投稿画像を中央に配置するにはどうしたらよいでしょうか。
また投稿できる最大の画像の横幅は何ピクセルくらいでしょう?
お忙しいところすみませんが、よろしくおねがいします。

こんにちは。
ユヅさんの作られたテンプレートのサンプルを拝見し、どれもデザインが素晴らしく、エントリー部分の横幅も広かったので、全てダウンロードさせて頂きました^^
しかし、トップページも個別ページもユヅさんのサンプルの通りに表示されるのに、カテゴリー表示や、月別アーカイブ表示では、サンプルとは全く違う変な表示になってしまいます。
これは、そういう仕様なんでしょうか?

ぽるんさん>
中央に配置したい場合、IE7、Opera、Firefoxだとimgにmargin:0 auto;で解決するんですが、残念ながらIE6がバグで対応してないのでpタグでくくってあげるのが良いかと思います。
記事では<p class="ctr"><img></p>となるようにIMGタグをpで囲み、CSSでp.ctrに中央寄せの指定をしておきます。
CSSに追加 p.ctr { text-align:center; }
画像の最大幅は490px程度です。

かずまろさん>
かずまろさんがカテゴリーやアーカイブに、別のテンプレートを指定されているのだと思います。

記事カテゴリー>カテゴリーごとの「詳細」でのテンプレートの項目、テンプレート>設定でアーカイブのテンプレートの項目。これらが標準以外のものになっていないか確認してみてください。ここで別のテンプレートが指定されているとそちらが優先されます。

こんばんは。
大変わかりやすい回答ありがとうございました。
ユヅさんのおっしゃった通り、アーカイブに別のテンプレートを指定していました^^;
お忙しいところ、単なる知識不足でつまらない質問をしてすみませんでした。
これから楽しく使わせて頂きます^^

  • 070113
  • ぽるん
  • レス不要

お忙しい中、教えてくださってありがとうございました。
これで思った通りの表示にできそうです。
今後も素敵なテンプレを期待していますね♪

こんにちは。前作に引き続き DLさせて頂きました。
このテンプレはインパクトある写真が目立ちますが、私のblogではちとセクシー過ぎたので 入れ替えて使用させて頂きます。<(_ _)>

一つ質問があるのですが、
blogのタイトルだけ色を変更したいのですが、h1のid="top"がわからず変わりません。
CSSのどこをさわればよろしいのでしょうか。
お時間がありましたら ご返答頂けないでしょうか。
よろしくお願い致します。

nakaさん>
h1は1つしかないものですから、スタイル指定にはid="top"は使用していません(idはページ内リンクで使用しています)
h1にそのままスタイル指定する形になります。

ただ、h1はデフォルトだとリンクのついたテキストなので、h1のcolorよりa:link等のaのcolorが優先されます。
h1のリンク色だけを変更したい場合はh1 a:linkに対してスタイル指定を行えば可能です。同様にh1 a:visited等、CSSのHyperTextの項目を参考に4つとも指定してあげてください。

ユヅ様、あまりにも早いレスに驚きました。
h1 a:linkでしたか!初歩的なミスでお手数をお掛けしました。
どうもありがとうございました。

実はもう一つ お伺いしたかったのですが。
かねてより、「写真にポラ風枠をつける」CSSを使っていたのですが、今回うまく表示しないので、以前のユヅ様の「XML宣言を削除する」方法をとりましたら、文字がすべて小さくなってしまいました。
今回のテンプレの場合、ポラ風は諦めた方がよろしいのでしょうか?
『またコレかぁ~』と思われましたか?(^。^;)
他に何かスバラシイ方法を御存知でしたら伝授願えませんか。

nakaさん>
IE6を諦めると一番トラブルが少なく幸せになれるのですが、残念ながらそうもいかないと思うので(笑)

CSSのbodyのfont-size: x-small;をsmallにしてみて下さい。とりあえずはそれで大体のところは近くなると思います。一部小さすぎると思うところがあれば、その箇所のCSSのfont-sizeを少し大きくしてあげればよいと思います。(p.descriptionなど)

#IE6の中と小で読める程度を基準にしています

ユヅ様、何度もすみませんでした。
bodyのfontサイズが基準になっているのですね。
文字も期待通りの大きさにすることができ、写真に枠も付きました♪
ありがとうございました。

テンプレートをお借りしました。
お世話になります、ありがとうございます。
柔らかな色合いと透明感がとてもいいですね。

ユヅさん、はじめまして。このたびSerene Bachを設置しました。そして素敵なテンプレートだったのでさっそくDLして使用させていただいています。ありがとうございます!

こんばんは。
教えてください。
アーカイブやカレンダーの”月”を”卯月”などの
表示ではなく1月、2月と表示させるには
どうすればよいでしょうか?

  • 070416
  • やま
  • レス不要

rikkyさんこんにちは。横レスすみません。
ブログの管理室のテンプレート→設定の中にある時刻表記設定を変更されるといいんじゃないかと思います。

>やまさん
テンプレートに時刻表示記設定ってありますか?

すいません、意味が分かりました。
直りました。ありがとうございます。

Comment Form

[icon]


Trackback

Trackback URI
このエントリーへのリンクを作成
061111
はいはい・・・ | KISS AND KISS
またまた、テンプレを変更しましたよー。blog*citron 様| kiss me [Serene Bach用テンプレート]です。このツヤツヤした唇が私をそそりましたよ〜。前のテンプレも文字が大きくて、見やすくて好きだったのですがテ...
061112
第2回企画 「美味しい」 | Shanty Templ@ers
みなさんお待ちかねの 第2回企画 「美味しい」 公開日となりました!「美味しい」 というテーマは簡単なようで難しく、ただ食べ物のモチーフを使っただけだと 「食べ物」 というテーマだしなぁ・・・とテンプラー...
061112
テンプレート変えてみました | Liveitup@blog
前回の変更からあまり日は経ってないと思うんですが、またまたテンプレートを変えてしまいました。今回はこれ。  blog*citron | kiss me [Serene Bach...
070103
テンプレート変更 | Selbstgesprach 〜徒然日記〜
テンプレートを変えました。・・・もう1週間くらい前からテンプレートのカスタマイズは出来ていたのですが、変えるのを忘れてました[困り顔]blogcitronさんの「kiss me」です。Topの画像は楽譜にしてみました[笑顔]
070126
テンプレ入れ替え | なんちゃってぶろぐ
テンプレートを入れ替えました。blog*citronさまよりお借りしました。いままでは“基本系”に近いテンプレを弄り倒して“自己満足系”にしてましたが今回は無駄に弄り倒さず、ほぼまんま?です、今のところ。。。...