タクソノミーによるjavascriptの読み込み

We encourage users to post events happening in the community to the community events group on https://www.drupal.org.
musashi.hamura's picture

CMSの初心者です。初めての質問になります。

任意のページのみ、特定のjavascript(今回はmathjax.js)を
ロードする方法を探しています。

数式を使うページのみにタクソノミータームで指定するのがよいと
考えています。

現時点で、以下のとおりにテーマで指定して、全てのページで読み込むことはできています。

●テーマ名.libraries.yml ファイル
math-styling:
js:
//cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG: {}

●テーマ名.themeファイル
function テーマ名_preprocess_page(array &$variables) {
$variables['#attached']['library'][] = 'テーマ名/math-styling';
}

themeファイルの関数の中にIF文でタクソノミータームをチェックして実行する形に
すればよいのではないかと考えているのですが、方法がわかりません。

よろしくお願いします。

Comments

u7aro's picture

表示しているページに関連するタームのオブジェクトを取得するには、ページの種別によって異なりますので、どのような条件で表示されたいのかもう少し情報をいただきたいです。

もし、ノードにタームのフィールドが設定されていて、ノードの詳細ページでその値によって JavaScript を追加されたいと言うことであれば、以下の様なコードで実装可能です。

<?php
function テーマ名_preprocess_page(&$variables) {
  // JavaScript を読み込みたいタームの ID.
  $mathjax_tid = 100;

  // 表示しているページのノードオブジェクトを得る.
  $node = \Drupal::routeMatch()->getParameter('node');

  // field_term はノードに設定されているフィールドのマシン名なので、適宜
  if (isset($node->field_term->target_id) && $node->field_term->target_id == $mathjax_tid) {
    $variables['#attached']['library'][] = 'テーマ名/math-styling';
  }
}

※ ターム ID がハードコーディングになってしまっているので、あまり綺麗ではありません。要件に応じて適宜変更してください。

ご返答ありがとうございます。

musashi.hamura's picture

ご返答ありがとうございます。

目的のページは、基本ページとほぼ同じコンテンツタイプのノードで使用します。
書き忘れいていましたが、drupalのバージョンは8.2です。

$nodeの構成や中身を勉強して、トライしてみます。
進みましたら、報告します。

動作しました

musashi.hamura's picture

var_dump($node)で$nodeの中身を表示させてタームを探し、タームIDを確認、コードを動作させることができました。

ありがとうございました。

FA: "JS injector"

kamihicouki's picture

任意のページのみ、特定のjavascript(今回はmathjax.js)を
ロードする方法を探しています。

上記を実現するのがまさに JS injector かと思われます。

JS

blauerberg's picture

JS injectorはユーザーが頻繁にちょっとjsを変更したい、というようなケースでは便利なのですが、
gitなどのツールでサイト全体としてコードの管理ができなくなるのと、
使い方によってはキャッシュが効きにくくなる問題があります。

また、8.xはまだstableが出ていないのでproduction環境で使うのはオススメしません。
(上に上げた問題があるので、stableが出たとしてもproduction環境で使うのはオススメしませんが。。)

kamihicouki's picture

すいません。ついでながらで失礼なのですが...

gitなどのツールでサイト全体としてコードの管理ができなくなるのと、

上記に関して "Git を使ってDrupal全体を管理するベストプラクティスが知りたい" と前々から思っていたのですが、どこかまとまったドキュメントなどご存知でしょうか?(英語でもおkです

ちなみにGitで管理する・したいのは、モジュール等のコード開発というよりDrupalサイトの構築・運用段階に入ってからです。モジュールのバージョンアップやテーマの変更など。。
簡単に言えばファイルシステムとデータベースをセットで版管理できればいいなぁ〜という具合です。

上記のようなことを実現する概念や言葉など、なにか糸口になるものを教えていただけると幸いです。

js injector

musashi.hamura's picture

blauerberg様

js injectorが動いても、利用は開発段階などに
留めるようにします。

コメント、ありがとうございました。
(書籍等、参考にさせていただいています)

JS injector

musashi.hamura's picture

ご返答、ありがとうございます。
JS injector、まさにその通りだと思います。

トライしてみましたが、インストールはできているのですが、
Ruleの設定の画面が現れませんでした。
バージョン8向けがまだ開発中となっていることに関係して
いるかもしれません。

インストールの選択が必要なjavascriptファイルが多くないため、
とりあえず今回は、テーマ名.themeファイルでフックする形で
対処することにします。

もう少し実力がついたら、JS injectorの動作について、デバッグに
挑戦してみたいと思います。

ありがとうございました。