月別アーカイブ

タグ

twitter 2カラム(右) グリーン 3カラム スマートフォン    ブラウン ベージュ ピンク ブルー 2カラム(左) イエロー    ホワイト グレー 写真   観覧車 ミントグリーン ゴールド  リボン ブラック ドット パール 水玉  パープル  lomo オレンジ ハロウィン ディープブルー ネイビー  2カラム クローバー 植物  和風 フレンチ ノート カラフル 

記事検索

FC2ブログとは?

わたしが作成しているテンプレートは「FC2ブログ」というサービスで利用できます。
無料のブログサービスはいくつもありますが、1GBの大容量ということとギラギラした広告がなくデザインの自由度が高いという点でおすすめです!
オリジナリティが出せるので、個人はもちろんショップやサークルのオフィシャルブログとしても十分活用できると思います。
PCの他、携帯やスマートフォンからも閲覧・投稿ができるところもポイント。 これからはじめてみたい方はぜひ。
そして、このブログで紹介しているデザインは共有テンプレートとして配布(もちろん無料)していますので見てみてくださいね。

プロフィール

うららん

管理人:うららん
自作のブログテンプレートやツイッター背景を配布しています。
心がけているのは、記事やつぶやきが主役になるよう、邪魔しない、かつ居心地がいいデザインであること。よって、かなりシンプルです。
よろしければ、ご自由にお使いください。
ただの物好きがつくっていますので、至らない点が多々あると思いますが、大目にみてくださいね。


タイトルの由来は、日々、麗らかであるようにとの願いから。

うら-らか【麗らか】
1 空が晴れて、日が柔らかくのどかに照っているさま。
2 声などが晴れ晴れとして楽しそうなさま。
3 心にわだかまりがなく、おっとりしているさま。
(大辞林より引用)

My twitter

My facebook

お問い合わせ

名前:
メール:
件名:
本文:

フリーエリア

お休みのお知らせ

2013年9月以降、コメントやご質問、お問い合わせへのお返事をお休みしております。
どうぞご了承ください。

ブログで紹介しているテンプレートはFC2ブログ用です。ログイン後、管理画面の共有テンプレート追加からダウンロードしてご自由にご利用いただけます。商用利用もどうぞ。

※再配布不可との記載のは、テンプレートや使われている画像をご自分のものとして他の人に配布したり掲載したりを禁止しているだけですので、カスタマイズ中の不具合などで再度ダウンロードしていただくのは何回でもOKです!

PR

ブログテンプレート『circle wood』

2011.04.23 19:32|ブログテンプレ
23_thm_l.jpg
▲FC2ブログ用テンプレート:23_circlewood

※共有テンプレートの承認までは数日のタイムラグがある場合があります。

背景の木のイラストが印象的なシンプルテンプレートです。
さわやかなグリーンで、北欧のテキスタイルのようになりました。
落ち着いた柔らかい雰囲気なので、ブログを書くほうも読むほうも
リラックスしていただけると嬉しいな(●^o^●)
リンク文字にマウスを重ねたとき、アクセントカラーのスモーキーオレンジが見え隠れします。

おそろいでツイッター背景もどうぞ~。→コチラ
関連記事

テーマ:共有テンプレート
ジャンル:ブログ

コメント

ご質問

初めまして。突然のご質問お許し下さい。素敵なテンプレート、是非お借りしたいと考えているのですが、この「23_circlewood」の記事幅を広げることは可能でしょうか?640×480サイズの写真を貼り付けたいのですが、端が切れてしまうので、記事幅を広げたいと考えております。もしカスタマイズ可能でしたら、方法を教えていただきたく思います。もし不可でしたら、写真の幅のピクセル数はどれ位にすれば記事幅に収まるか、ご教授いただければ幸いです。お忙しい中、大変恐縮ですが、宜しくお願い致しますm(_ _)m

Re: ご質問

PIYO 様

はじめまして。
ご質問ありがとうございます。

『circle wood』は写真500pxでちょうどの記事幅になっています。
もし点数が少ないようでしたら、写真のサムネイルを500pxに直していただくと、
レイアウト的にはベストだと思います。


記事幅を広げることは可能です。
方法は、テンプレートのスタイルシート編集で下記の箇所をカスタマイズしてください。

