FC2ブログ

Template Image素材サイト様 : ナビゲーション

画像をクリックすると直接テンプレートがプレビューされます。 テンプレート名 か 続きを読む をクリックするとテンプレートの解説記事が開きます。写真 イラスト 花 など用いている画像についてのタグ(Template Image Tag)をクリックすると、該当するテンプレートが表示されます。

☆ カスタマイズの前にはコピーをとりましょう!コピーのとり方は こちら  
 注意繰り返しになりますが、親子カテゴリ対応タイトルリストを導入し、尚且つ、表紙メニューで親子カテゴリ折りたたみスクリプトを導入した改訂版のNovelテンプレートで以下のカスタマイズは必要ありません。親子カテゴリ対応タイトルリストに関係なく表紙メニューをカスタマイズなさる場合にのみ、ご参考にしてください。

2012.6.29追記親子カテゴリ設定をしていない30話を超える作品の目次を1ページで表示させるカスタマイズはコチラ

記事本文は折りたたんでありますが、一応読んでみる方はここをクリックしてください

出来上がった全体(長篇)の1ページ目次の置き場所


さて、前ページで作成した長篇用の1ページ目次ですが、前述したように、このページは、全記事一覧ページ(タイトルエリア)のカスタマイズです。ですから、表紙メニューのALL Archives と、画面上下のサイトナビゲーションからリンクすることになります。

表紙メニューのカスタマイズ


Novel List

長篇タイトル(親カテゴリ)

…1章(子カテゴリ)

…2章(子カテゴリ)

…3章(子カテゴリ)

ALL Archives
通常ブログ画面
プラグイン3

 表紙メニューでは、今はこんな風に並んでいると思います。
 長篇用の1ページ目次は、親カテゴリの目次に
 変るものですから、メニューに表示されるタイトルや
 順番も それらしく変えましょう。

もうカテゴリの親子設定は必要ありませんので、まず、その設定を解除します。

解除の方法


菅理ページ⇒[ 環境設定 ]⇒【 カテゴリの編集 】をクリックして[ カテゴリ管理 ]ページを開きます。
[カテゴリ一覧]のリストから削除する親カテゴリの欄の一番右側の
× 】をクリックします。

これで親カテゴリが削除されました。

次に、子カテゴリの設定になっていたカテゴリのをクリックして消します。
が消えたら【修正】をクリックします。


Novel List

1章

2章

3章

ALL Archives
通常ブログ画面        
プラグイン3

表紙メニューから、親カテゴリが消え、
子カテゴリの頭に今までついていた
…表示されなくなればOKです。

次に、表紙メニューの順番とタイトルを変更します。

 全体(長篇)の目次を1ページでつくる③

☆ カスタマイズの前にはコピーをとりましょう!コピーのとり方は こちら   注意繰り返しになりますが、親子カテゴリ対応タイトルリストを導入し、尚且つ、表紙メニューで親子カテゴリ折りたたみスクリプトを導入した改訂版のNovelテンプレートで以下のカスタマイズは必要ありません。親子カテゴリ対応タイトルリストに関係なく表紙メニューをカスタマイズなさる場合にのみ、ご参考にしてください。2012.6.29追記親子カテゴリ設定...

»» 続きを読む

»» リスト へ page top


 サイトナビゲーション①

サイトナビゲーションNovelテンプレートでは初回の訪問者も迷わないように、全てのページの上下にサイトナビゲーションがついています。DL時の初期設定は以下の通りです。◆Indexその小説の目次ページ ◆HOME表紙ページ(ブログトップページ)◆Novel ListNovelList(小説一覧ページ)◆AllAllArchives(全記事一覧ページ)◆通常ブログ画面  最新記事が冒頭に表示される通常ブログページ▲PageTop開いているページの冒頭にもどる小説...

»» 続きを読む

»» リスト へ page top


カスタマイズの難易度3 カスタマイズの難易度3

サイトナビゲーションの変更


