-
ブログテンプレ『starry sky』カスタマイズ
2011.07.13 20:44|カスタマイズ|いつもご利用ありがとうございます。
◎2カラムと3カラムの可変につきまして
『25_starrysky』は2カラムのつもりで制作しましたが、3カラムにもなります。
プラグインのカテゴリで切り替えることができます。
左から、メイン記事、プラグインカテゴリ1、カテゴリ2と表示されるように並んでおり、
カテゴリ2にプラグインが設定されていなければ2カラムになります。
3カラムは狭い画面では右側にスクロールが必要になりますのでご了承ください。
◎文字なし背景へのカスタマイズ
『25_starrysky』の月のところに入っている「Pray for JAPAN」の文字ですが、文字なしバージョンの背景もあります。
もし、文字なしのほうがいいケースがありましたら、カスタマイズしてください。
■修正箇所
テンプレートのスタイルシート編集になります。
基本設定の中に背景画像に関する記述があります。/*--------------------------------------------------
基本設定
--------------------------------------------------*/
(中略)
body {
background: #f5f6f7
url(http://blog-imgs-44.fc2.com/u/r/a/uraraka01/25_bg_japan.jpg) fixed no-repeat top left;
(続く)
■ファイル名を書き換える
画像のファイル名を「25_bg_japan.jpg」から
「25_bg.jpg」に変更。
これだけです。
テンプレート自体は→こちらからスポンサーサイト
-
虹のブログテンプレ『after the rain』の最新記事表示欄について
2011.06.24 18:41|カスタマイズ|ご利用のみなさん、ありがとうございます。
先日共有した『after the rain』も気づくとすでにたくさんの方がダウンロードしてくださり、
ほんとうにありがとうございます。
コメントも拝見し、何かを感じたり、共感してくれたりする方がいるんだなぁと
あらためて嬉しく思います。
さてさて、タイトルの件ですが、
テンプレのブログタイトル下に囲みがあって、最新記事(New Entry)が表示されるようになっています。
表示数は環境設定から変更できますが、多い場合にも欄自体は広がらず、
スクロールバーが出るようにしてあります。
デフォルトで5件の方が多いかなと思うのですが、
実は5件でちょうどにするはずが、スクロールバーが出てしまうのですね。
質問していただいて気づきました。(ありがとうございました)
スクロールバーが気になる方は、対応策を質問にお答えするかたちでコメントさせていただきましたので、
ぜひ、前記事コメント欄をご覧ください!!
それにしても関東は暑いっ。
体調にはくれぐれもお気をつけて~ -
ブログテンプレ『sky』カスタマイズについて
2011.01.07 19:13|カスタマイズ|テンプレートをダウンロードしてくださったみなさん、
いつも使ってくださっているみなさん、
ありがとうございます。
申請してからあっという間、一晩で承認が下りていてびっくりしました。
はじめて写真をメインに据えてデザインした『sky』ですが、
わたしの思う「空」の姿が伝わっているといいなぁと願いつつ…
あえてご提案します!
もしご自身でもお気に入りの一枚がありましたら、
ぜひ、<body>の背景画像を差し替えてオリジナルにしてみてください。
上にのる記事部分はちゃんと透けて見えるようになっていますので!
ただ、写真によっては文字が読みにくくなるので調整が必要かもしれません。
ちなみに『sky』は横幅1200pxの写真を背景にしていて、
多くのモニタで、
両側と下に建物のシルエットと同じ黒が窓枠のように見えるのをねらっているつもりですが、
フルスクリーンに見せるにはもう少し大きい写真のほうが適しています。
モニタ解像度は幅1920pxなんてのも増えていますが、
1600px×1200pxぐらいが無難でしょうか。
その際も、写真の重要な要素は1200px×1000pxの範囲に収まるようにすると
小さいモニタの人にもちゃんと見てもらえます。
写真のサイズを調整する際のご参考まで。
もうひとつ。
今回、タイトル下に横向きのカレンダーを入れてみました。
わたしはあまり使わない派ですが、
『sky』には似合うかなぁと思ったので。
不要な方は、テンプレートのHTML編集で
<!-- 横カレンダーここから -->~<!-- 横カレンダーここまで -->
をガバッと削除しちゃってくださいね。
やってみたいけど、この説明ではよくわからない…
という方は、お気軽にお問い合わせくださーい!! -
ブログテンプレ『white blog』『black blog』アクセントカラー変更方法
2010.11.06 18:48|カスタマイズ|ダウンロードしてくださったみなさん、ご検討中のみなさん、
ありがとうございますm(_ _)m
テンプレート名「12_whiteblog」「13_blackblog」の簡単カスタマイズ(2)!!
「アクセントカラー変更」方法についてご説明します。
投稿日時部分のデザインですが、
共有テンプレートでは「12_whiteblog」がオレンジ、
「13_blackblog」はウッド調になっています。
その他に、イエローグリーン、ライトブルーの差し替え画像をご用意していますので、
お好みのものがありましたら変更してみてくださいね。
■「12_whiteblog」用差し替え画像ファイル名
12_tag_or.png(初期)
12_tag_yg.png
12_tag_lb.png
12_tag_wood.png
■「13_blackblog」用差し替え画像ファイル名
13_tag_wood.png(初期)
13_tag_yg.png
13_tag_lb.png
13_tag_or.png
変更方法はいたって簡単!
変更はテンプレートのスタイルシート編集になります。
スタイルシートの記述中には */ コメント /* がついています。/* メインコンテンツ
------------------------------------------------------------ */
の中の以下の部分を探してください。
#main td.kizi_sub {
width: 65px;
vertical-align: top;
background: url(http://blog-imgs-46.fc2.com/u/r/a/uraraka01/12_tag_or.png) no-repeat;
/* ◎投稿日時部分の色変更はココ。オレンジ→12_tag_or.png。イエローグリーン→12_tag_yg.png。ライトブルー→12_tag_lb.png。詳しくはhttp://uraraka01.blog27.fc2.com/にて◎ */
}
赤字の部分を変更したい画像のファイル名に書き換えてくださいね。
どうせなら、CMやTB、カレンダーやリンク文字も
同色のアクセントカラーに変更していただきましょう!
スタイルシートを上からたどっていただくと、
/* ◎~の色変更はココ。オレンジ→#ff7f43。イエローグリーン→#a3ef00。ライトブルー→#00d7f1。詳しくはhttp://uraraka01.blog27.fc2.com/にて◎ */
という記述が何カ所か出てきます。
コメントどおりに、その直前のカラーの記述(#~)を変更してみてください。
ウッド調の場合は、3色からお好きな色をどうぞ。
わたし、うまくご説明できていますでしょうか?
ご不明な点がありましたら、コメントでもメールフォームからでも
お気軽にお問い合わせくださいませ。 -
ブログテンプレ『white blog』『black blog』アイコン変更方法
2010.11.04 19:06|カスタマイズ|うららん制作のテンプレ及びツイッター背景をダウンロードしてくださったみなさん!
そしてご検討中のみなさん!ありがとうございます!!
この記事では、テンプレート名「12_whiteblog」「13_blackblog」の
簡単カスタマイズ(1)「アイコン変更」方法についてご説明します。
投稿日時部分にはそれぞれ、マグカップとカメラアイコンを使用しています。
このアイコンをお好きな画像に変更していただけます。
まずは画像をご用意ください。
切り抜きタイプにしたい場合は透過画像を、
サイズは横35~40ピクセル×縦35ピクセルがベストです。
用意できたら、ファイルをアップロードしてください。
変更はHTML編集になります。
テンプレートのHTMLには<!-- コメント -->がついているのですが、<!-- メインコンテンツ/エントリーここから -->
<!-- メインコンテンツ/エントリーここまで -->
の途中にある、
<!-- ◎投稿日時部分のアイコン変更はココ。詳しくはhttp://uraraka01.blog27.fc2.com/にて◎ -->
の箇所を探してください。
<img src="http://blog-imgs-46.fc2.com/u/r/a/uraraka01/12_cup.png" alt="" width="40" height="35" />
↑赤字の部分をアップロードした画像のパス(URL)に替えます。
必要であれば幅(width)を画像に合わせて変更します。
正方形であれば35pxにしてみてください。
おすすめは、プロフィール画像です♪
その場合は、
<img src="<%image>" alt="<%author_name>" width="35" height="35" />
としてみてくださいね!
ツイッターもしている方なら、ツイッター用のプロフィール画像にしてはいかがでしょう!
わからない点がございましたら、
コメントでもメールフォームからでも、
お気軽にお問い合わせくださいね~ -
ブログテンプレート『iPod black』『iPod white』CDジャケット表示方法
2010.09.20 23:32|カスタマイズ|ダウンロードしてくださったみなさん!ご検討中のみなさん!
ありがとうございますm(_ _)m
テンプレート名「04_ipodblack」「05_ipodwhite」は、
タイトル下にお気に入りのCDジャケットなど商品画像を表示できるようにしています。
それには、公式プラグインの「Amazon商品一覧【新着順】」を活用します。
少々ややこしいため、こちらでご説明させていだきます。
■表示させたい商品の登録
FC2ブログのマイショップという機能を使用します。
管理画面左側のメニュー、黄緑色の欄から「マイショップ管理」を選び、
お好きなAmazon商品を登録してください。
→マイショップってなに?どうやって商品登録するの?という方はコチラ(公式マニュアル)
マイショップ管理画面では、登録した商品をいろいろな方法でリスト表示できますが、
テンプレートに表示されるときは登録日時の新しい順になりますのでご注意ください。
ちなみに、マイショップではAmazonアソシエイトというアフィリエイトシステムを利用するよう促していますが、
アソシエイトIDがなくても商品登録できます。(広告収入にはなりませんが)
■プラグインの設定
プラグインは主にサイドバーに表示されるメニューです。
「プロフィール」とか「最新記事」などがそれにあたります。
→プラグインってなに?という方はコチラ(公式マニュアル)
管理画面左側のメニュー、黄緑色の欄から「プラグインの設定」を選び、
公式プラグインの追加で、カテゴリ3に「Amazon商品一覧【新着順】」を追加してください。
プラグインの挿入先にはカテゴリ1、2、3があり、表示位置やデザインを切り替えることができます。
このテンプレートでは、カテゴリ3に公式プラグイン「Amazon商品一覧【新着順】」のみを設定してください。
他のプラグインは設定しても表示できませんので、カテゴリ1または2にお願いします。
また、「Amazon商品一覧【カテゴリ別】」「Amazon人気商品」には対応していませんのでご了承ください。
→プラグインの設定方法についてはコチラ(公式マニュアル)
ちなみに、カテゴリ1はサイドバー左、カテゴリ2はサイドバー右。
カテゴリ2に設定がないと、2カラムになります。
■その他留意事項
・表示は商品イメージのみで、タイトルやレビューは表示されません。
・プラグインの設定上、最大10件まで表示可能です。(2010.9.19現在)
商品イメージのサイズは大小どちらを選択しても大丈夫ですが、
大6つ以上になるとスクロールバーが出ます。
・カテゴリ3に「Amazon商品一覧【新着順】」を設定しなければ、
タイトル下は空欄になります。
それでもおかしくないデザインにしているつもりです。
・CDやDVD以外の商品も、もちろん表示可能です。
さまざまな用途でご利用ください。