スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

「cloudy_day」修正点

この記事は06/18以前にダウンロードされたものが対象です。
現在公開しているものについては、以下は必要ありません(07/13追記)。

テンプレート「cloudy_day」をすこし修正しました。
修正版が公開されたのは06/18 21時頃です。

変更箇所は以下のとおりです。
エントリ下部ページ情報部分のコメント、トラックバックへのリンク切れを修正。
メニューボックスからのリンク切れ直して安心してたら、
エントリ情報部分からのリンクは切れたままでした…すみません…;;;

追記へのリンク追加
あると便利かなと思って足しました。
…が、これもついててあたりまえの機能だったのかもと思ったり…すみません…;;;
改行タグで間隔あけてたので、それもついでに直しました。
Operaで追記部分が崩れてたんですが、これで直りました。

■ ページトップリンク(▲)の記述修正
みっともない書きかたかなと思ったので修正しました。
そのままでも特に問題はないと思います…

■ CSS一部修正
メニューボックスに文字がひっかかってボックスが広がってしまうことがあるようです…
ちょびっと広がっただけでもメニュー部が落っこちてしまうので、それの応急処置を追加しました。
もともとなくても問題ないマージンが設定してあったので、それを外しました。
それから、引用文やリストについての記述を修正・追加しました。
記事内でリストや引用文を使わないならそのままでも特に問題ないと思います。

■ メニューの「カッコ」を統一
なんとなく気になったので( )を[ ]に変えました。


具体的修正方法は以下に書きました。
申し訳ありませんが修正をお願いします…(本当にすみません何度も…;;)
本当にすみません(泣)。


■ エントリ下部ページ情報部分のコメント、トラックバックへのリンク切れ修正
<!-- コメント部分ここから -->
  <!--comment_area-->
  <div class="section" id="comment-top"><!-- ※section※ -->
<!-- トラックバック部分ここから -->
  <!--trackback_area-->
  <div class="section" id="trackback-top"><!-- ※section※ -->
色かわってる部分を追加してください…;;;
いずれもテンプレートのHTMLのほう、
コメントのほうは上から1/3くらい、トラックバックのほうは2/3くらいのところにあります。


■ 追記へのリンク追加
「Read More...」クリックで、追記のアタマに飛ぶように修正…
修正前
<!-- 記事本文 -->
  <div class="entry_body">
  <%topentry_body>
  <!--more_link-->
  <br><br><br><span class="more"><a href="<%topentry_link>">Read More...</a></span>
  <!--/more_link-->
  <!--more-->
  <br><br><br><%topentry_more>
  <!--/more-->
  </div>
修正後
<!-- 記事本文 -->
  <div class="entry_body">
  <%topentry_body>
  </div>
  <!--more_link-->
  <div class="entry_body">
  <span class="more"><a href="<%topentry_link>#more">Read More...</a></span>
  </div>
  <!--/more_link-->
  <!--more-->
  <div class="entry_body" id="more">
  <%topentry_more>
  </div>
  <!--/more-->
テンプレートHTMLの、どちらかというと上のほうです。


■ ページトップリンク(▲)の記述修正
HTML内に4箇所ある「#top」を「#range」に書き換えました。
その後、この行(↓<body>のすぐ下にあります)を削除。
<a id="top"></a>


■ CSS一部修正
メニュー部のマージン削除。
色が変わってる部分を削除しました(CSSの上のほうです)。
/* サイドメニュー部分 */
div#menu {
  width: 180px;
  float: left;
  margin-right: 20px;
}

エントリ内部でのリストについての記述を追加。
/* 記事用リスト */
div.entry_body ul {
  list-style-type: square;
  list-style-position: inside;
}
div.entry_body ol {
  list-style-type: decimal;
  list-style-position: inside;
}
div.entry_body dd {
  margin-left: 1em;
}

引用文とコード記述用のマージンをちょっと変えました。↓
margin: 10px 30px 10px 50px;


