スポンサー広告

スポンサーサイト

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

《FC2》(マルチカテゴリー)《FC2》テンプレート/プラグイン

テンプレートを試着~プレビューという機能




たくさんある共有テンプレート。小説ブログで一番気になるのは、「自分のページの、カテゴリー画面」がどう表示されるか、ということ。
ここでは、各画面にタイトルリストがついているのがとても「benri」な、myhurtさんのテンプレート作品を例にさせていただき、このブログの「カテゴリー2」を見てみました。
http://adankadan.blog47.fc2.com/?cat=2&style3=1426(benri-navi_cz_hana)
ブラウザの「アドレス」欄にご注目を。このように、自分のブログのURLに「?cat=[カテゴリー番号]&style3=[共有テンプレ番号]を入れると、「テンプレートを試着する」ことができます。(管理者画面でいう「プレビュー」ですね)
benri-navi_cz_mori(1425) / benri-navi_flower_bl(1625) / benri-navi_2col_mono(2228) / benri-navi_60s_blue(3580) / benri-navi_sky_blue(7167)

もうちょっとイロイロ
リンク集は移動しました。
他のFC2ブログで見た機能を入れたい、他ブログと同じテンプレートを使いたい
よく見る改造、どこにある
「ブログで小説」に、おすすめのプラグイン
スポンサーサイト

テーマ : ブログアクセス
ジャンル : ブログ

《FC2》(マルチカテゴリー)《FC2》テンプレート/プラグイン

テンプレ紹介1“Odin”

[2006/7/30追記]当ブログは“odin”で小説を連載する実験ブログとしてスタートしましたので、“odin”の紹介記事が他のテンプレートの紹介記事より「基本事項を押える」色合いが濃くなっています。 前のページで引用した「ブログの欠点」について、FC2ブログ&“Odin”テンプレートの特徴を上げてみます。

新しい記事が上に来てしまうので最初から読むのがむずかしい。

  • FC2ブログにはもともと、古い記事から並べる機能がある。

デザインが長文に向かない 余計なパーツが多くて読むのに集中できない。

  • “Odin”の各記事閲覧ページご参照ください。
  • 「普通のHTML」で書かれたページと同程度には読みやすい。(と思うww)
  • 余計なパーツは隠されている。

一覧性に欠ける。

  • “Odin”のカテゴリINDEXページご参照ください。
  • 連載各回入力のたびに「カテゴリ」を指定(簡単です)をしておけば、基本的な目次は自動で作成してくれる。
  • VIEW”か“heimdal”の併用で、「ブログの全記事」「カテゴリーごとの全記事」が簡単に見られる。

