3

When I export an elisp source code block to html, the indentation of the code gets messed up. I've tried calling (setq org-src-preserve-indentation t), but that didn't help. I imagine there is perhaps something in my code that is being wrongly interpreted by org-html-publish-to-html?

As a minimum working example, I try exporting the following org file:

#+TITLE: Test    

Let's check the html output of this file...

#+BEGIN_SRC elisp :tangle yes
(setq org-publish-project-alist
`(("index"
 :with-title nil :base-directory "~/website/org/"
 :base-extension "org" :publishing-directory "~/website/public/html/"
 :headline-levels 3 :section-numbers nil
 :publishing-function org-html-publish-to-html :with-toc nil
 :html-head ,index-html-extra-head
 :html-head-include-default-style nil
 :html-head-include-scripts nil
 :html-preamble nil :html-postamble t)))
#+END_SRC

and as a result comes out the following (notice how the code gets 4 tabs of indentation starting from the 3rd line):

enter image description here HTML here, in case it helps...:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
    <!-- 2016-01-19 Tue 00:08 -->
    <meta  http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <meta  name="viewport" content="width=device-width, initial-scale=1" />
    <title>Test</title>
    <meta  name="generator" content="Org-mode" />
    <meta  name="author" content="name" />
    <style type="text/css">
     <!--/*--><![CDATA[/*><!--*/
     .title  { text-align: center;
             margin-bottom: .2em; }
     .subtitle { text-align: center;
             font-size: medium;
             font-weight: bold;
             margin-top:0; }
     .todo   { font-family: monospace; color: red; }
     .done   { font-family: monospace; color: green; }
     .priority { font-family: monospace; color: orange; }
     .tag    { background-color: #eee; font-family: monospace;
             padding: 2px; font-size: 80%; font-weight: normal; }
     .timestamp { color: #bebebe; }
     .timestamp-kwd { color: #5f9ea0; }
     .org-right  { margin-left: auto; margin-right: 0px;  text-align: right; }
     .org-left   { margin-left: 0px;  margin-right: auto; text-align: left; }
     .org-center { margin-left: auto; margin-right: auto; text-align: center; }
     .underline { text-decoration: underline; }
     #postamble p, #preamble p { font-size: 90%; margin: .2em; }
     p.verse { margin-left: 3%; }
     pre {
         border: 1px solid #ccc;
         box-shadow: 3px 3px 3px #eee;
         padding: 8pt;
         font-family: monospace;
         overflow: auto;
         margin: 1.2em;
     }
     pre.src {
         position: relative;
         overflow: visible;
         padding-top: 1.2em;
     }
     pre.src:before {
         display: none;
         position: absolute;
         background-color: white;
         top: -10px;
         right: 10px;
         padding: 3px;
         border: 1px solid black;
     }
     pre.src:hover:before { display: inline;}
     pre.src-sh:before    { content: 'sh'; }
     pre.src-bash:before  { content: 'sh'; }
     pre.src-emacs-lisp:before { content: 'Emacs Lisp'; }
     pre.src-R:before     { content: 'R'; }
     pre.src-perl:before  { content: 'Perl'; }
     pre.src-java:before  { content: 'Java'; }
     pre.src-sql:before   { content: 'SQL'; }

     table { border-collapse:collapse; }
     caption.t-above { caption-side: top; }
     caption.t-bottom { caption-side: bottom; }
     td, th { vertical-align:top;  }
     th.org-right  { text-align: center;  }
     th.org-left   { text-align: center;   }
     th.org-center { text-align: center; }
     td.org-right  { text-align: right;  }
     td.org-left   { text-align: left;   }
     td.org-center { text-align: center; }
     dt { font-weight: bold; }
     .footpara { display: inline; }
     .footdef  { margin-bottom: 1em; }
     .figure { padding: 1em; }
     .figure p { text-align: center; }
     .inlinetask {
         padding: 10px;
         border: 2px solid gray;
         margin: 10px;
         background: #ffffcc;
     }
     #org-div-home-and-up
     { text-align: right; font-size: 70%; white-space: nowrap; }
     textarea { overflow-x: auto; }
     .linenr { font-size: smaller }
     .code-highlighted { background-color: #ffff00; }
     .org-info-js_info-navigation { border-style: none; }
     #org-info-js_console-label
     { font-size: 10px; font-weight: bold; white-space: nowrap; }
     .org-info-js_search-highlight
     { background-color: #ffff00; color: #000000; font-weight: bold; }
     /*]]>*/-->
    </style>
    </head>
    <body>
    <div id="content">
        <h1 class="title">Test</h1>
        <p>
        Let's check the html output of this file.
        </p>

        <div class="org-src-container">

        <pre class="src src-elisp"><span style="color: #268bd2;">(</span><span style="color: #859900;">setq</span> org-publish-project-alist
`<span style="color: #2aa198;">(</span><span style="color: #b58900;">(</span><span style="color: #2aa198;">"index"</span>
            <span style="color: #859900;">:with-title</span> nil <span style="color: #859900;">:base-directory</span> <span style="color: #2aa198;">"~/website/org/"</span>
            <span style="color: #859900;">:base-extension</span> <span style="color: #2aa198;">"org"</span> <span style="color: #859900;">:publishing-directory</span> <span style="color: #2aa198;">"~/website/public/html/"</span>
            <span style="color: #859900;">:headline-levels</span> 3 <span style="color: #859900;">:section-numbers</span> nil
            <span style="color: #859900;">:publishing-function</span> org-html-publish-to-html <span style="color: #859900;">:with-toc</span> nil
            <span style="color: #859900;">:html-head</span> ,index-html-extra-head
            <span style="color: #859900;">:html-head-include-default-style</span> nil
            <span style="color: #859900;">:html-head-include-scripts</span> nil
            <span style="color: #859900;">:html-preamble</span> nil <span style="color: #859900;">:html-postamble</span> t<span style="color: #b58900;">)</span><span style="color: #2aa198;">)</span><span style="color: #268bd2;">)</span>
        </pre>
        </div>
    </div>
    </body>