既にカスタマイズされてて「どこを修正すればいいかわからないぞこの野郎」と思われた方は、
お手数ですがテンプレートのソースをコピペしてアップロードしたものをお知らせください…
カスタマイズされた箇所も一緒に教えていただけると助かります。
こちらでできる限りの対応はさせていただきますっ。
どうぞよろしくおねがいします;;;
何度も本当にごめんなさい…

もう変な不具合が出てきませんように…!(泣)
スポンサーサイト

Comment

質問させてください

KAIさま、はじめまして。
数日前FC2に引越ししてきたばかりです。
雲の画像のあるシンプルなテンプレを探していたので、とても素敵だなと思いDLさせて頂きました。
宜しければカスタム法についていくつか教えて頂けたらと思い投稿しました。

●折角の画像なので記事をスクロールしても、表示できるように固定させられたらと思うのですが、

/* ヘッダ部分。タイトル画像はここの背景に設定 */
background-attachment:fixed;

に変更してみたのですが、表示は変わらずそのままなのです。固定の仕方が間違っているのでしょうか?

●プロフィール[Author]の下の(紹介文)フォントサイズの設定はどちらで行なえばよいのでしょうか?

●何度か試してみたのですが、エントリタイトルと、横メニュータイトルの色の変更をしたいのですが、色指定をしても反映されません。

/* ブロック内ヘッダ部分 */
/* エントリタイトル */

の色を指定するだけでは出来ないのでしょうか?

カスタムはほぼ初めてで、昨日から2日かけて試してみているのですが、どんどん収集がつかなくなりかけていて、申し訳ない気持ちで一杯になりながら質問にあがりました・・・
とてもこだわって作成されたテンプレのようなので、余計に・・・
もしお時間がありましたら、どうか御回答宜しくお願い致します。

うわのそらさんへ。

はじめまして。こんにちは。
テンプレートご利用ありがとうございますっ。
修正版を公開しなければと思いながら微調整にてこずっている状態なので、DLしていただいて嬉しいやら申し訳ないやらです…(すみません…;;)
今公開されている「cloudy_day」で試してみたので、その方法を以下に書きます。
質問の順序が前後していますが、ご了承ください…


■ プロフィールの紹介文の文字の大きさ
これは設定項目をつくっていないので、新たに設定する必要があります。
まず、「HTML」のプロフィールボックス内のこの行
<li><%introduction2></li>
…に、適当なクラス名を追加してください。↓例えばこんな感じ。

<li class="author_description"><%introduction2></li>

それから、「CSS」に文字の大きさの設定を追加します。
場所は下のほうならどこでも大丈夫だと思いますが、プロフィールの設定の一番下に追加するのがわかりやすいかと思います。

.author_description {
font-size: 文字のサイズ;
line-height: 行間隔;
}
「line-height」は、行間隔が気になるようなら追加してみてください。なくても問題ないと思います。


■ 横メニュータイトルの色
これは「.side_title」で設定します。「メニュー部設定」の上から2番目にあります。


■ エントリタイトルの色
これはCSSの説明の記述が紛らわしかったです。すみません;;。
「/* ブロック内ヘッダ部分 */ 『.entry_header』」の文字色は、個別記事ページに移動したときのエントリの下に出てくる「コメント」と「トラックバック」2ヵ所の文字のみに反映されるのです…。
エントリタイトルの色は、「.entry_header」の下にある、「.entry_title」で設定しているのですが、
このテンプレートではエントリタイトルの文字列を個別記事へのリンクにしているので、
「リンクの設定」にある、

