18,2014

要約のさらに要約

fc2blogの変数ではブログの要約を表示できる＜%topentry_discription＞というのが
ありますが、それだとちょっと長いなあと思っていたので、
jqueryで要約をさらに短く８０文字ぐらいまでにしてみました。
これぐらいだと写真と一緒に表示してもバランスがいいかなあと思います。

ブログの画面はこんな感じです。


ヘッダーのナビゲーションの部分は

<nav class="topnav">
<a href="#" id="menu-icon"><i class="fa fa-plus-square"></i></a>
<ul>
<li><a href="#" onfocus="this.blur();" class="nonborder" title="menu">menu</a></li>
<li><a href="#" onfocus="this.blur();" class="nonborder" title="menu">menu</a></li>
<li><a href="#" onfocus="this.blur();" class="nonborder" title="menu">menu</a></li>
<li><a href="#" onfocus="this.blur();" class="nonborder" title="menu">menu</a></li>
<li><a href="#" onfocus="this.blur();" class="nonborder" title="menu">menu</a></li>
</ul>
</nav>

この部分の＃を該当のアドレスに、menuの部分をお好きな言葉に
変更してくださいね。

ヘッダーの画像を変更したい場合は、ｃｓｓの

#header-container{
width:20%;
height:100%;
margin:0;
padding:50px 20px;
position:fixed;
top:0;
left:0;
background-image:url(http://blog-imgs-69.fc2.com/m/y/s/mysticdiary/flo.jpg);
background-position:center center;
background-repeat:no-repeat;
background-size:cover;
}

上のbackground-imageのurlを差し替えます。

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

その前に読んでね

• 利用規約
• ＦＣ２ブログの文字コード問題
• 開閉式のサイドバーのテンプレートをお使いの方へ
• ファイルのダウンロードがうまくいかない方へ
• ページ送りナビゲーションやめた

audry.zip
DOWNLOAD