「前へ」「次へ」の移動ができない。

  • この項目だけ、ちょい問題が残ってます。
  • 一つの連載だけ連続して掲載してゆくのなら問題は僅少ですが。(たとえばこのページ。一番下を見てください)
  • 連載の途中に他の作品が入り込んでくるときに、連載の次の回に飛ぶリンクがない。(たとえばこのページ。一番下を見てください)
  • 2006/4/15現在、“Odin”の各記事閲覧ページに「カテゴリINDEXページ」へ戻るリンクを付ける改造で、かろうじて使えないかと愚考中。(見本改造方法
  • VIEW”/“heimdal”の「カテゴリーごとの全記事」を<iframe>で見せたら……。
    2006/4/18追記:ちょっとテスト中だったりする。。all画面専用/カテゴリ1/カテゴリ2/カテゴリ3/カテゴリ4/カテゴリ5

追記

FC2にログインしている状態で、記事表示右上のEditをクリックすると、その記事を編集する画面が出るんですね……。めちゃくちゃ便利<後から気づいたのは秘密。

tag : テンプレート紹介 【ブログで小説!】

《FC2》(マルチカテゴリー)《FC2》テンプレート/プラグイン

共有テンプレートの入れ方

この記事は「ブログ初めて借ります」くらいのレベルの方に向けて書いています。「この程度のことをイチイチ解説するなぁヽ(`Д´)ノ」といわずに読んでください。
【ブログを借ります】
FC2でブログを作成。

【テンプレートを入れます】“Odin”の例
管理画面より。
[テンプレートの設定]→[ユーザー共有テンプレートから選択]→[名前順「O」]→“Odin”→[ダウンロード]
(ここで同様に“VIEW”“heimdal”もダウンロードするのが、お勧め)
[テンプレートの設定]→“Odin”→[このテンプレートに変更]

【並び順を古い順に】
日記系のブログは新着順に並べるのが一般的ですが、小説連載の場合は「古い順」のほうが、閲覧者からみて読みやすいと思います。
管理画面より。
[環境設定]→[ブログの設定]
[記事の表示の方法]=日付が古い順
[最初に表示する記事の数]=[適宜]
[最近の記事の表示数]=[適宜]
※記事数、表示数は、連載回数や更新頻度にあわせて設定します。私の場合、当初は、「最初に」10、「最近」3くらいで設定していました。。
[保存]

【プロフィールの編集】
も行なうことをお勧めします。

【リンクの編集】
本来は他サイトへのリンクを入れておく場所ですが、全記事一覧をリンクしておくと便利です。
テンプレート“VIEW”をダウンロードした状態で、URL欄に「./?style2=view&all」と入力すると、“VIEW”全記事一覧へ。(“VIEW”には、タイトルを数秒クリックしたままでいると編集画面に移行する機能があります。管理人にとって非常に便利)
“heimdal”をダウンロードし、「./?style2=heimdal&all」と入力すると、“heimdal”全記事一覧へ。
「./?all」と入力すると、FC2の用意した全記事一覧へのリンクを作成することができます。

【小説を入力します。】
管理画面より。[新しく記事を書く]で入力します。
連載の場合には、[カテゴリーの追加]で連載小説のタイトルの“カテゴリ”を作成し、連載小説を追加したときには忘れずにカテゴリを指定してください。
カテゴリの目次を表示させるために必要です。
これだけで、このブログと同じ体制になりまして。ほぼ、“小説ブログ”として実働可能じゃないかと思います^^

《FC2》(マルチカテゴリー)ただいま実験中

この記事は、麻生(阿檀)がごちゃごちゃと実験をするところです

                                


なんどもたたむよ(←こら)
山のあなたの空遠く

噫、われひとと尋めゆきて

山のあなたになお遠く

http://www.tohoho-web.com/lng/200003/00030266.htm


This is a testing article.............


この記事は、麻生(阿檀)がごちゃごちゃとFC2の実験をするところです。

<div style="margin-left:auto;margin-right:auto;width:48px;"><img src="http://blog-imgs-18.fc2.com/a/d/a/adankadan/owabipenguin.gif"></div>

<img src="http://blog-imgs-18.fc2.com/a/d/a/adankadan/owabipenguin.gif" alt="penguin" border="0" align="right">↓


<img src="http://blog-imgs-18.fc2.com/a/d/a/adankadan/owabipenguin.gif" alt="penguin" border="0" align="center">↓


<center><img src="http://blog-imgs-18.fc2.com/a/d/a/adankadan/owabipenguin.gif" align="center"></center>


class="mytable" ↓












































































































































1 1
1 2 3 4 5 6 7 8 9 10 11
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12














































































































































1 1
1 2 3 4 5 6 7 8 9 10 11
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12
1 2 3 4 5 6 7 8 9 10 11 12




blockquoteタグのメモ

<blockquote style="border:1px solid #cccccc ;padding:0 8px 1em 8px;">
●●●●
</blockquote>


タイトル長スギの実験を兼ねていますww
長いタイトルって、あるじゃないですか、『アンドロイドは電気羊の夢を見るか』とか『そして目覚めると、わたしはこの肌寒い丘にいた』とかww(例が偏ってるのは気にしない(゚∀゚)ノ)

ダウンロード済みテンプレでページを見る
http://blog47.fc2.com/adankadan/?no=1&style2=default

共有テンプレでページを見る
http://blog47.fc2.com/adankadan/?no=1&style3=6585

カテゴリーを見るURL
http://blog47.fc2.com/adankadan/?cat=1&style2=default
http://adankadan.blog47.fc2.com/?style2=default&cat=2&page=1

Myhurt作品てプレビューテスト
benri-navi_cz_hana
benri-navi_cz_mori
benri-navi_flower_bl
benri-navi_2col_blue
benri_navi_3col_mono
benri_navi_3col_red
benri-navi_2col_red
benri-navi_cz_lovers
benri-navi_2col_mono
benri-navi_fl_brown
benri-navi_60s_blue
benri-navi_60s_brown
benri-navi_60s_orang
benri-navi_town_blue
benri-navi_town_gree
benri-navi_town_pink
benri-navi_town_yelw
benri-navi_2col_blck
benri-navi_fl_violet
benri-navi_sky_blue
benri-navi_sky_gray
benri-navi_sky_sun

全記事を見るURL
http://blog47.fc2.com/adankadan/archives.html

http://blog47.fc2.com/adankadan/?all





なんか正しくなさそうな英語が入ってるのは、ソース表示を見るときのマーキングなので、つっこまない方向で、please.............

《FC2》(マルチカテゴリー)《FC2》テンプレ改造etc.

“Odin”記事のあとに目次画面へリンク

※2006/5/29現在、下記の改造を施した“odin”にて実働しております。
“Odin”の特徴』で書いたとおり、各記事を読み終わったときにせめて目次に戻りたい。

連載が30回を越えると、全記事表示へのリンクもあったほうがいいと思うのです。(下記の変更は、"VIEW"テンプレートがダウンロードしてある必要があります)

それから、左側に後記事、右側に前記事が出ているのを逆にしたほうがいい。下記は、小説ブログ実験中さんの内容を“Odin”の具体的な記述に置き換えたものです。


「テンプレート設定」→「Odin、修正」→「HTMLの編集…」の表示の下の枠の中、「<!--nextentry-->」を検索します。(IEだと検索は「Ctrl+f」です)
<!--nextentry-->
<a href="<%nextentry_url>" class="l nv" title="前の記事"> <%nextentry_title> ≪</a>
<!--/nextentry-->
<!--preventry-->
<a href="<%preventry_url>" class="r nv" title="次の記事" >≫ <%preventry_title></a>
<!--/preventry-->
という記述を
<!--■改変部分■-->
<!--topentry-->
<P style="text-align:center;font-weight: bold;">
<a href="<%topentry_category_link>" title=" テーマ(カテゴリ) " >
<%topentry_category>index</a>

<a href="./?style2=view&all">全記事INDEX</a>
</P>
<!--/topentry-->
<!--preventry-->
<a href="<!%preventry_url>" class="l nv" title="次の記事" > <%preventry_title>≪</a>
<!--/preventry-->
<!--nextentry-->
<a href="<!%nextentry_url>" class="r nv" title="前の記事">≫ <%nextentry_title> </a>
<!--/nextentry-->
<!--■/改変部分■-->
という記述に入れ替えます。

さらに、スタイルシートの編集 ……の枠の中にある
a:link {color:#557;text-decoration:none;}
a:visited {color:#557;text-decoration:none;}
a:link {color:#557;text-decoration:none;}
a:visited {color:#779;text-decoration:none;}
という記述に入れ替えて、未閲覧リンクと閲覧済みリンクで色を変え、どこまで読んだか判りやすくしてみました。
各記事見本(一番下まで見てください)
カテゴリーINDEX見本(既読記事は色変更)

《FC2》(マルチカテゴリー)《FC2》テンプレ改造etc.

テンプレート“View”で長いタイトルを表示

テンプレート“View”で全記事表示すると、長いタイトルは切れてしまいます。
あれ?と思って、ソース拝見して、驚いたのですが。
長いタイトルを「途中で切ってコンパクトに表示する」ために、色んな設定がしてあったのですね。

それに感動^^する一方で、ですね。

モノカキは言葉フェチなので(え?あたしだけです??)、自分でつけた作品のタイトルが切れてしまうのは、ちょっとカナシイ(あ? あたしだけだったらいいんです、この先は読まなくて)

というわけで。「タイトルを途中で切ってコンパクトに表示するための、種々の設定を切る方法」、公開。(だーかーらー。タイトル切れてOKの方、あるいは切れないくらい短いタイトルばかり使う方は、読まなくていいんですってば)

(PCafeさん、ごめんなさいm(_ _)m)

下記変更導入後はこうなります。(ついでに、訪問済みリンクの色も“Odin”とカラーコーディネートして変えてあります)


変更点1
「テンプレート設定」→「View、修正」→「HTMLの編集…」の表示の下の枠の中、

<!--titlelist_area-->
<ul id="EL"><!--titlelist-->
<li id="a<%titlelist_year><%titlelist_month>c<%titlelist_category_no>e<%titlelist_eno>">
<span><%titlelist_year> <%titlelist_month> <%titlelist_day> <%titlelist_youbi></span>
<a href="<%titlelist_url>" title="<%titlelist_body>"
onmousedown="ed(<%titlelist_eno>)" onkeydown=""
onmouseup="clearTimeout(ED)" onkeyup="">
<%titlelist_title></a>
<em><%titlelist_category></em>
</li><!--/titlelist--></ul>
<!--/titlelist_area-->
の部分を下記のように変更

<!--titlelist_area-->
<ul id="EL">
<!--titlelist-->
<li id="a<%titlelist_year><%titlelist_month>c<%titlelist_category_no>e<%titlelist_eno>">
<a href="<%titlelist_url>" title="<%titlelist_body>"
onmousedown="ed(<%titlelist_eno>)" onkeydown=""
onmouseup="clearTimeout(ED)" onkeyup="">
<%titlelist_title></a><br>
<span class="num"><%titlelist_year>/<%titlelist_month>/<%titlelist_day> - </span>
<span class="cat"><%titlelist_category></span>
</li><!--/titlelist--></ul>
<!--/titlelist_area-->


変更点2
さらに、スタイルシートの編集 ……の枠の中にある

a {color:#898;text-decoration:none}
a:active {color:#f00;}
a:hover {color:#c00; }

の部分を下記のように変更

a {text-decoration:none}
a:link {color:#557;}
a:visited {color:#898;}
a:active {color:#f00;}
a:hover {color:#c00; }
span.num {font-size:smaller;font-family:'Courier New','Courier',sans-serif;color:#898;}
span.cat {font-size:smaller;color:#898;}


変更点3

#EL li {width:480px; height:1.2em; overflow:hidden; clear:both;}
#EL span {display:block; margin:0; width:120px; float:left; }
#EL a {display:block; width:240px; float:left; overflow:hidden; font-weight:bolder;}
#EL em {display:block;width:120px; overflow:hidden; float:left;}

の部分を下記のように変更

#EL li {line-height:1;margin:7px 0px 7px 25px;}
#EL span {}
#EL a {font-weight:bold;}
#EL em {}






《FC2》(マルチカテゴリー)《FC2》テンプレート/プラグイン

テンプレ紹介2“website”/“website2_1”

【2007/7/20追記】
共有テンプレートからは、配布中止になっています。


あちこちのブログを見て歩いていて、こんなテンプレートを見つけました。
website”&“website2_1”(WebbingStudio様作)
これも、「ブログで小説を連載」するには良さそうですね^^

“website”で見る
TOP / 個別記事 / リンク / プロフィール / カテゴリー / 月別アーカイブ 
“website2_1”で見る
TOP / 個別記事 / リンク / プロフィール / カテゴリー / 月別アーカイブ

ものすごーく余計なお世話なのですが。

「“website2_1”いい! そのうち自分で素敵な写真(orイラストとかロゴとか)を入れたい! でも今だけちょっとワンちゃんに、のいていてほしい……」という方は、以下どぞ。

websitecolor1
cssのなかの
「#banner {
background-image: url(http://blog10.fc2.com/w/webbingstudio/file/ws2_1_pho.jpg);」
を、
「#banner {
background-image: url(http://blog-imgs-18.fc2.com/a/d/a/adankadan/websitecolor0.gif);」
に入れ替えると画像が変わります

※この市松プレートは、ダウンロードして色を塗り替えても、文字を乗せても、煮ても焼いてもかまいません。
※ちなみに画像サイズは、横320px、縦235pxでした。
※写真を変えたら、テンプレートHTML中の、「&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Photo(dog) by&nbsp;&nbsp;<a href="http://afstreet.michikusa.jp/" target="_blank">afstreet</a>」は除くのでしょうなぁ。。


(あくまで臨時用ということで、失礼の段はお許しください>WebbingStudio様)


tag : テンプレート紹介

《FC2》(マルチカテゴリー)《FC2》テンプレート/プラグイン

テンプレ紹介3“3cc_c-pod_nano”

【2007/7/20追記】
共有テンプレートからは、配布中止になっています。



連載お勧めテンプレートに、1つ追加です。

“3cc_c-pod_nano”(Glim様作)

“3cc_c-pod_nano”で見る
TOP / 個別記事 / リンク / プロフィール / カテゴリー / 月別アーカイブ 

製作者様ブログでの解説によれば、TOP画面のアバター画像部分は、「あくまでサンプル」だそうで、自由に入れ替えて使ってかまわないようです。
(テンプレート配布元さんによっては、画像を入れ替えた使用を禁止している方もいらっしゃいますので、使用許諾はマジメに読みましょう^^;)


どこがお勧めかというと。

連載小説を「自然な感じ」でブログで読んでもらうには、記事の表示の方法を「日付が古い順」にする([環境設定]→[ブログの設定])のが望ましいと思うのですが。その場合、一般的に「ブログっぽい」テンプレートを使うと、最初のページに一番古い記事が出てしまいます。

ブログを訪問した方に「あれ?ずっと更新されてない?」という誤解を受ける可能性、なきにしもあらず。

ですから、これまでご紹介した“Odin”(このブログで使用中)、“Website”ともに、「最初のページに記事が出ない」テンプレートでした。

“3cc_c-pod_nano”も同様に、最初のページに記事が出ず、しかも、カテゴリーが目立つ構成になっていますので、読者に連載タイトルが目に入りやすいテンプレートだと思います。


とりあえずTOPのアバター画像を空白にして使う場合には、

[テンプレートの設定]→“3cc_c-pod_nano”[修正]→「カスケードスタイルシート…」のなかに、
#gray #top_img {background: url(http://blog41.fc2.com/y/yukinobu/file/3cc_top_img_s.jpg) no-repeat top left;}
という部分がありますので、画像の設定を削って
#gray #top_img {background: ;}
としてみてください。

追記:Glimサマ、うちは小説特化なので……、「小説とイメージあわせが難しい部分を無理にあわせる最低限の方法」は掲載させていただいております。お許しくださいm(_ _)m

テーマ : 物書きのひとりごと
ジャンル : 小説・文学

tag : テンプレート紹介

《FC2》(マルチカテゴリー)《FC2》テンプレート/プラグイン

長文書きさん必携♪ 「下書き用テンプレート」

私はもともとネット上のイロイロを信頼しきらない人間であるらしく。

ブログに書く原稿は、まずエディターで作ってから、流し込むのが原則!なのですが。

焦っているときとか、忙しいとか、やっぱり直接ブログの投稿窓に書き込みをすることもあり。そういうときって、「どうしても! 今書きたい!」というネタがあるわけで。忙しいくせに長くなったりして。書き終わって送信ボタンを押したとたんに、再ログイン画面。書き込んだものは、ぱあ。──なんてことも、やっぱり経験しているわけです。


ところが。

不定期に巡回しているPcafe様にて、とってもステキなものを教えていただきました。

下 書 き 用 テ ン プ レ ー ト

私はとくに、WEB小説の感想ブログなんぞをFC2に持っていますので。
管理画面の「新しい記事を書く」は、1024pxの画面の約8割を占拠、肝心のWEB小説の「窓」をもう1つ開くのが窮屈なのですが。

この「下書き用テンプレート」、1024pxの画面の4割は“他”に使わせてくれる、「感想書きに優しい」つくり(嬉)


……あ。話題が“ブログで小説”じゃなくて、“ブログで感想”になっちゃいましたね^^;


もちろん!ブログで小説を書く方で、「エディターを使う癖」のつききっていない方にも、強い味方になると思います^^

(この記事は「下書き用テンプレート」で書いてみました)



テーマ : 頑張れ小説
ジャンル : 小説・文学

tag : テンプレート紹介

《FC2》(マルチカテゴリー)《FC2》テンプレ改造etc.

“改造手順”の共通項

テンプレートを改造したい、と思うとき、最低限、共通する事項ってあると思う。ここでは、私自身がどうやっているか、順を追って書いてみる。
(ヘッダ画像の替え方は、このとき書いたのがマシかも…>『テンプレートcfdn_132でのトップ絵の変更のしかた』inFC2Forum)

ソースを見る
まず、変更したい部分を、どんなタグ(<div>とか<h1>とか<img>)が設定しているかを把握するために、ソースを見る。Windowsでは、マウスの右ボタンをクリックして、「ソースの表示」を選ぶ。(MACのことは、忘れた。……マウスのボタンが1つしかなかったことしか憶えてないやい)

WINDOWS版IEの場合、日本語部分は文字化けする。FireFoxを使えば、EUコードのFC2ブログでも、文字化けなしにソースを見ることができる。

ソースのなかで、たとえばタイトル部分に
<H2 class="なんとか">
とあれば、その「なんとか」の部分が、タイトルの「class」になるのだし。

本文部分の直前あたりに
<div class="なんとか">
とあれば、その「class」が、本文の指定をしている可能性が高い。

何がなんだか判らない方も、実際、スタイルシートをあちこち変えてみれば判ってくるから大丈夫。

スタイルシート窓とHTML窓
[テンプレートの設定]→(使用テンプレート名の)[修正]で、画面の下のほうに現れる2つの窓のうち、上の窓が「HTML」下の窓が「スタイルシート」だ。

テンプレにもよるけど、「HTML」は、要素(タイトルとか本文とかコメントとか)の「有無」や「順番」を、「スタイルシート」は、大きさ/位置/色/背景/枠線などの設定を決めている

[修正]画面のHTML窓の中身を、おぼろげにでも理解しようとするなら、テンプレート中で使える変数一覧を参照する。全部見る必要はない。タイトル/エントリー(記事のこと)/コメント/トラックバック/カテゴリー/アーカイブ(月別)、自分が変えたい目的別に、言葉を検索してその部分だけじっくりめに読むのが吉。

だが、色だの画像だの変えるだけなら、最初に書いたとおり、「文字化けのない状態で、自ブログのソースを見る」という手段のほうが、たぶん、解りやすい。ソースを見たら、HTML窓は無視して、スタイルシートを見てしまうのだ。


スタイルシートを変えてみる
スタイルシートは、大原則として、
img{設定いろいろ}
とあったら、<img>タグに関して設定している。
.img{設定いろいろ}
とあったら、「class="img"」に関して設定している。
#img{設定いろいろ}
とあったら、「id="img"」に関して設定している。

ここまで判ったら、後は変えてみるだけww

(……正確な説明としては不足だけど、大抵のコトはこれで間に合ったりする。ちゃんと知りたい方は、「はじめてのFC2ブログカスタマイズ」の『基本となるセレクタ』以下を熟読♪)

スタイルシートをメモ帳にコピーするか(だからMACのことは知らないってば)、スタイルシート窓のなかで検索(ctrl+f)で探せば、目的の部分にたどり着きやすい。

backgroundといったら背景のことだし、borderは囲み線のことだ。中学生レベルの英語で、かなり見当はつくと思う。

あー。一つだけ、付けくわえ。
文字の色は、
{font-color:#000000;}
でも
{text-color:#000000;}
なく、
{color:[色コード];}
っす。。。。何度間違えたことかwww


「変えるだけ」ではなく、「設定の追加」が必要な場合の資料としては……
(FC2&テンプレ改造関連リンクと重複)
はじめてのFC2ブログカスタマイズ
アルキカタ版FC2Blog Q&A「ブログの見栄え」
HTMLクイックリファレンススタイルシートリファレンス(目的別)


「個別」ではなく「かたまり」で変える
左カラム全部のリンクの色、記事と記事タイトルとコメントとトラックバックまとめて、のように「個別の要素」ではなく「かたまり」で何かを変えたい場合には、(テンプレートによりますが)どこかの<DIV>にまとめて支配されていることが非常に多い。
<DIV>は入れ子構造になっていることが多く、どの<DIV>がどの部分を支配しているかは、意外に判りにくいのが実情、ではありますが。
(1)HTMLをみて、DIVのID,classを調べる。
(2)スタイルシートを開く。
 HTMLからあやしいと判断したIDやclassに、「background-color:red;(赤)」とか「background-color:blue;(青)」とか、背景色指定を、cut&pasteしていく(笑)
 テンプレ内で目立つ色で、作業中に確実に検索できる指定を使うと、楽。
 で、変えたい部分の色がちょうど変わったところが、「当たり」
 その部分のスタイルシートを、自分の目的に合わせて変えてやればいい。
……こんなツマラン工夫で、案外、いろんなことができてきたりするwww


バックアップ
大体動いたら(完璧でなくても)、そのスタイルシートなりHTMLなりを一度保存しておく。次の操作で全てがおじゃんになっても、戻ってやり直せるから。

ただし。全部おじゃんになっても、同じテンプレをダウンロードしなおせば、記事は正常に表示される。HTMLやスタイルシートがどんなにぶっこわれても、記事のデータが損なわれることはない。


この記事にいただいたsugarさんのコメントにあるURLも、テンプレ選びの優先順位やなにやが触れられていて、テンプレの改造前に読むのにオススメ。

[注]この記事はsugarさんのコメントをいただいた「後」で、若干書き換えました。タイトルも変更しております。

tag : ユーザーフォーラム

《FC2》(マルチカテゴリー)《FC2》テンプレ改造etc.

サブテンプレの色を、メインテンプレとコーディネート

[2006/7/31記]
“all_for_cat”向きに書いた記事ですが、“inframe”“komado”も同様ですので、リライト。


ご使用のメインテンプレとサブテンプレをカラーコーディネートしたい場合の、色コードの調べ方。

●色を拾う
Windowsのおまけソフト[ペイント]を使います。
(Macはわかりません^^;)
(1)使いたい色が表示されている状態で、[Alt]+[PrtSc]を押す。
(2)[スタート]→[プログラム]→[ペイント] 画像ファイルを貼り付ける領域にカーソルをおいて、[Ctrl]+V
(3)[スポイトアイコン]をクリック
(4)調べたい色の部分をクリック
(5)[色(C)]→[色の編集]→[色の作成]で赤/緑/青の数値が出ます、
※(背景はこの色にしたい、この色で枠をいれたい、この色で「リンク文字」などなど、欲しい色は、全部メモっておいてください)

●“inframe”
“inframe”の色は、スタイルシートで設定しています。
[テンプレートの設定]→“inframe”[編集]→[スタイルシート]
文字の色=color:rgb([数字],[数字],[数字]);
罫線の色=border-color:rgb([数字],[数字],[数字]);
背景の色=background-color:rgb([数字],[数字],[数字]);
というふうに入力してゆきます。

【おまけ】
黒背景も、つくってみました。
http://adankadan.blog47.fc2.com/?style2=inframe-black&all
http://blog-imgs-18.fc2.com/a/d/a/adankadan/inframe-black-css.htm

(リストの"頭"に画像を入れています。色変えのリクエストがあれば、できる限り応じます)


●“komado”
《FC2》のほとんどのテンプレートが、スタイルシートで色指定するのに対して、メインの色指定は、HTMLファイルの<body>タグで行っております。[テンプレートの設定]→“komado”[編集]→[HTML]
↓この部分です。
<body bgcolor="#ffffff" text="#000000" link="#336699" alink="#993366" vlink="#666666">

こちらを参考にご変更ください。
TAG

たとえば、
<body bgcolor="#000033" text="#ffffff" link="#99FFFF" alink="#33CCFF" vlink="#CCFFFF">
とすると、こんな感じに↓。
色かえ見本
(再提出のきっかけになった方に敬意を表して、“ds-starrysky”カラーです )



スレッドリンク

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

プロフィール

麻生(阿檀) Author:麻生(阿檀)

【このブログについて】
ブログで小説を手軽に連載したい方のための、
ブログ紹介/FC2テンプレート紹介が、メインだったはずなのですが。

ミ^。^彡っ。oO○(いつのまにやら、かなりとんでもなくごった煮ブログになっております。)

MyToyBox

Clock!
doodel ?publish
?style3=10084&index



01 02 03 04
カレンダー
09 | 2017/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
検索フォーム
タグリスト
                                                 
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。