表紙メニューに新設した新しいコンテンツをサイトナビゲーションにも追加したい場合はHTMLのサイトナビゲーションのソースを変更する必要があります。前ページで説明したように、サイトナビゲーションは全部で5種類ありますテンプレートのタイプによって違いますので、全てを変更するのか、それとも一部だけを変更するのか、それぞれのケースに合わせてカスタマイズしてください。

 サイトナビゲーション②

 カスタマイズの難易度3サイトナビゲーションの変更表紙メニューに新設した新しいコンテンツをサイトナビゲーションにも追加したい場合はHTMLのサイトナビゲーションのソースを変更する必要があります。前ページで説明したように、サイトナビゲーションは全部で5種類ありますテンプレートのタイプによって違いますので、全てを変更するのか、それとも一部だけを変更するのか、それぞれのケースに合わせてカスタマイズしてく...

»» 続きを読む

»» リスト へ page top


カスタマイズの難易度1(非表示のタグを表示させるだけでOK) カスタマイズの難易度1

DL時のコメントや、訪問者履歴でアドレスのわかる方のブログへお邪魔すると、サイドメニューに「はじめに」や「About」などのサイトの説明記事へのリンクを設けている方がとても多いことに気づきます。【ご案内】があるからいらないかなと思ったのですが、やはりそれだけでは足りないようです。

「はじめに」ですから、やはり、表紙メニューの冒頭、NovelListより上に表示される方がよろしかろうということで、本日(2009.4.23)、現在登録中の全てのテンプレートに、「はじめに」のためのタグを埋め込んできました。必要な時は、あらかじめ埋め込んであるリンクタグの前後の行を削除するだけでOKです。


「はじめに」をカテゴリに設定して作品タイトルと共に並べている方も多いのですが、その場合は「はじめに」をクリックしても、最初は目次ページが開き、ダイレクトに「はじめに」の記事ページが開けません。

小説を読みに訪れた読者にとって、諸注意や作者の断り書きなどが書かれた「はじめに」などは決して読みたくて読むページではありません。面倒くさいなと思いながらも、それでも一応読んでおくかとクリックしたのに、そこに本文はなく、またクリックしろとなると、ますます読む気が失せます。
読まずに済ます読者も少なくない中、作者の意を汲んで、「はじめに」を読んでくれようとしたありがたい読者に、余計な手間をかけさせないためにも、「はじめに」はカテゴリ設定ではなく、表紙メニューには表示されない「未分類」に設定した上で、予備のリンクボタンをつかって、ダイレクトにページを開けれるようにしましょう。

 表紙メニュー 冒頭に「はじめに」「About」を表示する

 カスタマイズの難易度1DL時のコメントや、訪問者履歴でアドレスのわかる方のブログへお邪魔すると、サイドメニューに「はじめに」や「About」などのサイトの説明記事へのリンクを設けている方がとても多いことに気づきます。【ご案内】があるからいらないかなと思ったのですが、やはりそれだけでは足りないようです。「はじめに」ですから、やはり、表紙メニューの冒頭、NovelListより上に表示される方がよろしかろうというこ...

»» 続きを読む

»» リスト へ page top


先にも申し上げましたが、小説本文(個別記事)ページで、その小説(同一カテゴリ)の前後ページへの確実なナビゲーションがなかったのは、Novelテンプレートの致命的な弱点でした。
初期設定のページナビゲーションは単純に日付が前後のページへのリンクなため、複数の小説を同時に、ランダムに連載する場合には、同じ小説の前話・次話へは繋がらないこともあるという不具合が生じます。それを修正・解決するためには手作業が必要であり、今までは、記事の更新ごとに手打ちするか、記事の日付を変更するしか方法がありませんでした。

なんとかならないかと、暇さえあれば、ネットを探し回っていたのですが、その甲斐あって、ようやく、小説本文(個別記事)ページ末尾のページナビゲーションが、同一カテゴリの前後ページへのリンクではないという、Novelテンプレートの致命的な弱点を補って余りあるすばらしいスクリプトに出会えました!

