テンプレートPart3：投稿記事の折りたたみの自動化

投稿記事の折りたたみを自動で行えるようにしました。

・どんな機能？
文章の折りたたみ機能です
「続きを読む」「Read more」ですね

この機能を利用すれば、冗長な投稿記事であふれたブログをすっきりさせることができます
読み手からすれば、タイトルだけ見てで読むかどうか決めれるので、便利な機能だといえます


・なぜ自動化？
この機能は多くのブログサイトに実装されている機能なんですが、そのほとんどが手動で行わねばならないものです

記事を書くたびに折りたたむ場所を指定するのも面倒ですし、過去の記事全てに設定するのも大変です
やはり、自動化して少しでも手間を減らしたいと考えます
もちろん、自動化する過程でJavaScriptやjQueryの勉強もできますしね！


・Expander Pluginを使用
今回使用したのは、jQueyのプラグインのjquery.expander.jsです
こちらを使用すると数行のスクリプトで投稿記事の折り込み機能を実装することができます
下がいろいろなサイトを参考にして作成したスクリプトになります（ほとんどコピーです）

<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript">
<script src='http://plugins.learningjquery.com/expander/jquery.expander.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
<!--
$(function() {
            $('div.post-body').expander({
                slicePoint: 50
            });
        });
//</script>
//]]&gt;
--&gt;

もし、折りたたみ機能を実装したい方がいるなら「div.postnavi」の部分を折りたたみたい場所のクラス名に変更すれば使用できます

 ・備忘録
 　jQueyの外部ファイルには、GoogleのCDNを利用しています
 最初は、Dropboxを使用してJavaScriptを読み込もうとしたんですが上手くいきませんでした（＾＾；） 
どうやら2012年8月ごろからファイル共有の仕組みが変わったようで、ネット上にまだ情報が出回っていないように感じました

　折りたたみ機能実装のもう一つの選択として「readmore.js」というプラグインがあります
最初はこちらを使用したスクリプトを作成していましたが、外部ファイルの問題で挫折しました

　外部ストレージは、Dropbox、Skydriveの二つを試しましたがうまくいきませんでした
他の選択としてGoogleドライブもあるので、今度試してみようと思います

あと、折りたたみ機能を実装に伴い、ブログがとても簡素に見えるようになりました
このままでは、ただみすぼらしい印象をうけなくもないためさらなるデザインの模索をしていきたいと思います
いずれはテンプレートを公開できたらいいですね