How to enable Prism on DT 3.5?

DEVONthink
17

Devonthink team thanks for the 3.5 update. I feel there’s a need to outline how to use the custom Prism file since it helped me centralize my SQL, Visual Basic, Batch, Powershell, etc. code syntax, snippets and historical versions into DT as opposed to having them scattered across two other apps and Outlook folders. Code-block works on both Devonthink Mac and iOS as shown below using this method.

iOS Screenshot

IMG_386DA0F6DD1C-1
IMG_386DA0F6DD1C-11242×2688 302 KB

One Time Setup on Mac

  • Go to prism website

  • Click the big download button at the top

  • Check off the theme and languages you will be using

  • (Optional) Check off plugins like Inline Color, Normalize Whitespace (for removing extra lines in rendered code), and Copy to Clipboard Button. Unfortunately, Line Numbers didn’t work for me at the time of this writting.

  • Download both the CSS and Javascript file using the big download buttons on the bottom of the page.

    • If you are using Normalize Whitespace and want your code to wrap around, insert the “break-line”: 80 line into the javascript file method Prism.plugins.NormalizeWhitespace as shown below.
	(Prism.plugins.NormalizeWhitespace=new e({"remove-trailing":!0,"remove-indent":!0,"left-trim":!0,"right-trim":!0,"break-lines": 80})

Be sure to check your quotes whenever you copy / paste as the open/close quotes can be copied instead of the general quote used in code

  • Place both files in your database
  • Copy the Item link for each file by left clicking on the file and paste the x-link between the quotes like shown below:

For CSS File

<link href=“x-devonthink-item://0A9B8CBC-D620-4257-B1A8-71E363C0EDBA” rel=“stylesheet”>

For Javascript file

<script src=“x-devonthink-item://96C2CDA1-86FE-4DE4-8924-92C7541A432C”></script>

  • using the devonthink item link allows you to move the files around the db without breaking the connection

  • place this at the top of every markdown document where you would like to use the code-block, I use a text expander to automatically insert it by typing .syntax

  • As mentioned above, prism uses the language-xxxx in the code-block to identify the language you are working with.

    • The language must be spelled out just like it is listed in the prism website otherwise it will not highlight ie. use language-excel-formula NOT language-excel

  • Be sure to save the document to see the code-block highlight or when changing from one language to another

    • Reboot Devonthink if necessary

:sunglasses:

4 Likes