情報サイトなどで時折りみかける、記事の末尾に表示される「関連記事一覧」、それを拙作Novelテンプレートに応用できないかと思いついたのは最近でした。調べてみると、関連記事を表示させる機能は、人気も需要もあるのですが、確実に表示させるためには記事中にキーワードをいれたり、それをタグで囲んだりと、手作業が必要で面倒だったり、それがなくただソースをコピペするだけというのがウリだったスクリプトも、公開してしばらく経つと、外部サーバーを利用しているせいか、オーバーワーク?のためパンクして、全く表示されなくなったりと、簡単に、確実に、長く利用できるものがありませんでした。ところが、唯一、それらの問題を全てクリアしたすばらしい機能・スクリプトが、つい最近考案・公開されていたのです!

その名も
関連エントリーメーカー
FC2ブログで関連エントリーを表示させるスクリプト


このページの末尾か、小説見本ページをご覧ください。 こちら
同一カテゴリの記事一覧がすべて表示できますので、小説本文ページにその小説、もしくは章の目次機能が追加できます。前後ページへのナビゲーションの代用にとどまらず、それを凌ぎ、超える機能であります!

ちよろ様、ありがとうございました!

ちよろ様が、私のわがままな要望を聞き入れてくださり、近日中に表示ページを太字にしたスクリプトを作成してくださるそうです。カスタマイズについては、そのスクリプトが完成してから後にご紹介させていただきますので、今しばらくお待ちくださいませ。
と、訂正したかしないかという間に、なんと完成させてくださいました!!

ちよろ様、本当に、本当に、ありがとうございました!

カスタマイズの方法は次のページをご覧ください。 こちら

 朗報!「関連エントリーメーカー」がNovelテンプレートの弱点を克服!

先にも申し上げましたが、小説本文(個別記事)ページで、その小説(同一カテゴリ)の前後ページへの確実なナビゲーションがなかったのは、Novelテンプレートの致命的な弱点でした。初期設定のページナビゲーションは単純に日付が前後のページへのリンクなため、複数の小説を同時に、ランダムに連載する場合には、同じ小説の前話・次話へは繋がらないこともあるという不具合が生じます。それを修正・解決するためには手作業が必要...

»» 続きを読む

»» リスト へ page top



☆ カスタマイズの前にはコピーをとりましょう!コピーのとり方は こちら  

「関連エントリーメーカー」で
小説本文(個別記事)ページの末尾に
新着順目次(同一カテゴリ一覧リスト)を表示させる


前ページで述べましたように、このカスタマイズは、【
Harmonia!!】 の管理人 ちよろ さま考案の「関連エントリーメーカー」のスクリプトを丸ごとお借りしております。以下の記事を参考にさせていただきました。

FC2ブログで関連エントリーを表示させるスクリプト


ちよろ様、ありがとうございました!<m(__)m>

ちよろ様のお許しを頂戴致しましたので、公開中のNovelテンプレートにも、「関連エントリーメーカー」を順次装着し、リニューアルしてゆきます。2009.5.1.以降に登録、更新したテンプレートに関しては「関連エントリーメーカー」を装着済みでありますので、以下のカスタマイズは必要ありません。

注意 2009.912.現在 関連エントリーメーカーは以前の新着順から昇順(時系列の旧い記事が上にくる)に改訂いたしました。昇順のカスタマイズについては コチラ

カスタマイズの方法



[菅理画面]⇒[環境設定]⇒【テンプレートの設定】をクリックして
テンプレートの管理]ページを開く


PCテンプレート [ テンプレート名 ] 適用中
[ テンプレート名 ] のテンプレート名変更
テンプレート名 のHTML編集
テンプレート名 のスタイルシート編集         こんふうに上から順番に並んでいます。

HTML編集]部分をカスタマイズします。

スクロールしていくと下のように書かれた部分があるはずです。


<!--more-->
<%topentry_more>
<!--/more-->
</div>

<!--▼ページナビゲーション▼-->
<!--permanent_area--><ul class="entry_navi">
<li><!--nextentry--><a href="<%nextentry_url>" title="【<%nextentry_title>】へ"><i>Back</i></a><!--/nextentry--> </li>
<li>  <a href="<%topentry_category_link>" title="【<%topentry_category>】もくじへ"><i>Index</i></a></li>
<li> <!--preventry-->  <a href="<%preventry_url>" title="【<%preventry_title>】へ"><i>Next</i></a><!--/preventry--></li>
</ul><!--/permanent_area-->
<!--▲ページナビゲーション▲-->

