Space for Newspeak here!
This is all.
Changes I did to make it work
In init.el, overrode (using ":before-until" advice) handling of function
org-html-src-block
from ox-html.el. The change, upon encountering a src_block with language newspeak, exports a div with a classevaluator
used by Ampleforth.js. Place the following advice to the init.el(advice-remove 'org-html-src-block #'org-html-src-block-newspeak) ;; Advice to handle newspeak begin_src end_src. (defun org-html-src-block-newspeak (src-block _contents info) (let* ((code (org-html-format-code src-block info)) (lang (org-element-property :language src-block)) ) (if (string-equal "newspeak" lang) (format "<div class=\"evaluator\" expression = \"%s\"> </div>" code)))) (advice-add 'org-html-src-block :before-until #'org-html-src-block-newspeak)
In the blog org file: Added BEGIN_EXPORT html with 2 sections. First section adds styling on elements with class="evaluator", the second section adds the script with Ampleforth.js. NOTE: This must be at the end, for the script to be at the end of body or after the body.
#+begin_export html <style> img {width: 25px; height: 25px;} </style> <style> .evaluator + pre {display: none;} .preview .evaluator + pre {display: block;} </style> <script type="text/javascript" class="preview" src="/js/Ampleforth.sources.js"></script> <script type="text/javascript" class="preview" src="/js/Ampleforth.js"></script> #+end_export
- Added the following files in the blog directory
$BLOG
(there is where Jekyll serves from):- Added
$BLOG/js/Ampleforth.js
and$BLOG/js/Ampleforth.sources.js
In
$BLOG/img
, added images:"/accept16px.png" "/cancel16px.png" "/disclosureClosedImage.png" "/disclosureTransitionImage.png" "/disclosureOpenImage.png" "/hsDropdownImage.png" "/hsDropdownOutImage.png" "/hsDropdownOverImage.png" "/publicImage.png" "/protectedImage.png" "/privateImage.png" "/hsAddImage.png" "/hsAddOutImage.png" "/hsAddOverImage.png" "/hsDropdownImage.png" "/hsDropdownOutImage.png" "/hsDropdownOverImage.png" "/hsExpandImage.png" "/hsExpandOverImage.png" "/hsExpandDownImage.png" "/hsCollapseImage.png" "/hsCollapseOverImage.png" "/hsCollapseDownImage.png" "/hsHomeImage.png" "/hsHomeOverImage.png" "/hsHomeOutImage.png" "/hsHomeDownImage.png" "/classPresenterImage.png" "/classUnknownImage.png" "/languageNewspeak3.png"
- Added
- In Ampleforth.js: replaced
i.src = ""
withi.src = "/img/"