mysticdiary

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

写真ブログに・・・

こんにちは。
今回は写真がメインのブログのためのテンプレート作ってみました。
アーカイブ画面では記事に投稿した写真が円形に並びます。

prettycirclemoc.jpg これはimagefitというjqueryプラグインを使ってます。
画像の一部分を適当なサイズに切り取ってくれる便利なプラグインです。
画像が小さいときは適当に拡大してくれるし、大きいときは適当に縮小してくれます。
調整が必要な方はリンク先のページを参照してみてくださいね。

その他のページは普通な感じです(笑)。

prettyblog.jpg

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

prettycircle.zip
DOWNLOAD
関連記事
baorin

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

10 Comments

kino says..."新しいテンプレートが出るたびに楽しみです!"
現在dreamとphotogalleryをお借りしていますm(_ _)m
photogalleryなのですが、TwitterとIE11の互換性が悪いんでしょう。
IT11からTwitterのブログ記事URLを表示させるとテンプレートが崩れてしまいます。
chromeだと問題がないので、Twitter側かIE11のせいだと思われます。

MDさまにリクエストがございます。
オンノベ(オンラインノベル)用のテンプレートをつくっていただけないでしょうか?
カスタマイズなどはレクチャーしていただければ頑張ります!
ページや作品リストの自動生成なんて贅沢は申しません。
ヘッダーにメニューバー(メニューアイコン)と固定ページさえあれば、なんとか形になると思うんです。
よくを言えばvideoの固定ページもほしいかな……って。
オンノベファンがMDさまのテンプレートを待ち望んでいます!
お考えくださいませm(_ _)m
2014.05.26 15:22 | URL | #- [edit]
管理人 says..."飯田紗子さんへ"
こんにちは。

テンプレート使っていただきありがとうございます。

テンプレートは共有にしているものと、このブログからダウンロードするものと
二種類ありますが、どちらもFC2ブログのテンプレートとして使っていただけます。

ダウンロードしたテンプレートは解凍して、HTMLとCSSそれそれのファイルの中身をコピーして
テンプレート編集画面に貼りつけるだけです。

よろしくお願いします。
2014.05.27 11:14 | URL | #i4E9Nobc [edit]
管理人 says..."kinoさんへ"
こんにちは。

テンプレート気に入っていただきありがとうございます。
photogalleryはだいぶ古いテンプレートなのでいろいろ不具合が出るかも
しれませんね。リメイクしようかとも思うのですが、なかなか時間がとれず
先延ばし状態になってます。

リクエストはご希望に添えるとは申せませんが、
心に留めておきます。

よろしくお願いします。
2014.05.27 11:18 | URL | #i4E9Nobc [edit]
yuu & maa says..."はじめまして。"
MDさま、はじめまして。
yuu & maaと申します。
どのテンプレートもセンスがあってとっても素敵ですね。

この“prettycircle”も一目惚れです。
全くの初心者で申し訳ありませんが、質問させてください。

記事の本文部分の幅を広くしたいと思っています。
現在、写真の幅が900ピクセルあります。
どの部分の数字を変えたら良いのでしょうか?
サイドメニューの幅も同様に教えて頂けると嬉しいです。

また、記事の幅を変えるとアーカイブ画面の幅も連動して
変わってしまうのでしょうか?
アーカイブ画面の幅とその写真サークルの大きさの設定等
も教えて頂けませんか?

いろいろと試したのですが上手くできませんでした。
勉強中の初心者で申し訳ありません。
MDさまのセンスをそのままにカスタマイズしたいと思ってます。
よろしくお願いします。
2014.05.28 17:35 | URL | #G.if4xVY [edit]
管理人 says..."yuu & maaさんへ"
こんにちは。

本文の幅を広げるにはcssの


section#permanent{
width:700px;
margin:0 0 0 50px;
float:left;
}

このwidthの数値を変えます。
サイドバーは


#sidebar{
width:200px;
margin:0 50px 0 0;
float:right;
}