<!--▼ランキングバナーなどを貼る場合はここへ①▼-->

<!--▲ランキングバナーなどを貼る場合はここへ①▲-->



<%topentry_more>の前後に、改行<br />や、段落のタグ<p></p>があるテンプレートもありますが、それはこの際、気にせずに、<%topentry_more>ページナビゲーションランキングバナーの設置位置(①もしくは番号なし)がある箇所を探してください。

ページナビゲーションの上に以下のスクリプトを追加します。


<!--permanent_area-->

<div class="cat-navi">
<script type="text/javascript" src="http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/jkl-parsexml.js">
</script>
<!--ソース改変が可能であれば、src内のURLを自分でアップロードしたjkl-parsexml.jsのURLに変更してみてください。負荷が分散します。-->

<script>
<!--

var show_titles = 31
// 表示する関連エントリーの数。1~30の範囲を。推奨は5。
// 31以上で同一カテゴリ内の新着エントリー順に表示します。

function get_fc2_cate_rss(url){
var xml = new JKL.ParseXML( url );
var func = function ( data ) {
fc2_cate_xml_parse( data ) ;
}
xml.async( func );
xml.parse();
}

function fc2_cate_xml_parse( xml ){
var cate_entrys = new Array();
var output_fc2_entry = ''
if(xml["rdf:RDF"].item[1] == undefined){
cate_entrys[0] = new Array(xml["rdf:RDF"].item.link , xml["rdf:RDF"].item.title)
} else {
for(i in xml["rdf:RDF"].item){
// cate_entrys[i] = [0]url , [1]title
cate_entrys[i] = new Array(xml["rdf:RDF"].item[i].link , xml["rdf:RDF"].item[i].title)
}
}

if(cate_entrys.length < show_titles){
for(i in cate_entrys){
if (cate_entrys[i][0] != '<%topentry_link>'){
output_fc2_entry += '<li><a href="' + cate_entrys[i][0] + '">' + cate_entrys[i][1] + '</a></li>'
} else {
output_fc2_entry += '<li><b>' + cate_entrys[i][1] + '</b></li>'
}
}
} else {
for (i = 0 ; i < show_titles ; i++ ){
choice_entry = Math.floor ( Math.random() * cate_entrys.length)

if (cate_entrys[choice_entry][0] != '<%topentry_link>'){
output_fc2_entry += '<li><a href="' + cate_entrys[choice_entry][0] + '">' + cate_entrys[choice_entry][1] + '</a></li>'
} else {
output_fc2_entry += '<li><b><a href="' + cate_entrys[choice_entry][0] + '">' + cate_entrys[choice_entry][1] + '</a></b></li>'
}

cate_entrys.splice(choice_entry,1)
}
}

var k_k_k = '<h5>▼  ~ INDEX ~ 「 <%topentry_category> 」 ~ 新着順 ~ </h5><ol>' + output_fc2_entry + '</ol>'
k_k_k += '<div align="right"><a href="http://lastoneofthezodiac.blog38.fc2.com/blog-entry-4493.html">関連エントリーメーカー for FC2 Blog</a></div>'
// 著作権表示部分を消す場合は上の一行と、この行を削除
document.getElementById('kanrendesu').innerHTML = k_k_k
}

get_fc2_cate_rss('<%url>?xml&category=<%topentry_category_no>')

// -->
</script><noscript><a href="http://lastoneofthezodiac.blog38.fc2.com/blog-entry-4493.html">関連エントリーメーカー for FC2 Blog</a></noscript>
<div id="kanrendesu">
</div>

</div>
<!--/permanent_area-->


新着順がわかりやすいように上のスクリプトではリストに通し番号がついていますが、通し番号のついていないリストにする場合には、赤字の部分 ol を ul に変更してください。

更新 】 をクリックする。



これでOKですが、このままですと、記事本文とも、また、高速配信を導入されている場合には広告とも区別がつきにくいのでスタイルシートを編集して、見せ方を変えましょう。

カスタマイズの方法は次ページで こちら