/*--------------------------------------------------
レイアウト
--------------------------------------------------*/
の下から、
div#main {
width: 550px;
margin: 40px 0 40px 0;
float: left;
background: url(http://blog-imgs-44.fc2.com/u/r/a/uraraka01/23_toukabg.png);
border: solid 2px #a7c5a5;
}
の記述を探します。
下線が幅(記事幅500px+両端余白各25px)ですので、必要分プラスしてください。
PIYOさんの場合+140pxですね。

記事幅を広げることで修正しなくてはいけないところがあります。
記事のタイトルの背景にはグリーンのテクスチャが敷いてありますが、
幅ぴったりの画像になっていますので、
横にも繰り返し表示するように変更します。

/*--------------------------------------------------
メインコンテンツ
--------------------------------------------------*/
の下、
h2.kizi_title {
background: url(http://blog-imgs-44.fc2.com/u/r/a/uraraka01/23_kizititle.jpg) repeat-y;
text-align: left;
margin: 0 0 5px;
font-size: 120%;
color: #fdfdf3;
padding: 15px 25px 10px;
line-height:1.1em;
}
下線が背景画像の繰り返し設定で、
現在は縦方向にだけ繰り返す設定になっていますので、
この記述を削除してください。
これで縦にも横にも繰り返す設定になります。


以上、カスタマイズ方法ですが、
広げることで、他にも多少表示が崩れる場合があるかもしれません。
そのあたりは個別ですので、ご自身おまかせでお願いしますm(_ _)m

3カラムなので幅が広がるとバランス、どうかな~(*>.<*)
今、大多数の方が広い画面でご覧になっていると思うので、大丈夫かな??

わたしのテンプレートは、カスタマズはご自由に~と許可していますので、
とことんお好みに変えていってくださいね!

よりすてきなブログになりますように。
今後ともよろしくお願いいたします。

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

ご丁寧なご回答、ありがとうございました!早速やってみましたが、やはり表示が崩れてしまいました★写真のサイズを小さくして使わせていただこうかと思っています♪本当にありがとうございました☆

Re: ありがとうございました♪

PIYO 様

さきほどの回答でもうひとつ重要なことを伝え忘れていました。
気づいて書こうとしましたら、もうPIYOさんからのお返事があって…
申し訳ありませんm(_ _)m
もう一度ブログをのぞいてくださることを祈って追記しますね。

記事幅を広くするので、
ページ全体の幅も広くする必要があります。
そうしないと、カラム落ち(サイドバーが下に回り込んでしまう)してしまうと思います。
スタイルシートの編集で、
次の下線の部分を変更してださい。

/*--------------------------------------------------
レイアウト
--------------------------------------------------*/
div#container {
width: 1030px;
margin: 0 auto;
}

PIYOさんの場合は+140pxですので、1170pxとしてみてください。

すみませんでした…よろしくお願いいたします!!

本当にありがとうございます☆

無事カスタマイズ出来ました、本当にありがとうございます!
この度はご多忙な中、私の質問にご丁寧にお答え下さいまして深く感謝致します^^
これからも素敵なテンプレートを期待しています♪
本当にありがとうございました(≧▽≦)

質問( p_q)

23_circlewoodのテンプレートを使用したいのですが、デフォルトで適用しようとすると記事部分(センター)が全く表示されません。
サイドバーは両側とも表示できるのですが、原因がわかりません。

考えられる原因って何かあるでしょうか?

できました。

質問してましたが、いろいろやってるうちにできました!
テンプレートお借りします!ありがとうございました!!

Re: できました。

ほすとも 様

はじめまして。
コメントありがとうございます。
解決されて、よかったです(●^o^●)

今後ともよろしくお願いいたします。

ご質問

初めまして。

爽やかな北欧風デザインが気にって、5月末くらいからこのテンプレートを使わせていただいてます。とっても気にいってます♪ありがとうございます。

1つお伺いしたいのですが、本文の中でリンクのhtmlが埋め込んである部分を色が変わるようにするorアンダーラインを引いてリンクが貼ってあることがわかるようにしたいのですが、html?CSS?のどこをどのように直したら良いのでしょうか?

お手数ですが、教えて頂けたら嬉しいです。よろしくお願いしますm(_ _)m

Re: ご質問

Akane 様

はじめまして。
コメントありがとうございます。

ご質問の件ですが、
スタイルシートの下記の部分で変更できます。