この部分です。

ただブログ全体の幅が1050pxなため、本文の幅を写真に合わせて900pxまで広げると
サイドバーが150px以下になってしまいますのでちょっと無理があると思います。
写真をそのままのピクセルで載せたい場合は、管理人のテンプレートのsilenceのような
1カラムを使用するか、写真を縮小してもよいという場合は、

.blogpost img{
max-width: 100%;
height: auto;
width /***/:auto; 
}
上記のcssを書き加えてみてください。
2014.05.30 13:38 | URL | #i4E9Nobc [edit]
管理人 says..."名無しさんへ"
こんにちは。

__MACOSXというのはマックで圧縮したものをウィンドウズで解凍すると
自動的にできるファイルですので、無視してかまいません。

ブログが構築できないとのことですが、ためしにウィンドウズで解凍して
貼りつけてみましたが、特に問題ないようです。

やり方としては、デスクトップなどにダウンロードしたzipファイルを、圧縮解凍ソフトで解凍し、
中身のhtmlとcssファイルを開きます。
htmlを開けるテキストエディタがない場合は、無料のものもいっぱいありますので
ダウンロードしていただくか、それが面倒な場合は、htmlの拡張子をtxtに変更して
ブラウザのファイルの開くからファイルを開きます。文字化けしているようであれば、
エンコードをUTF-8にします。
そして中身を全部コピーします。
cssは多分そのまま開けますが、文字化けしているようであれば
上と同様にします。
FC2ブログのテンプレート管理画面で、適当なテンプレートの編集を選び、最初に中身を全部
削除して、先ほどコピーした内容を新たに貼りつけます。
htmlは上に、cssは下の画面に貼りつけます。
あとは更新ボタンを押すだけです。

よろしくお願いします。
2014.05.30 13:53 | URL | #i4E9Nobc [edit]
yuu & maa says..."ありがとうございます。"
MDさま、こんにちは。
コメントするのが恥ずかしいくらいの初心者に
丁寧に教えて頂き、ありがとうございます。

いろいろ試せば試すほど素敵なテンプレートだな〜!っと思っています。
写真の大きさなども考えて検討してみます。

これからも素敵な作品を楽しみにしています。
ありがとうございました!
2014.05.30 21:44 | URL | #G.if4xVY [edit]
ks says..."アーカイブ画面での記事写真数につきまして"
いつもテンプレートを使用させていただいております。

こちらのprettycircleを新たにお借りし、試しに使ってみましたところ、アーカイブ画面には3つの記事写真が表示されました。
上のサンプルのように、アーカイブ画面に9つの記事写真が表示されるよう設定したいと思うのですが、その設定方法を教えていただけますでしょうか。
お忙しいところお手間をお掛けすることとなり、本当に恐縮なのですが、どうかご確認のうえ、コメント欄よりお返事をいただけましたら幸いです。

どうぞよろしくお願いいたします。
2014.06.09 20:26 | URL | #- [edit]
管理人 says..."ksさんへ"
こんにちは。

表示される記事の数は管理画面からブログの設定で記事の数を設定してください。
よろしくお願いします。
2014.06.11 10:56 | URL | #i4E9Nobc [edit]
ks says..."ありがとうございました!"
こんにちは。

本日は、さっそくにお返事をいただき、大変ありがとうございました。
テンプレートではなく、FC2の管理画面から設定しなければならなかったのですね・・・
おかげさまで、無事に設定することができました。

お忙しいなか、お手数をお掛けしまして恐縮です。
直接テンプレートに関する質問ではなかったにも関わらず、ご親切にお返事をくださり、本当にありがとうございました!

これからも、素敵なテンプレートのアップを楽しみにしております。
2014.06.11 16:54 | URL | #- [edit]

Leave a reply






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

Trackbacks

trackbackURL:https://mysticdiary.blog.fc2.com/tb.php/465-2be99e16
← こりだすとそればっかり → 久々にテンプレート作りました。