記事タイトルを通し番号でつけている場合のカスタマイズは こちら

 同一カテゴリ一覧リスト「関連エントリーメーカー」のカスタマイズ①

☆ カスタマイズの前にはコピーをとりましょう!コピーのとり方は こちら  「関連エントリーメーカー」で小説本文(個別記事)ページの末尾に新着順目次(同一カテゴリ一覧リスト)を表示させる前ページで述べましたように、このカスタマイズは、【Harmonia!!】 の管理人 ちよろ さま考案の「関連エントリーメーカー」のスクリプトを丸ごとお借りしております。以下の記事を参考にさせていただきました。FC2ブログで関連エントリ...

»» 続きを読む

»» リスト へ page top



☆ カスタマイズの前にはコピーをとりましょう!コピーのとり方は こちら  

新着順目次(同一カテゴリ一覧リスト)のカスタマイズ


前ページの「関連エントリーメーカー」装着のカスタマイズで、小説本文(個別記事)ページの末尾にはその小説の新着順の目次(同一カテゴリ一覧リスト)が表示されるようになったと思いますが、そのままですと、記事本文や広告との見分けがつきにくいので、その見せ方を変えるカスタマイズをご紹介します。

カスタマイズの方法



[菅理画面]⇒[環境設定]⇒【テンプレートの設定】をクリックして
テンプレートの管理]ページを開く


PCテンプレート [ テンプレート名 ] 適用中
[ テンプレート名 ] のテンプレート名変更
テンプレート名 のHTML編集
テンプレート名 のスタイルシート編集         こんふうに上から順番に並んでいます。

スタイルシート編集]部分をカスタマイズします。

スタイルシートのどこでもよいので、以下のように、関連エントリーメーカーの表示を指定する内容を追加します。下は [
novel-template-sepia ]の例です。

/* 関連エントリーメーカーの表示 */
.cat-navi {
margin : 0px 0px 0px 0px;
padding : 10px 0px 40px 0px ;
font-size : 80%;
line-height : 160%;
}

.cat-navi h5 {
margin : 0px 0px 20px 0px;
padding : 2px 10px 2px 10px ;
font-size : 110%;
color: #FFF;
background-color : black;
border-top : 1px solid #fff;
border-left : 1px solid #C2A858 ;
font-weight : bold ;
background-image : url("http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/o04-7-22.jpg");
background-repeat : no-repeat ;
background-position : left bottom;
}


.cat-navi ol {
margin : 0px;
padding : 5px 0px 10px 20px;
}

/* 一覧から訪問済みのページタイトルの色を変える場合 下は青#0000FFに変える例*/

.cat-navi a:visited { color : #0000FF; text-decoration : none;}



background-image は、背景画像の指定です。赤字の部分に背景画像のアドレスを入れます。

background-image : url("背景画像のアドレス");


.cat-navi a:visited は、 一覧から訪問済みのページのタイトルの色を変える指定です。
上の例は青#0000FFですが、必要であればテンプレートにあわせてカラコード#●●●●●●を変更してください。

.cat-navi a:visited { color : #●●●●●●; text-decoration : none;}


.cat-navi h5
が この記事の末尾で、▼~INDEX~「小説タイトル」~新着順 と帯状に表示されている、見出し部分の設定になります。主にこの部分を、それぞれのテンプレートにあわせて変更します。他の部分はまるごとコピペしてください。[テンプレートの名前]をクリックするとそれぞれのカスタマイズしたサンプルがご覧になれます。

novel-template


.cat-navi h5 {
margin : 0px 0px 20px 0px;
padding : 2px 10px 2px 10px ;
font-size : 110%;
color: #ffffff;
background-color : black;
border-top : 1px solid #fff;
border-left : 1px solid #C2A858 ;
font-weight : bold ;
background-image : url("http://blog-imgs-32.fc2.com/n/o/v/noveltemplate/bsb35-2.jpg");

}


nove-template-rose1

.cat-navi h5 {
margin : 0px 0px 20px 0px;
padding : 0px 10px ;
font-size : 110%;
color : #663333;
background-color : #ffffff;
border : 1px solid #C2A858 ;
font-weight : bold ;
background-image : url("http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/eiji742.jpg");
background-repeat : no-repeat ;
background-position : right center;
}


novel-template-rose2

.cat-navi h5 {
margin : 0px 0px 20px 0px;
padding : 0px 10px ;
font-size : 110%;
color : #663333;
background-color : #ffffff;
border : 1px solid #C2A858 ;
font-weight : bold ;
background-image : url("http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/hana1413.jpg");
background-position : right bottom;
}


文字が見え辛い場合は前ページのスクリプトに赤字のタグを追加して文字の背景だけを白くします。

HTML編集]部分をカスタマイズします。

var k_k_k = '<h5><font style="background-color:#ffffff;">▼  ~ INDEX ~ 「 <%topentry_category> 」 ~ 新着順 ~ </font></h5><ol>' + output_fc2_entry + '</ol>'
k_k_k += '<div align="left"></div>'
document.getElementById('kanrendesu').innerHTML = k_k_k
}




