mysticdiary

更新はLittleDreamでしています。右のバナーからどうぞ

壁紙チェーンジ!

なんとなくかわいい系が続く今日この頃。
今度は壁紙が気軽に変更できる感じにしてみました。
デフォルトでは花柄です。

stripeflowersample.jpg


壁紙は3種類あります。あとの2つはCSSを書き換えてください。

stripeflowersample2.jpg


上のストライプの場合は、bodyのCSSを下記に変えます。
body {
font-size:15px;
font-family:'Lucida Grande','Hiragino Kaku Gothic ProN',Meiryo, sans-serif;
text-align:left;
color:#949198;
line-height:1.7em;
background-image:url(http://blog-imgs-58.fc2.com/m/y/s/mysticdiary/flower.jpg);
}
ここのbackground-imageを
background-image:url(http://blog-imgs-58.fc2.com/m/y/s/mysticdiary/stripe11.jpg);

こちらに変更します。

stripeflowersample3.jpg


上のタータンチェックの場合は、
background-image:url(http://blog-imgs-58.fc2.com/m/y/s/mysticdiary/tartan.jpg);

こちらに変更します。

それからサイドバーに表示させている写真は、変更可能ですが、
ご自分で250px×250pxの円形の画像を作る必要があります。
変更するには、下記のhtmlの画像リンクを差し替えてください。
<aside id="sidebar">
<div class="photo"><img src="https://blog-imgs-58.fc2.com/m/y/s/mysticdiary/baby.png"></div>
<!--plugin-->
<!--plugin_first-->
<div class="plugcontent">〜


あと、補足として、タイトルの文字が日本語の場合、大きすぎる場合は、
CSSで調整してください。
h1{
padding:80px 0 0 0;
margin-bottom:10px;
font-size:40px;
font-family: 'Monsieur La Doulaise', cursive;
}

この部分のfont-sizeを変更します。

ファイルは以下からダウンロードしてください。

stripeflower
stripeflower.html
stripeflower.html

stripeflower1.css
stripeflower.css

関連記事
baorin

いつも超ド近眼眼鏡をかけています。ああ、視力が良くなりたい・・・。好物はおすしです。性格はずぼらで人見知りです。こわい人がきらいです。

11 Comments

coco says..."CSSファイル"
CSSファイルが見つからないようで、ダウンロードできません。。。
別のテンプレのコメントでも見かけましたが、
また闇に消えてしまったのでしょうか。

このテンプレすごく気に入りました!
特に背景がどれもかわいくていいですね。
お手数ですが、再UP頂けないでしょうか。
2013.06.23 21:36 | URL | #qbIq4rIg [edit]
ゆゆみっくす says..."テンプレート使わせていただきました!"
ブログの模様替えを思い立ってから、なかなか好みに合うものが見つからず…
共有テンプレートを選ぶところで別のテンプレートを拝見し、こちらへ参りました。

シンプルで温かみがあるステキテンプレですね!

ブログ上での配布されているものを使うのは初めてなので、何か不備がありましたらお知らせください。

ありがとうございました。
2013.12.03 02:53 | URL | #- [edit]
管理人 says..."ゆゆみっくすさんへ"
こんにちは。

どうぞご自由にお使いください。
2013.12.06 12:43 | URL | #- [edit]
gassan says..."壁紙チェンジ graynight"
graynightのデザインが好きでお借りしました。壁紙を変更しようと512x512pxの画像に置き換えましたらタイル状になってしまいます。
一枚の画像をきれいに入れるにはどうしたらよいのでしょか。ご教授お願いします。
2014.01.27 23:33 | URL | #- [edit]
tartan says..."右サイドバーが一瞬消えるのは。。。"
共有テンプレートでいいなと思うものは、MDさんのものばかりで、ブログを見つけこちらにきました。どれも素敵で満足です。

早速、こちらのテンプレートを使っていますが、IE11で、画面の幅を変えると、一瞬右サイドバーが消え、下のほうに移動してしまいます。幅を変え続けると現れ、さらに幅が変わるとまた下のほうへ消えると言う現象です。何か対処方法がありましたらご教授いただけますと幸いです。

chromeでは大丈夫のようです。よろしくお願いします。
2014.07.28 23:37 | URL | #- [edit]
にゃー says..."写真について質問させて頂きます。"
ホームページ風ブログに使用されているホワイトタイガーの写真を
MysticDiary様で配布されているほかのブログテンプレートで使用しても
問題ないでしょうか?
ご返答どうぞよろしくお願いいたします。
2014.07.29 09:29 | URL | #- [edit]
tartan says...""
こんにちは。"右サイドバーが一瞬消えるのは。。。"でメッセージを送りましたtartanです。

フリーで提供いただいているのに、わがまま、勝手な質問で申し訳ありませんでした。
chromeできちんと見えていますので、ご対応していただかなくて大丈夫です。
お忙しい中、大変失礼しました。

別のテンプレート(circle)を使わせていただきます。こちらもシンプルで、気に入ってます。
これからも素敵なテンプレート、楽しみにしています。

私のコメント、どうぞ削除してください。ありがとうございました。
2014.07.29 10:29 | URL | #- [edit]
管理人 says..."にゃーさんへ"
こんにちは。

写真はフリー素材を使っているので自由にお使いくださって
結構ですよ。
よろしくお願いします。
2014.07.29 19:34 | URL | #i4E9Nobc [edit]
管理人 says..."tartanさんへ"
こんにちは。

ieで表示がおかしいとのことですが、aside#sidebarのcssを
aside#sidebar{
padding:0 3% 0 0;
width:23%;
float:right;
margin:0 0 50px 0;
text-align:left;
font-size:13px;
}
上の置き換えるともしかしたらうまくいくかも知れないです。
よろしくお願いします。
2014.07.29 19:39 | URL | #i4E9Nobc [edit]
tartan says..."右サイドバーが一瞬消えるのは。。。"
管理人さま

はい!大成功です!
個別に対応していただき本当にありがとうございました。
どう感謝をお伝えしたらよいのか。。。

やっぱりこのテンプレートも素敵です。私はtartan柄がお気に入りです。circleもとてもシンプルで使いやすいので、この2つのテンプレートを今後末永く使わせていただきます!

ありがとうございました。
2014.07.29 20:46 | URL | #- [edit]
にゃー says...""
お返事ありがとう御座いました!
がんばってホームページのようなブログを作ってみます!
2014.07.31 23:23 | URL | #JalddpaA [edit]

Leave a reply






管理者にだけ表示を許可する

Trackbacks

trackbackURL:https://mysticdiary.blog.fc2.com/tb.php/439-317aac59
← ブログくらい静かに・・・ → 天使がかわいい