/*--------------------------------------------------
リンク
--------------------------------------------------*/
a {
text-decoration: none; ←下線をつける場合はunderlineに
}
a:link,
a:visited {color: #222222; } ←通常リンク時、訪問済みリンクの文字色
a:hover,
a:active {
color: #f5896c; ←ロールオーバー、読み込み中の文字色
font-weight: bold;
position: relative;
top: 1px;
left: 1px;
}

詳しくは公式カスタマイズマニュアルをご覧いただくといいかと思います。
http://blog.fc2.com/custom_manual/#m005

よろしくお願いいたします。

ご質問。

うららんさま、初めまして。
7月からFC2でブログを始めるにあたり、
大好きな北欧テイストの優しいデザインにひとめ惚れして、
使用させていただいております。

ひとつ教えていただきたいのですが、
本文中最後にある、カテゴリーの右隣のコメント表示をさせる部分が、ー本文ーと表示されてしまいます。
これを直すのには、どのようにしたらよろしいのでしょうか。

知識が乏しく、大変失礼なご質問かと思いますが、
どうぞよろしくお願いいたします。

Re: ご質問。

すぴか 様

はじめまして。うららんです。
テンプレのダウンロードありがとうございます。

さっそくご質問の件ですが、
カスタマイズされた際、HTMLが書き換わってしまったのだと思います。
修正箇所はHTML編集の
<!ーーメインコンテンツ/エントリーここからーー>から
<!ーーメインコンテンツ/エントリーここまでーー>
の間から、以下の部分です。

<div class="entry_footer">
Category: <a href="<%topentry_category_link>" title="<%template_view_category>"><%topentry_category></a> 
<!--allow_comment-->
<a href="<%topentry_link>#cm" title="">Comment: <%topentry_comment_num></a> 
<!--/allow_comment-->
<!--deny_comment--><!--/deny_comment-->
</div>

すぴかさんのテンプレートが見れないのですが、
おそらく下線の部分が「本文」となってしまっているのだと思います。

よろしくお願いいたします。

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

うららんさま

早速のお返事ありがとうございます。
教えていただいた通りに訂正しましたら、直すことができました。
知識がないのに、手を加えてしまったことを反省です。

今回、このような質問にわかりやすく丁寧にご回答いただき、
本当にありがとうございました。

また素敵なテンプレートを発表されるのを楽しみにしています。

お願い。

こんばんわ。
初めてコメントします。

このテンプレートがとっても気に入ったのですが
2カラムを製作するご予定はありませんか?

余裕がありましたらば2カラムも宜しくお願い致します。

他の作品を見てみましたらば
気に入ってDLしたものが多数ありました。

いつもステキな作品ありがとうございます。

Re: お願い。

eriboo 様

はじめまして。
コメントありがとうございます。

2カラムですね(;^_^A
『circle wood』はそんなに大変じゃないので…
時間ができたら、つ、つくろうかなぁ。

期待してください。
よろしくお願いいたします。

ありがとうございます。

こんばんわ。

嬉しいコメントありがとうございます。
私、2カラムが好きで3カラムは使った事がないんです。
首をなが~くして楽しみにしてます^^

宜しくお願いいたします。

No title

もう作っていただけたんですね。
ありがとうございますm(__)m
早速DLしてきます。

はじめまして

今日初めてうららん様のブログを拝見した者です。
他の方と同じ質問になってしまって恐縮なのですが、どうしても自分で解決できなかったことがあり、書き込みさせていただいています。

circlewoodの3カラム版をぜひ使わせていただきたいのですが……記事欄の最後の「Comment」と表示されるべき部分が、私のPCでも「本文」となってしまうのです。
カスタマイズは一切しておりません。
当方、今月からブログを始めたばかりの初心者で、まだまだ勉強不足で、こんな質問でお恥かしいのですが、ご教授いただけると幸いです。
以下、この箇所が関係しているのではないか、というHTMLをコピペしておきますね。(違っていたらごめんなさい)

<div class="entry_footer">
Category: <a href="<%topentry_category_link>" title="<%template_view_category>"><%topentry_category></a> 
<!--allow_comment-->
<a href="<%topentry_link>#cm" title=""><%template_body>: <%topentry_comment_num></a> 
<!--/allow_comment-->
<!--deny_comment--><!--/deny_comment-->
<!--allow_tb-->
<a href="<%topentry_link>#tb" title="">Trackback: <%topentry_tb_num></a>
<!--/allow_tb-->
<!--deny_tb--><!--/deny_tb-->
</div>

Re: はじめまして

ゼフィルス 様

はじめまして。
コメントありがとうございます!
早速、ご質問の件ですが、
添付していただいたタグの中で下記の箇所を
「Comment」と上書きしてみてください。

<div class="entry_footer">
Category: <a href="<%topentry_category_link>" title="<%template_view_category>"><%topentry_category></a>
<!--allow_comment-->
<a href="<%topentry_link>#cm" title=""><%template_body>: <%topentry_comment_num></a>
<!--/allow_comment-->
<!--deny_comment--><!--/deny_comment-->
<!--allow_tb-->
<a href="<%topentry_link>#tb" title="">Trackback: <%topentry_tb_num></a>
<!--/allow_tb-->
<!--deny_tb--><!--/deny_tb-->
</div>

配布中のテンプレートは正しくなっていますので、
何かの拍子に書き替わってしまったのでしょうね。

もし今後も、カスタマイズしていないのに表示がおかしくなったら、
再ダウンロードして適用してみるといいと思います。
またはちょっとお時間かかるかもしれませんが、
こちらにもお気軽にお問い合わせくださいね。

よろしくお願いいたします。

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

ご報告とお礼の書き込みが遅くなりまして、申し訳ありません。
テンプレート表示の件、教えていただいた通りにタグを修正したら、直りました。「body」というのが本文のことだったのですね。

またわからないことがあったら、書き込みさせていただくことがあるかもしれません。その時はよろしくお願いいたします。
このたびはご親切に教えてくださってありがとうございました!!

FC2拍手に関しての質問です

はじめまして。今月からFC2に引っ越して来たものです。
circlewoodの3カラムを使わせてもらっています!とても気に入っています。

そこでFC2拍手に関しての質問なのですが、拍手をして頂いた方に自分で用意したお礼画像を表示させたいと思っています。
(サイト用のFC2拍手ではなく)ブログ記事ごとに設置するFC2拍手を入れたいのですが、タグを作成してもテンプレートのどこに入れたらよいのか分かりません。
作成画面には「「テンプレートの設定」→HTML、CSSの「編集」でHTML編集を開き、<!--topentry--><!--/topentry-->内に下記タグを貼り付けてください。」と表示されるのですが、この部分が編集画面のどこに該当するのかが分からないのです。
ブログのカスタマイズに関しては全くの素人なので、できれば小学生にも分かるような(笑)説明をして頂けたら大変ありがたいです。

何卒ご教示くださいませ。

Re: FC2拍手に関しての質問です

からたち3号 様

こんばんは。
ダウンロードありがとうございます。

ご質問の件ですが、
HTML編集の中で、下のようなエントリー(投稿記事)に関する部分があります。
長いのでわかりずらいですが、よく見ると<!--topentry-->から<!--/topentry-->ではさまれています!
この間でしたらどこに書いてもいいということになりますが、
通常、本文のあとがいいと思いますので、

<!--メインコンテンツ/エントリーここから-->
<!--not_titlelist_area-->
<!--not_search_area-->
<!--topentry-->
<div class="content">

<div id="entry_header">
~中略~
</div>

<div class="entry_body">
<%topentry_body>
<!--more_link-->
<p class="entry_more" class="png_bg"><a href="<%topentry_link>#more" title="<%topentry_title>"><%template_extend></a></p>
<!--/more_link-->
<!--more--><div id="more"><%topentry_more></div><!--/more-->

※この辺りはいかがでしょう?

<!--community-->
<p class="theme">
<%template_theme>: <a href="<%topentry_thread_link>" title="<%topentry_thread_title>"><%topentry_thread_title></a><br />
<%template_genre>: <a href="<%topentry_community_janrelink>" title="<%topentry_community_janrename>"><%topentry_community_janrename></a>
</p>
<!--/community-->
<!--topentry_tag-->
<p class="theme">
タグ: <%topentry_jointtag>
</p>
<!--/topentry_tag-->
</div>

~中略~

<div class="entry_footer">
~中略~
</div>

~中略~

</div><!--/content-->
<!--/topentry-->

<!--/not_titlelist_area-->
<!--/not_search_area-->
<!--メインコンテンツ/エントリーここまで-->

場所はいろいろとお試しください。

よろしくお願いいたします。

ありがとうございます!

できました!
本当にありがとうございます。
本文の後に設置することもできました!

丁寧なご説明、本当に助かりました。
まだまだ寒い日が続きますが、どうぞご自愛くださいませ。
非公開コメント