This Tip makes use of the cbHasField snippet, included in the ContentBlocks core, to do it all automatically without having to worry about it as editor.
In this case, we’re using the Displaying (MODX) Code tip as example. We want to only load our syntax highlight script, in this case Prism, when we have a code input in the content.
Prism consists of two files you’ll need on your server, a CSS file (which should go into the
</body>). Let’s assume that you have uploaded these files to /assets/js/prism.css and /assets/style/prism.js, and that the code field you created earlier has an ID of 4.
Using the cbHasField snippet, we would add the following to our template head:
[[cbHasField? &field=`4` &then=`<link rel="stylesheet" href="/assets/style/prism.css">` ]]
And the following to our template footer:
[[cbHasField? &field=`4` &then=`<script src="/assets/js/prism.js">` ]]
And we’re done. Now, whenever we use the Code input, we will load the right resources on that page only.