How to Tell Org-Mode to Embed My CSS File on HTML Export

how to tell org-mode to embed my css file on HTML export?

I faced this problem recently and none of the suggestions/answers worked for me. I finally found a solution in this link, which is to write your own function as follows and put it in you .emacs or init.el file.

(defun my-org-inline-css-hook (exporter)
  "Insert custom inline css"
  (when (eq exporter 'html)
    (let* ((dir (ignore-errors (file-name-directory (buffer-file-name))))
           (path (concat dir "style.css"))
           (homestyle (or (null dir) (null (file-exists-p path))))
           (final (if homestyle "~/.emacs.d/org-style.css" path))) ;; <- set your own style file path
      (setq org-html-head-include-default-style nil)
      (setq org-html-head (concat
                           "<style type=\"text/css\">\n"
                           "<!--/*--><![CDATA[/*><!--*/\n"
                           (with-temp-buffer
                             (insert-file-contents final)
                             (buffer-string))
                           "/*]]>*/-->\n"
                           "</style>\n")))))

(add-hook 'org-export-before-processing-hook 'my-org-inline-css-hook)

Cant get emacs org-mode to use my CSS file

I see no reference to the STYLE option that you're using. The closest thing I find in the org manual refers to HTML_HEAD and HTML_HEAD_EXTRA:

Each exported file contains a compact default style that defines
these classes in a basic way(2). You may overwrite these settings, or
add to them by using the variables org-html-head' and
org-html-head-extra'. You can override the global values of these
variables for each file by using these keywords:

 #+HTML_HEAD: <link rel="stylesheet" type="text/css" href="style1.css" />
 #+HTML_HEAD_EXTRA: <link rel="alternate stylesheet" type="text/css" href="style2.css" />

My org version is 8.0.2.

Exporting org-mode to HTML: In-place coloring

You don't say if this is a one-off or not. css stylesheet makes sense if you need styles. To just do what you describe once, you can include the HTML directive for red in your org file, as follows:

Here is some text that I want in *@@html:<font color = "red">@@BOLD RED@@html:</font>@@*

See the section Quoting HTML tags in the Org manual.

How to label code block evaluations in orgmode on html export?

This should work on reasonably recent org:

    #+name: foo
    #+begin_src cpp -n :includes <iostream> :exports both
    std::cout << "Hello there";
    #+end_src

    Output:

    #+RESULTS: foo
    : Hello there

org-mode with code example as html

The example below is adapted from something similar I've used for writing about Org-mode. It seems to work for your use case too. The #+OPTIONS: d:RESULTS ensures that the :RESULTS: drawer is exported. Put this in an Org-mode buffer and export to HTML.

#+OPTIONS: d:RESULTS

* Examples

The HTML source
#+name: eg-1
#+begin_src org :results replace drawer :exports both :post wrap-html(text=*this*)
  A <b>bold</b> statement.
#+end_src

Results in the output
#+results: eg-1

* Utils                                                           :noexport:
#+name: wrap-html
#+begin_src emacs-lisp :var text="" :results raw
(concat "#+BEGIN_HTML\n<div class=\"html-output\">\n" text "\n</div>\n#+END_HTML")
#+end_src

You can avoid repeating the headers by adding them as properties to the subtree heading, e.g.

* Example 2
:PROPERTIES:
:results: replace drawer
:exports: both
:post: wrap-html(text=*this*)
:END:

#+name: eg-2
#+begin_src org
  Some <i>italic</i>.
#+end_src

#+results: eg-2

#+name: eg-3
#+begin_src org
  You can <b>nest <i>inline</i> tags</b>.
#+end_src

#+results: eg-3

but note that these headers will apply to every source block in the subtree unless explicitly overridden.

emacs org-mode: how to choose font when exporting to HTML?

You have different options, depending on how elaborate you want to get...
Easiest:

#+HTML_HEAD_EXTRA: <style>*{font-family: serif !important}</style>

More advanced:

#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="myStyleSheet.css"/>

You can also put it all into a setup file and include it in your org-file:

#+SETUPFILE: ~/.emacs.d/org-templates/level-0.org

In that file there could be stuff like this (in this case, Charset, your stylesheet, Mathjax for nice Latex-style formulars):

#+HTML_HEAD_EXTRA: <meta charset="utf-8">
#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="static/myStyle.css" />
#+HTML_HEAD_EXTRA: <script async type="text/javascript" src="https://cdn.rawgit.com/mathjax/MathJax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

---

Related Topics