何の気なしにブログをカスタマイズしてみた。「何の気なしに」と言うのは、あまり適切な表現ではないかも知れないが予てから「どんなことができるんだろう?」と興味があったからだ。
はじめに、適当に「人気があるページ」と言うやつを見まくった。どれも「凝っていて?」判断に迷うが、多くのページを見る内に取り込みたい機能はしぼれた。
とりあえず、
・ヘッダーの非表示
・投稿の要約
の2つである。
ヘッダーの非表示は、
レイアウト→ HTML の編集から #navbar-iframe を hidden とする
/* Defaults
----------------------------------------------- */
#navbar-iframe {
height: 0px;
visibility: hidden;
display: none;
}
body {
投稿の要約は、
・CSS の Conditional 設定
・投稿の要約展開をリンク
・投稿の編集
の3つを設定すればよいことがわかった。
※「設定」から投稿ページを有効に設定しておく必要がある
Blogger ヘルプの「省略版の投稿の要約部分を作成するにはどうすればよいですか。」は非常にわかりにくかったので補足を入れると(あくまでも私のページの場合)
CSS の Conditional 設定は、レイアウト→ HTML の編集から冒頭に挿入
<title><data:blog.pageTitle/></title>
<!-- CSS Conditional(Read More) -->
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
<b:skin><![CDATA[/*
投稿の要約展開をリンクは、同じくレイアウト→ HTML の編集から「 ウィジット テンプレートを展開」し data:post.body/ の文字列を検索して次の行に挿入
<data:post.body/>
<!-- Read more TAG -->
<b:if cond='data:blog.pageType != "item"'><br/>
<a expr:href='data:post.url'>more...</a>
</b:if>
<div style='clear: both;'/><!-- clear for photos floats -->
</div>
<div class='post-footer'>
最後に、投稿の作成で、
投稿の要約です。 <span class="fullpost">残りの本文です。</span>
と記述すれば、
投稿の要約です。
more...
と表示される。
難点は、要約していないページにおいても more... が表示されることだが、ここは課題として其のうち対応することとした。
more...