毎日があっという間に過ぎてゆく。気がついたら秋も終わってた。

IMG_3632

夏には足の靭帯を切って、思うように歩けなくなり、、
秋のイベントのサイト構築と、その他の仕事でバタバタしながらも、週末はできるだけチビの夏休み&ケイの遊びに出掛け、

秋かな~と思ったのも束の間、

気づいたら半袖だけで過ごせない季節になっちゃいました。

去年から入部したPTAバレーでは高身長がゆえに、前衛に抜擢して頂き、、
何とか靭帯もくっついてブロックにジャンプできるまでに復活。

毎日ケイをお散歩に連れて行ってあげたい!というモチベーションが、良いリハビリになったみたいです。

なんだか今年はケガの多い、体調不良の多い季節を過ごしていました。

それでも、少し仕事が落ち着きはじめ、今後に向けたコンテンツのテストやら、溜まった請求書起こしなど。

そんな毎日で、チビは10才、ケイは無事に2才になりました。
塾やおけいこで毎日忙しくしているけど、沢山お手伝いをしてくれるチビ、まだまだハイパーで目が離せないけど、穏やかな性格でどんな犬とも仲良く出来る、大きな口してるけど決して歯を当てることもなく、素直に育っているケイ。

こういう日々が、きっと後からキラキラした思い出になるのだろうね。

IMG_3611

お散歩の後のりんごがだいすきです。

IMG_3158

ベランダで昼寝をするのもだいすきです。

プラグインを使わないでフィルター、ソート機能をつける覚え書き。[MixltUp]

投稿内容の一覧をタイル状に表示して、フィルターやソートをさせたい時はプラグインを使うことも多いけど、jQueryをその分重複して読み込むことになってしまったり、そのせいでスライドショーとか他のライブラリが動かなくなることが多いので、シンプルに機能をつけたかったので、試してみました。
使うライブラリは
MixltUp
というもの。
サイトにソートとフィルターのデモが出ています。

で、これを実際にwordpressのコンテンツのソートに使う場合、

まずはヘッダに必要なものを読み込ませます。
header.php

<?php wp_head(); ?>

の後に記述したら、案の定コンフリクトを起こしたので、前に記述。

<!-- jQuery読み込み -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 
<!-- ソートスクリプト読み込み -->
<script src="http://cdn.jsdelivr.net/jquery.mixitup/latest/jquery.mixitup.min.js"></script>
 
<!-- Javascript -->
<script type="text/javascript">
$(function(){
	// Instantiate MixItUp:
	$('#Container').mixItUp();
});
</script>

cssにはこれを記述。

#Container .mix{
	display: none;
}

後は必要な部分をマークアップするだけ。

フィルタするボタンの部分にそのカテゴリのクラス名を入れる。
このブログだと、

がループされるのでその中にあるクラスのカテゴリ名を指定。

↓フィルタ用のボタン
<div class="filter" data-filter="all">すべて表示</div>
<div class="filter" data-filter=".category-wordpress">カテゴリー(wordpress)</div>
<div class="filter" data-filter=".category-news">カテゴリー(news)</div>
 
↓コンテンツの中身
<div id="Container">
	<!--ここからがループ-->
	<article class="mix category-wordpres">カテゴリー(wordpress)</article>
	<article class="mix category-news">カテゴリー(news)</article>
	<article class="mix category-wordpres">カテゴリー(wordpress)</article>
	<article class="mix category-news">カテゴリー(news)</article>
	<!--//ここまでがループ-->
</div>

1つややこしかったのが、articleのclassに「mix」を足さなくちゃいけないけど、この部分のclassはpost_classで吐き出しているので、直接記述ができない。
そういう場合はその中に追加したいクラス名を入れればいいだけ。

↓これを
<article id="Container post-<?php the_ID(); ?>" <?php post_class(); ?>>
 
↓こう変更する
<article id="Container post-<?php the_ID(); ?>" <?php post_class('mix'); ?>>

これでバッチリフィルタ機能が付けられました。