/* エントリ内 */
.entry_title a { font-weight: bold; }
.entry_title a:link { text-decoration: none; color: #ffffff; }
.entry_title a:visited { text-decoration: none; color: #ffffff; }
.entry_title a:hover { text-decoration: none; color: #ffccbf; }
.entry_title a:active { text-decoration: none; color: #ffffff; }
↑この部分の色をいじってください。


■ 背景画像の固定
これもわかりづらい記述方法で申し訳ないです…;;;
「#header」はブログタイトルと、ブログ説明文と、横カレンダーが入っているブロックです。
TOP画像として使うため、このブロックだけに背景画像を設定しています。
画面全体の固定背景にするためには、「#header」ではなく「body」に背景画像を設定します。

「全体の設定」の「body」に、以下を追加して、「#header」の部分の同設定を削除します。
background-image: url(画像URL);
background-position: center top;
background-repeat: no-repeat;
background-attachment: fixed;

「#header」は背景色が白になっているので、透過に変更します。
background-color: #ffffff; ←これを、
background-color: transparent; ←これに変更。
これで固定背景になると思います。

…が。やってみるとわかるのですが、コレちょっと微妙です;;
まず、この雲の画像は「#header」ぴったりの大きさではありません…
それはいいとしても、画面サイズやブラウザによっては画像が中央からズレたりします。
もっと大きい画像を派手に(?)敷いたほうが見栄えがいいかも…です;;;。


カスタマイズって難しいというか厄介ですが(苦笑)、自分好みのページを作るのって楽しいです。
「cloudy_day」が、好みの場所作りに少しでも役立つなら、それはもう嬉しいです♪
いろいろ至らないところもあるテンプレートですが、ぐりぐりいじりたおしてやってください。

すっごく長くなっちゃってすみません…;;;
しかも説明もわかりづらいかもです(泣)。
できる限りお答えしますので、また何かあったらお知らせください。
どうぞよろしくおねがいします。

「cloudy_day」おまけ画像

「cloudy_day」のトップ画像と似たようなでっかい画像を、ちょっと作ってみました(重めです;;)。
こう見るとホント微妙な画像なのですが…(泣)
http://blog10.fc2.com/p/peacockblue/file/blogtop_cloudy_day_b2.jpg
元画像を傾けたりして捏造した(苦笑)トップ画像なので、長方形の形で切り出せるのはこの大きさが限界でした…;;
適当に加工したり位置を調整したりしてみたりで、もし使えそうだったら使ってやってください。
もちろん強制ではありませんっ。もし利用価値があるなら、です。
いつ消しちゃうかわからないので、お持ち帰りでご利用くださいー。
よろしくおねがいします。

ありがとうございます~

早速のご回答どうもありがとうございますm(_ _)m
テスト画像確認させて頂きました。取り急ぎそのご連絡です。
(作業後だととっても遅くなりそうなので・・・・・)
これからご説明頂いた様に調整してみます。またご報告にあがります。(^-^*)/~

確認ありがとうございます

>うわのそらさん
確認のご連絡ありがとうございます。
なんだか急かしちゃったようで申し訳ないです…;;
のんびり試してみてくださいー。
なにかあったらいつでもお知らせくださいね。

カスタム中~

ご連絡遅くなりまして申し訳ありません;
ご丁寧にご説明してくださって本当にどうもありがとうございました!
あれから教えて頂いたところも含め、色々いじっています。
文字色の変更については、しかし今の色がとてもよく計算されていることがよくわかり、そのままにしています。バランスがいいですね!!
背景画像の固定も無事に出来、満足です(^^)
こちらはがらっと模様替えされたのですね~~夏らしいですね。
今自分のところは、サイドメニューと記事本文をスケルトンにしてしまいました!初めのイメージと遠くなりつつあるような気もしますが、それもまた楽しかったり・・・(笑)
ひとつだけ疑問が残るのが(まだあるのか;)フォントサイズの変更です。
微妙なサイズ表示が出来ないのです・・・ブラウザにもよるのでしょうか。こちらのサイトのサイズくらいにしたいなぁと記事本文1px(pt)づつずらしたりしているのですが、その1pxの微妙な差が出ないのです;ちなみに今は10pxに設定しています・・・小さい・・・11だとちょっと大きい・・・何故??
と疑問に思いつつもうーむ、でもホボ満足(笑)
KAIさまは新テンプレ作成中なのですね~
それもまた期待していたり!!
それでは。長々すみません。

楽しんでください~~♪

>うわのそらさん
こんにちはー♪
カスタマイズ、順調みたいでよかったです! 楽しんでいただけてるならなによりです。どうぞぐりぐりいじりたおしてやってください~。
文字色は単に私の好みというだけです(苦笑)。通常のWinモニタだとメインの文字色が明るすぎるんじゃないかと今更のようにちょっと心配だったりしてます;;。
スケルトンってIEのアルファフィルタ?でしたっけ。私も透けるのスキですー(笑)。
でもあのフィルタ、画像まで透けちゃうのが残念です。そうじゃなかったらIEの独自機能でも真っ先に使ってたのに(笑)。

文字サイズなんですが、10pxと11px、7ptと8ptの間は結構大きな差が出るところです。11pxと12pxとか、8ptと9ptの差みたいなゆるやかな変化にはならないです(うっ、うまく言えません…・泣)。
私もよくわかってないんですが、フォントはドットの集まりで表示されているので、これは仕方ないことなんじゃないかなぁと思います…;;;
モニタ解像度にもよるんでしょうけれど、10pxはさすがに小さそうですね…;;
今のココは、%単位の指定を試みているので75%に指定しています。私の環境では12pxも9ptも75%も全部同じに見えるんですが…あれ?;;;

模様替えしてみました。まだまだ途中ですが;;みっともなくてすみません;;;。
新テンプレートというか…出来上がったら共有登録じゃなく、ココでひっそりと流そうかなぁと目論んでます(苦笑)。
作業の遅いだらだらブログですが;;、またよろしければ覗いてみてやってください♪
何度もしつこいですが、なにかありましたらいつでもお知らせくださいっ!
どうぞよろしくおねがいしますっ。

初めまして。
このテンプレートすごく使いやすくて気に入ってます。
ひとつ気になることがあるんですが、
リンクの設定をブランクにして新しいウィンドウで表示するようにしたいのですが
標準では同じページに表示されます。
リンクの変更はどうすればよいか教えて頂けますか?

>XOさん

XOさん、はじめまして。こんにちは。
テンプレートご利用ありがとうございます!
使いやすいと言っていただけて、すごく嬉しいです♪ ありがとうございます!
お好みに合わせて、がりがり書き換えて使ってやってください♪

リンクターゲットは設定していないので、確かに全てのリンクが同窓表示になります。
HTMLの「リンク部分」の箇所に、「target="_blank"」を追加してください。↓

<!--link-->
<li><a href="<%link_url>" title="<%link_name>"><%link_name></a></li>
<!--/link-->



<!--link-->
<li><a href="<%link_url>" title="<%link_name>" target="_blank"><%link_name></a></li>
<!--/link-->

これで別窓表示になると思います。
こっそりブログにお邪魔させていただいたのですが、きちんと「target="_blank"」の設定をされているので、サイドメニューの「Links」のことだと解釈させていただきました。
…質問内容はきちがえていたらすみません;;;(その場合は遠慮なくツッコミ入れてやってください;;)。

お返事遅くなってしまって申し訳ありません;;。
どうぞよろしくおねがいします。

お世話になってます~。
わざわざお越し下さってありがとうございました(o*。_。)oペコリ
まだFC2のテンプレ仕様に慣れていなくてわからなかったんですが、
でもバッチリ直りました♪
どうもありがとうございました^^

よかったです~

> XOさん
こんにちはー。
うまくいったみたいでよかったです。
的外れじゃなかったみたいで、それにもほっとしてます(笑)。
FC2ブログのテンプレートはすごく楽しいです。お互い楽しみましょう~♪
なにかお気づきになりましたら、いつでもお知らせください~~
どうぞよろしくおねがいします。
管理者だけに表示を許可する

Trackback

Trackback URL:

http://peacockblue.blog10.fc2.com/tb.php/37-379ac8f9
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。