</html>

Emacs 25 with latest org-mode.
How to get the indentation correctly?!

  • Does work ok for me (emacs 24.5.1 org 8.3.1) – JeanPierre Jan 18 '16 at 23:55
  • 1
    What if you C-' on the code block and then select all and indent? The code seems to be shifted one colon to the left from where it would normally be. Not sure this is a problem, but you never know... – wvxvw Jan 19 '16 at 12:58
  • 1
    thanks for the suggestion. I tried it but it still gives me the same result... – dangom Jan 19 '16 at 14:49
  • 1
    Indeed, the problem disappears if I try it on an emacs -Q session. I guess I'll have to go through my init.el to find out what is going on. Any suggestions on something specific to look for? – dangom Jan 20 '16 at 7:24
  • 1
    @Gastove I don't remember if I ever solved it. I think it had something to do with the quotes and backquotes, but I really don't remember. Since I asked the question I've rewritten my org-publish-project-alist and my css files. I also switched to spacemacs some time ago, and the problem kinda dissapeared. Did you find anything in the meantime? – dangom May 29 '17 at 14:12
0

I had the same problem. The other variable that has in impact on indentation in html files is org-html-indent. I fixed this by setting it to true in my config file: (setq org-html-indent t). The docs say that this should break it (in most cases), so you may just need to switch it to the opposite value of whatever you have it.

From the docs:

org-html-indent is a variable defined in ‘ox-html.el’. Its value is nil

Documentation: Non-nil means to indent the generated HTML. Warning: non-nil may break indentation of source code blocks.

We're looking for long answers that provide some explanation and context. Don't just give a one-line answer; explain why your answer is right, ideally with citations. Answers that don't include explanations may be removed.

  • That sets the indentation of the html ie where the < go. Op wants to control what is shiwn – user151019 Apr 6 at 20:36
  • Yes I know what its supposed to do, but this actually fixed the problem for me. I had that same issue where the 3rd line onward gets 4 lines of indentation. – Davey Apr 6 at 23:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.