novel-template-rose3

.cat-navi h5 {
margin : 0px 0px 20px 0px;
padding : 0px 10px ;
font-size : 110%;
border : 1px solid #C2A858 ;
font-weight : bold ;
color : #900000;
font-weight : bold;
background-image : url("http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/hana31223.jpg");
background-position : right bottom;
}



novel-template-green

.cat-navi h5 {
margin : 0px 0px 20px 0px;
padding : 0px 10px ;
font-size : 110%;
color : #663333;
background-color : #ffffff;
border : 1px solid #C2A858 ;
font-weight : bold ;
background-image : url("http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/midori68w.jpg");
background-position : right center;
}


novel-10-mono1][novel-10-mono2

.cat-navi h5 {
margin : 0px 0px 10px 0px;
padding : 2px 10px ;
font-size : 110%;
color : #fff;
background-color : #000;
border-left : 4px double #ffffff;
border-bottom : 4px double #ffffff;
font-weight : bold ;

}


novel-10-blackシリーズは、前述の例ではなく下記の内容を追加します。
[novel-10-black1]

/* 関連エントリーメーカーの表示 */
.cat-navi {
margin : 0px 0px 0px 0px;
padding : 10px 0px 40px 0px ;
color : #C2A858;
font-size : 80%;
line-height : 160%;
}

.cat-navi h5 {
margin : 0px 0px 20px 0px;
padding : 50px 10px 0px 10px ;
font-size : 110%;
color : #fff;
font-weight : bold ;
background-image : url("http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/one03-11612.jpg");
background-repeat : no-repeat ;
background-position : center top;
text-align : center;
}

.cat-navi ol {
margin : 0px;
padding : 5px 0px 10px 150px;
}



[novel-10-black2]

/* 関連エントリーメーカーの表示 */
.cat-navi {
margin : 0px 0px 0px 0px;
padding : 10px 0px 40px 0px ;
color : #C2A858;
font-size : 80%;
line-height : 160%;
}

.cat-navi h5 {
margin : 0px 0px 20px 0px;
padding : 70px 10px 0px 10px ;
font-size : 110%;
color : #fff;
font-weight : bold ;
background-image : url("http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/2-1.gif");
background-repeat : no-repeat ;
background-position : center top;
text-align : center;
}

.cat-navi ol {
margin : 0px;
padding : 5px 0px 10px 125px;
}


black2はさらに、[HTML編集]部分をカスタマイズします。
HTMLの下の箇所を探して、赤字で記されたイメージタグを追加します。


~前ページで追加した関連エントリーメーカーのスクリプト~
<!--▼ページナビゲーション▼-->
<ul class="entry_navi">
~中略~
</ul>
<!--▲ページナビゲーション▲-->

<p align="center"><img src="http://blog-imgs-18.fc2.com/n/o/v/noveltemplate/3-2.gif" alt="" border="0" width="230" height="45" /></p>

<!--▼ランキングバナーなどを貼る場合はここへ①▼-->

<!--▲ランキングバナーなどを貼る場合はここへ①▲-->




更新 】 をクリックする。


marginとpadding は余白の設定、それぞれ上右下左の余白を指定しており、文字の大きさはfont-size行間はline-height、文字の色はcolor、文字の太さont-weight、枠線はborderです。
詳しくは、ハウツー系サイトさまなどをご参考に。尚、上以外のデザインに変更なさる場合のご質問はご遠慮ください。

記事タイトルが通し番号の場合のカスタマイズは次のページでご説明します。

 同一カテゴリ一覧リスト「関連エントリーメーカー」のカスタマイズ②

☆ カスタマイズの前にはコピーをとりましょう!コピーのとり方は こちら  新着順目次(同一カテゴリ一覧リスト)のカスタマイズ前ページの「関連エントリーメーカー」装着のカスタマイズで、小説本文(個別記事)ページの末尾にはその小説の新着順の目次(同一カテゴリ一覧リスト)が表示されるようになったと思いますが、そのままですと、記事本文や広告との見分けがつきにくいので、その見せ方を変えるカスタマイズをご紹介しま...

»» 続きを読む

»» リスト へ page top


新作テンプレートの[novel-temp-rose1・2]、そして再度申請中の[novel-10-china1・2]は、画面の上下にあるサイトナビゲーションにパンくずリスト機能を追加いたしました。

これはつい最近共有プラグインとして登録された
hatena chips」のhatena様ご考案の
FC2ブログ用パンくずリスト親子カテゴリ完全対応版」を
応用して装着させていただいたものです。


親子カテゴリに対応しているだけでなく、カレンダーページも月>日と表示されるのがまたすばらしく、サイトナビゲーションだけではなく、目次(カテゴリ)ページ、カレンダーページの見出し部分にも応用させていただきました。

なにしろ、カレンダーページのサブタイトルは年号月日の数字だけの羅列なので、(例:2009年の5月7日⇒20090507)その愛想の無さ?が嫌で、Novelテンプレートでは<%now_year>年<%now_month>月で表示させていました。けれどもその場合は、日付別ページの表示の時も、見出しが、●年●月の更新履歴となってしまい、紛らわしく、密かな悩みの種でありました。それが、このスクリプトのおかげですっきりと解決致しました。

親子カテゴリを使っている長篇作品の場合なども、目次(カテゴリー)ページや小説本文(個別記事)ページの大見出しに、今までのように、その章のタイトルだけではなく、リンクつきの小説タイトルが表示されるのでより便利に機能的になったと思います。

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

公開中の他のテンプレートも、今後上の機能を装着させてリニューアルさせていきたいと思っております。既にDL済みの方への解説記事はそれが終わってからになりますので、今しばらくお待ちくださいませ。

hatena様は、他にも親子カテゴリ対応のカテゴリ別の全記事一覧のサイトマップのソースなどもご考案されております。
全体(長篇)の目次を1ページでつくる②」で既にご紹介済みのソースとカスタマイズは、いたお様がご考案された特定のカテゴリ(小説)だけを選んで作成できるものであり、これはこれですばらしいのですが、hatena様ご考案のものは手を加えずとも、最初から全ての記事が親子カテゴリ別に表示されますので、カスタマイズが苦手な方にはより歓迎されるかもしれません。

NovelテンプレートのDL時から標準仕様の全記事一覧(All Archives)は更新履歴も兼ねておりますが、それは月別アーカイブ(カレンダーページ)でも事足りますので、それに変えて、hatena様のこのカテゴリ別サイトマップを導入させていただくことも、ただ今思案中であります。

「関連エントリーメーカー」もそうでありましたが、ああなったらいいのにな♪こうなったらいいのにな♫と、スキルのない1ユーザーとして単純に求め、願った機能が、一般のFC2ブログユーザーの方々の手により、次々と実現されてくることに驚きと喜びを禁じえません。ハイレベル・ハイスキル・ハイセンスなユーザーの遊び心と挑戦心・なによりもその斬新な発想を妨げない自由度、これがFC2ブログの最大の強みなんだろうなとしみじみ思います。

 「FC2ブログ用パンくずリスト親子カテゴリ完全対応版」を新作テンプレートに装着!

新作テンプレートの[novel-temp-rose1・2]、そして再度申請中の[novel-10-china1・2]は、画面の上下にあるサイトナビゲーションにパンくずリスト機能を追加いたしました。これはつい最近共有プラグインとして登録された「hatena chips」のhatena様ご考案の「FC2ブログ用パンくずリスト親子カテゴリ完全対応版」を応用して装着させていただいたものです。親子カテゴリに対応しているだけでなく、カレンダーページも月>日と...

»» 続きを読む

»» リスト へ page top


カスタマイズの難易度3 カスタマイズの難易度3

おススメカスタマイズ!


いつもお世話になっているFC2ブログのテンプレート工房さまですが、小説サイトを運営なさっている皆様にとっては実に有用なカスタマイズ記事をアップしてくださいましたのでご紹介させていただきます。

コチラ記事の中にメールフォームを作る

ブログでメールフォームを設定する場合、プラグインに追加するだけでOKですので、とても簡単ですが、メールフォームが表示されるのは当然のことながら、サイドメニューのプラグインスペースになってしまいます。それをサイドメニューではなく、記事中に設定できるとなれば、サイトナビゲーションや表紙メニューにメールフォームのある記事へのリンクボタンを追加することもできますし、マイブログをよりHPっぽく仕上げることができますのでおススメであります。

但しこのメールフォームはメール送信後、自動的に通常ブログ画面が開き、ページは変更できません。

諸般の事情から拙宅ではメールフォームを設置しておりませんが、ご興味のある方はぜひ、トライしてみてくださいませ。

 記事の中にメールフォームを作る

 カスタマイズの難易度3おススメカスタマイズ!いつもお世話になっているFC2ブログのテンプレート工房さまですが、小説サイトを運営なさっている皆様にとっては実に有用なカスタマイズ記事をアップしてくださいましたのでご紹介させていただきます。記事の中にメールフォームを作るブログでメールフォームを設定する場合、プラグインに追加するだけでOKですので、とても簡単ですが、メールフォームが表示されるのは当然のこと...

»» 続きを読む

»» リスト へ page top


カスタマイズの難易度2 カスタマイズの難易度2

メニューバーに新しいコンテンツを追加する



新作の擬似フレームタイプのテンプレート[novel-PF-Cosmos]では、サイトナビゲーション(メニューバー)がブラウザの上下に固定されており、画面をスクロールしても位置が変わらないよう設定してあります。このメニューバーに新しいコンテンツを追加する場合に備えて、HTMLには予備のボタンを埋め込んでおきました。

全ページ共通の固定式メニューバーですから、カスタマイズするのは上下それぞれ一箇所、あわせて二箇所だけでOKです。前後の不要のタグを削除して、新しいコンテンツ名とアドレスを記載するだけで、簡単にメニューバーに新しいメニューを追加できます。

 【novel-PF タイプ】(擬似フレームタイプ) 固定式メニューバーのカスタマイズ

 カスタマイズの難易度2メニューバーに新しいコンテンツを追加する新作の擬似フレームタイプのテンプレート[novel-PF-Cosmos]では、サイトナビゲーション(メニューバー)がブラウザの上下に固定されており、画面をスクロールしても位置が変わらないよう設定してあります。このメニューバーに新しいコンテンツを追加する場合に備えて、HTMLには予備のボタンを埋め込んでおきました。全ページ共通の固定式メニューバーですから...

»» 続きを読む

»» リスト へ page top


Template Type

Template Image

新作テンプレ⇒Click!
【画像】
イラスト 写真  CG 
プレーンタイプ画像なし 
【季節】
通年  新年    初夏       
【行事】
正月  バレンタイン 
ハロウィン  Xマス  結婚 
【題材1】
  バラ  チューリップ  アジサイ    ラベンダー 
ヒマワリ      サクランボ  葡萄  樹木  緑葉  紅葉 
金魚  ハート  レース  羊皮紙 
【題材2】
風景        宇宙     
【雰囲気】
シンプル  レトロ  幻想的
和風  中華  中近東風 素材屋風    
【その他】
黒背景  一般HP風  Popup  jQuery  クロスフェード  Full-Screen 
【素材提供サイト様】
WhiteBoard   Mako’s   Sweety   Fiore   十五夜
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。