みーのぺーじ

みーが趣味でやっているPCやソフトウェアについて.Python, Javascript, Processing, Unityなど.

DrupalでTree状のかっこいいカテゴリBlockを作成する

Drupalで、タクソノミーを活かした、Tree状のカテゴリBlockを作成する方法を、備忘録も兼ねてまとめておきます。目指すのはこんな感じ↓

f:id:atsuhiro-me:20151103003742p:plain:w300

StructureにてViewsを選択する。当然Viewsモジュールはインストールしておくこと。ちなみにDrupalのバージョンは7である。

f:id:atsuhiro-me:20151103003745p:plain:w300

Add new viewをクリック。

f:id:atsuhiro-me:20151103003747p:plain:w300

下のようにタクソノミーtermsをblockに表示する設定にする。

f:id:atsuhiro-me:20151103003748p:plain:w300

FieldsのAddから、Taxonomy term: Name と、 Taxonomy term: Term IDを選択。Term IDは以下、tidと略す。

f:id:atsuhiro-me:20151103003750p:plain:w300

create labelのチェックを外しておく。

f:id:atsuhiro-me:20151103003753p:plain:w300

advancedのrelationshipsからTaxonomy term: Parent termを選択。

f:id:atsuhiro-me:20151103003755p:plain:w300

以下の写真のように追加されていることを確認する。

f:id:atsuhiro-me:20151103003757p:plain:w300

もう一度、tidをfieldに追加。

f:id:atsuhiro-me:20151103003759p:plain:w300

RelationshipのところにParentを指定し、表示から外すにチェック。

f:id:atsuhiro-me:20151103003803p:plain:w300

BlockのSettingにて、List typeをOrdered listにし、次のらんで、tidを選択し、その次にrelationshipでparentにしたtidを選択する。

f:id:atsuhiro-me:20151103003805p:plain:w300

すると以下のようにちょっといい感じになる。Auto PreviewをONにしておくと便利。

f:id:atsuhiro-me:20151103003808p:plain:w300

AdvancedのAggregateをオンにする。

f:id:atsuhiro-me:20151103003810p:plain:w300

こんな感じ。

f:id:atsuhiro-me:20151103003812p:plain:w300

relationshipにTaxonomy term: Content with termを追加。

f:id:atsuhiro-me:20151103003814p:plain:w300

Identifierはnodeと初期設定のままでよい。

f:id:atsuhiro-me:20151103003816p:plain:w300

fieldに、Content: Nidを追加。

f:id:atsuhiro-me:20151103003817p:plain:w300

Aggregation typeに、Countを指定。

f:id:atsuhiro-me:20151103003820p:plain:w300

Relationshipはnodeになっているのを確認し、PrefixとSuffixに()を指定する。これでコンテントの数がカッコ内に表示されるようになる。

f:id:atsuhiro-me:20151103003821p:plain:w300

BlockのSettingにて、Inline filedsでName とCountにチェックを入れる。これでこれらが横一列に表示されるようになる。

f:id:atsuhiro-me:20151103003824p:plain:w300

じゃじゃーんと完成!

f:id:atsuhiro-me:20151103003825p:plain:w300

ちなみに、コンテンツがないtermは表示したくない場合は、以下のような設定をすればよい。まず、Filter criteriaにContent; Nidを追加する。

f:id:atsuhiro-me:20151103003827p:plain:w300

Aggregation typeにCountを設定。

f:id:atsuhiro-me:20151103003830p:plain:w300

OperatorにてValueが0よりis greater thanである場合、と指定する。

f:id:atsuhiro-me:20151103003831p:plain:w300

Filter Criteriaに以下のように追加されたことを確認する。

f:id:atsuhiro-me:20151103003833p:plain:w300

以上でコンテンツがないtermは表示されなくなった。

f:id:atsuhiro-me:20151103003835p:plain:w300

こんな感じでいい感じのカテゴリBlockに仕上げていけば完成!